80 lines
2.8 KiB
TypeScript
80 lines
2.8 KiB
TypeScript
/*
|
|
* File: RootStackNavigator.tsx
|
|
* Description: Root stack navigator managing authentication and main app flow
|
|
* Design & Developed by Tech4Biz Solutions
|
|
* Copyright (c) Spurrin Innovations. All rights reserved.
|
|
*/
|
|
|
|
import React from 'react';
|
|
import { createStackNavigator } from '@react-navigation/stack';
|
|
import { AuthStackNavigator } from '../modules/Auth/navigation';
|
|
import { MainTabNavigator } from './MainTabNavigator';
|
|
import { RootStackParamList } from './navigationTypes';
|
|
import { useAppSelector } from '../store/hooks';
|
|
import { selectIsAuthenticated, selectIsOnboarded } from '../modules/Auth/redux/authSelectors';
|
|
import ResetPasswordScreen from '../modules/Auth/screens/ResetPasswordScreen';
|
|
|
|
// Create the stack navigator
|
|
const Stack = createStackNavigator<RootStackParamList>();
|
|
|
|
/**
|
|
* RootStackNavigatorProps Interface
|
|
*
|
|
* Purpose: Defines the props required by the RootStackNavigator component
|
|
*
|
|
* Props:
|
|
* - isAuthenticated: Boolean indicating if user is logged in
|
|
*/
|
|
interface RootStackNavigatorProps {
|
|
isAuthenticated: boolean;
|
|
}
|
|
|
|
/**
|
|
* RootStackNavigator Component
|
|
*
|
|
* Purpose: Manages the main navigation flow between authentication, onboarding, and main app
|
|
*
|
|
* Navigation Flow:
|
|
* 1. App starts → Check authentication status
|
|
* 2. If not authenticated → Show AuthStackNavigator (LoginScreen)
|
|
* 3. If authenticated but not onboarded → Show ResetPasswordScreen
|
|
* 4. If authenticated and onboarded → Show MainTabNavigator (dashboard)
|
|
*
|
|
* Features:
|
|
* - Conditional rendering based on authentication and onboarding status
|
|
* - Seamless transition between auth, onboarding, and main app
|
|
* - Proper prop passing to child components
|
|
* - Hidden headers for custom styling
|
|
*/
|
|
export const RootStackNavigator: React.FC<RootStackNavigatorProps> = ({
|
|
isAuthenticated,
|
|
}) => {
|
|
// Get onboarding status from Redux
|
|
const isOnboarded = useAppSelector(selectIsOnboarded);
|
|
|
|
return (
|
|
<Stack.Navigator
|
|
screenOptions={{
|
|
headerShown: false, // Hide default headers for custom styling
|
|
}}
|
|
>
|
|
{/* Conditional rendering based on authentication and onboarding status */}
|
|
{!isAuthenticated ? (
|
|
// Show auth stack if user is not authenticated
|
|
<Stack.Screen name="Auth" component={AuthStackNavigator} />
|
|
) : !isOnboarded ? (
|
|
// Show reset password screen if user is authenticated but not onboarded
|
|
<Stack.Screen name="ResetPassword" component={ResetPasswordScreen} />
|
|
) : (
|
|
// Show main app tabs if user is authenticated and onboarded
|
|
<Stack.Screen name="Main" component={MainTabNavigator} />
|
|
)}
|
|
</Stack.Navigator>
|
|
);
|
|
};
|
|
|
|
/*
|
|
* End of File: RootStackNavigator.tsx
|
|
* Design & Developed by Tech4Biz Solutions
|
|
* Copyright (c) Spurrin Innovations. All rights reserved.
|
|
*/
|