Pushing the hiding headers when we are in login page

src/components/navigators/AccountNavigator/AccountNavigator.interfaces.ts

@@ -0,0 +1,11 @@
+export enum ACCOUNT_NAVIGATOR_ROUTES {
+  LOGIN = 'LOGIN',
+  REGISTER = 'REGISTER',
+  PROFILE = 'PROFILE',
+}
+
+export type AccountNavigatorParamList = {
+  [ACCOUNT_NAVIGATOR_ROUTES.LOGIN]: undefined;
+  [ACCOUNT_NAVIGATOR_ROUTES.REGISTER]: undefined;
+  [ACCOUNT_NAVIGATOR_ROUTES.PROFILE]: undefined;
+};

src/components/navigators/AccountNavigator/AccountNavigator.tsx

@@ -3,25 +3,45 @@ import {useSelector} from 'react-redux';
 
 import {createNativeStackNavigator} from '@react-navigation/native-stack';
 import Example from '../../../screens/example/example.tsx';
-import {ACCOUNT_NAVIGATOR_ROUTES} from './account-navigator.interfaces.ts';
+import {
+  ACCOUNT_NAVIGATOR_ROUTES,
+  AccountNavigatorParamList,
+} from './AccountNavigator.interfaces.ts';
+import LoginScreen from '../../../screens/login/LoginScreen.tsx';
 
-const Stack = createNativeStackNavigator();
+const Stack = createNativeStackNavigator<AccountNavigatorParamList>();
 
 export default function AccountNavigator() {
   // @ts-ignore
   const {user} = useSelector(state => state.user);
+  if (user) {
+    return (
+      <Stack.Navigator
+        initialRouteName={ACCOUNT_NAVIGATOR_ROUTES.PROFILE}
+        screenOptions={{
+          headerShown: false,
+          orientation: 'portrait_up',
+        }}>
+        <Stack.Screen
+          name={ACCOUNT_NAVIGATOR_ROUTES.PROFILE}
+          component={Example}
+        />
+      </Stack.Navigator>
+    );
+  }
   return (
     <Stack.Navigator
-      initialRouteName={
-        user ? ACCOUNT_NAVIGATOR_ROUTES.LOGIN : ACCOUNT_NAVIGATOR_ROUTES.PROFILE
-      }
+      initialRouteName={ACCOUNT_NAVIGATOR_ROUTES.LOGIN}
       screenOptions={{
         headerShown: false,
         orientation: 'portrait_up',
       }}>
-      <Stack.Screen name={ACCOUNT_NAVIGATOR_ROUTES.LOGIN} component={Example} />
       <Stack.Screen
-        name={ACCOUNT_NAVIGATOR_ROUTES.PROFILE}
+        name={ACCOUNT_NAVIGATOR_ROUTES.LOGIN}
+        component={LoginScreen}
+      />
+      <Stack.Screen
+        name={ACCOUNT_NAVIGATOR_ROUTES.REGISTER}
         component={Example}
       />
     </Stack.Navigator>

src/components/navigators/TabBarNavigation/TabNavigator.interfaces.ts

@@ -0,0 +1,15 @@
+export enum TAB_BAR_NAVIGATOR_ROUTES {
+  ACCOUNT = 'ACCOUNT',
+  CARROT = 'CARROT',
+  SEARCH = 'SEARCH',
+  QRSCAN = 'QRSCAN',
+  PLATE = 'PLATE',
+}
+
+export type TabBarNavigatorParamList = {
+  [TAB_BAR_NAVIGATOR_ROUTES.ACCOUNT]: undefined;
+  [TAB_BAR_NAVIGATOR_ROUTES.CARROT]: undefined;
+  [TAB_BAR_NAVIGATOR_ROUTES.SEARCH]: undefined;
+  [TAB_BAR_NAVIGATOR_ROUTES.QRSCAN]: undefined;
+  [TAB_BAR_NAVIGATOR_ROUTES.PLATE]: undefined;
+};

src/components/navigators/TabBarNavigation/TabNavigator.tsx

@@ -6,11 +6,15 @@ import {useNavigation} from '@react-navigation/native';
 
 import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
 import AccountNavigator from '../AccountNavigator';
-import {ACCOUNT_NAVIGATOR_ROUTES} from '../AccountNavigator/account-navigator.interfaces.ts';
+import {ACCOUNT_NAVIGATOR_ROUTES} from '../AccountNavigator/AccountNavigator.interfaces.ts';
 import CarrotScreen from '../../../screens/carrot/CarrotScreen';
 import AsyncStorage from '@react-native-async-storage/async-storage';
+import {
+  TAB_BAR_NAVIGATOR_ROUTES,
+  TabBarNavigatorParamList,
+} from './TabNavigator.interfaces.ts';
 
-const Tab = createBottomTabNavigator();
+const Tab = createBottomTabNavigator<TabBarNavigatorParamList>();
 
 const PlateScreen = () => null;
 const QRScanScreen = () => null;
@@ -26,7 +30,7 @@ const TabNavigator = () => {
       } else {
         console.log('user token not found');
         // @ts-ignore
-        navigate('Account');
+        navigate(TAB_BAR_NAVIGATOR_ROUTES.LOGIN);
       }
     });
   }, [navigate]);
@@ -37,42 +41,52 @@ const TabNavigator = () => {
     ({color, size}: {color: ColorValue; size: number}) =>
       <Icon name={name} color={color} size={size} />;
   return (
-    <Tab.Navigator initialRouteName="Carrot">
+    <Tab.Navigator
+      initialRouteName={TAB_BAR_NAVIGATOR_ROUTES.ACCOUNT}
+      screenOptions={{
+        headerShown: false,
+      }}>
       <Tab.Screen
-        name="Carrot"
+        name={TAB_BAR_NAVIGATOR_ROUTES.CARROT}
         component={CarrotScreen}
         options={{
           tabBarIcon: renderIcon('carrot'),
         }}
       />
       <Tab.Screen
-        name="Plate"
+        name={TAB_BAR_NAVIGATOR_ROUTES.PLATE}
         component={PlateScreen}
         options={{
           tabBarIcon: renderIcon('food'),
         }}
       />
       <Tab.Screen
-        name="QRScan"
+        name={TAB_BAR_NAVIGATOR_ROUTES.QRSCAN}
         component={QRScanScreen}
         options={{
           tabBarIcon: renderIcon('qrcode-scan'),
         }}
       />
       <Tab.Screen
-        name="Search"
+        name={TAB_BAR_NAVIGATOR_ROUTES.SEARCH}
         component={SearchScreen}
         options={{
           tabBarIcon: renderIcon('magnify'),
         }}
       />
       <Tab.Screen
-        name="Account"
+        name={TAB_BAR_NAVIGATOR_ROUTES.ACCOUNT}
         component={AccountNavigator}
         options={({route}) => {
           const routeName = getFocusedRouteNameFromRoute(route) ?? '';
-          if (routeName === ACCOUNT_NAVIGATOR_ROUTES.LOGIN) {
-            console.log('routeName', routeName);
+          console.log(routeName);
+
+          if (routeName === ACCOUNT_NAVIGATOR_ROUTES.PROFILE) {
+            return {
+              tabBarIcon: renderIcon('account'),
+            };
+          }
+          if (routeName === ACCOUNT_NAVIGATOR_ROUTES.LOGIN || routeName === ACCOUNT_NAVIGATOR_ROUTES.REGISTER) {
             return {
               tabBarStyle: {
                 display: 'none',