fix: new routes | fixed app routes

Route.tsx

@@ -18,6 +18,8 @@ import TravelsScreen from './src/screens/InAppScreens/TravelsScreen';
 import ProfileScreen from './src/screens/InAppScreens/ProfileScreen';
 import TravellersScreen from './src/screens/InAppScreens/TravellersScreen';
 
+import { EditPersonalInfo } from './src/screens/InAppScreens/ProfileScreen/Profile/edit-personal-info';
+
 import { NAVIGATION_PAGES } from './src/types';
 import { storageGet } from './src/storage';
 import { openDatabases } from './src/db';
@@ -43,10 +45,10 @@ const Route = () => {
       await openDatabases();
       setDbLoaded(true);
     };
-  
+
     prepareApp();
   }, []);
-  
+
   useEffect(() => {
     const hideSplashScreen = async () => {
       if (fontsLoaded && dbLoaded) {
@@ -55,7 +57,7 @@ const Route = () => {
     };
 
     hideSplashScreen();
-  }, [fontsLoaded, dbLoaded]); 
+  }, [fontsLoaded, dbLoaded]);
 
   if (!fontsLoaded) {
     return null;
@@ -64,22 +66,23 @@ const Route = () => {
   let token: string | null = '';
   storageGet('token').then((data) => (token = data));
 
-  const screenOptions = ({ route }: { route: RouteProp<ParamListBase, string>; navigation: any; }) => ({
+  const screenOptions = ({
+    route
+  }: {
+    route: RouteProp<ParamListBase, string>;
+    navigation: any;
+  }) => ({
     headerShown: false,
     tabBarButton: (props: any) => (
-      <TabBarButton
-        {...props}
-        label={route.name}
-        focused={props.accessibilityState.selected}
-      />
+      <TabBarButton {...props} label={route.name} focused={props.accessibilityState.selected} />
     ),
     tabBarStyle: {
       ...Platform.select({
         android: {
-          height: 58,
-        },
-      }),
-    },
+          height: 58
+        }
+      })
+    }
   });
 
   return (
@@ -98,13 +101,24 @@ const Route = () => {
       />
       <ScreenStack.Screen name={NAVIGATION_PAGES.IN_APP}>
         {() => (
-          <BottomTab.Navigator
-            screenOptions={screenOptions}
-          >
+          <BottomTab.Navigator screenOptions={screenOptions}>
             <BottomTab.Screen name={NAVIGATION_PAGES.MAP_TAB} component={MapScreen} />
             <BottomTab.Screen name={NAVIGATION_PAGES.TRAVELLERS_TAB} component={TravellersScreen} />
             <BottomTab.Screen name={NAVIGATION_PAGES.TRAVELS_TAB} component={TravelsScreen} />
-            <BottomTab.Screen name={NAVIGATION_PAGES.PROFILE_TAB} component={ProfileScreen} />
+            <BottomTab.Screen name={NAVIGATION_PAGES.IN_APP_PROFILE}>
+              {() => (
+                <ScreenStack.Navigator screenOptions={screenOptions}>
+                  <ScreenStack.Screen
+                    name={NAVIGATION_PAGES.PROFILE_TAB}
+                    component={ProfileScreen}
+                  />
+                  <ScreenStack.Screen
+                    name={NAVIGATION_PAGES.EDIT_PERSONAL_INFO}
+                    component={EditPersonalInfo}
+                  />
+                </ScreenStack.Navigator>
+              )}
+            </BottomTab.Screen>
           </BottomTab.Navigator>
         )}
       </ScreenStack.Screen>

src/types/navigation.ts

@@ -9,5 +9,7 @@ export enum NAVIGATION_PAGES {
   MAP_TAB = 'Map',
   TRAVELS_TAB = 'Travels',
   TRAVELLERS_TAB = 'Travellers',
-  PROFILE_TAB = 'Profile'
+  IN_APP_PROFILE = 'Profile',
+  PROFILE_TAB = 'inAppProfile',
+  EDIT_PERSONAL_INFO = 'editPersonalInfo'
 }