feat(front): add main navigator

front/assets/translations/en_US.json

@@ -28,12 +28,14 @@
     }
   },
   "messaging": {
+    "messages": "Messages",
     "info": {
       "messageChannel": "Messages",
       "textInputPlaceholer": "Your message"
     }
   },
   "profile": {
+    "profile": "Profile",
     "create": "Create your profile",
     "info": {
       "contact": "Contact",
@@ -59,7 +61,6 @@
       "lastName": "Last name",
       "shortBiography": "Biography",
       "updateProfile": "Update profile",
-      "profile": "Profile",
       "gender": "Gender",
       "genders": {
         "male": "Male",
@@ -118,5 +119,11 @@
     "belarus": "Belarusian",
     "france": "French",
     "germany": "German"
+  },
+  "home": {
+    "home": "Home"
+  },
+  "applications": {
+    "applications": "Applications"
   }
 }

front/assets/translations/fr_FR.json

@@ -28,6 +28,7 @@
     }
   },
   "messaging": {
+    "messages": "Messages",
     "info": {
       "messageChannel": "Messages",
       "textInputPlaceholer": "Votre message"
@@ -118,5 +119,11 @@
     "belarus": "Biélorusse",
     "france": "Français",
     "germany": "Allemand"
+  },
+  "home": {
+    "home": "Accueil"
+  },
+  "applications": {
+    "applications": "Candidatures"
   }
 }

front/src/pages/LoggedInNav.tsx

@@ -1,7 +1,7 @@
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
-import InternalTabNav from '@/pages/InternalTabNav';
+import MainTabNav from '@/pages/MainTabNav';
 import FirstLoginPage from '@/pages/login/FirstLoginPage';
 import { useGetProfileQuery } from '@/store/api/profileApiSlice';
 
@@ -47,7 +47,7 @@ const LoggedInNav = () => {
           }}
         />
       ) : (
-        <LoggedInStack.Screen name='Main' component={InternalTabNav} />
+        <LoggedInStack.Screen name='Main' component={MainTabNav} />
       )}
     </LoggedInStack.Navigator>
   );

front/src/pages/MainTabNav.tsx

@@ -0,0 +1,90 @@
+import { createMaterialBottomTabNavigator } from 'react-native-paper/react-navigation';
+import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
+
+import InternalPagesNav from '@/pages/internal/InternalPagesNav';
+import JobOffersNav from '@/pages/jobOffer/JobOfferNav';
+import MessagingNav from '@/pages/messaging/MessagingNav';
+import ProfileNav from '@/pages/profile/ProfileNav';
+import i18n from '@/utils/i18n';
+
+/**
+ * The parameter list for the MainTab navigator.
+ */
+
+export type MainTabParamList = {
+  Home: undefined;
+  Applications: undefined;
+  Messages: undefined;
+  Profile: undefined;
+};
+
+const MainTab = createMaterialBottomTabNavigator<MainTabParamList>();
+
+/**
+ * The tabbed navigator for the main pages.
+ * @constructor
+ */
+const MainTabNav = () => {
+  return (
+    <MainTab.Navigator>
+      <MainTab.Screen
+        name='Home'
+        component={JobOffersNav}
+        options={{
+          tabBarLabel: i18n.t('home.home'),
+          tabBarIcon: ({ color }) => (
+            <MaterialCommunityIcons
+              name='home-outline'
+              color={color}
+              size={24}
+            />
+          ),
+        }}
+      />
+      <MainTab.Screen
+        name='Applications'
+        component={InternalPagesNav}
+        options={{
+          tabBarLabel: i18n.t('applications.applications'),
+          tabBarIcon: ({ color }) => (
+            <MaterialCommunityIcons
+              name='inbox-outline'
+              color={color}
+              size={24}
+            />
+          ),
+        }}
+      />
+      <MainTab.Screen
+        name='Messages'
+        component={MessagingNav}
+        options={{
+          tabBarLabel: i18n.t('messaging.messages'),
+          tabBarIcon: ({ color }) => (
+            <MaterialCommunityIcons
+              name='message-text-outline'
+              color={color}
+              size={24}
+            />
+          ),
+        }}
+      />
+      <MainTab.Screen
+        name='Profile'
+        component={ProfileNav}
+        options={{
+          tabBarLabel: i18n.t('profile.profile'),
+          tabBarIcon: ({ color }) => (
+            <MaterialCommunityIcons
+              name='account-circle-outline'
+              color={color}
+              size={24}
+            />
+          ),
+        }}
+      />
+    </MainTab.Navigator>
+  );
+};
+
+export default MainTabNav;

front/src/pages/jobOffer/JobOfferNav.tsx

@@ -29,7 +29,7 @@ const JobOffersNav = () => {
       <JobOfferStack.Screen
         name='JobOfferList'
         component={JobOfferListPage}
-        options={{ headerTitle: `${i18n.t('jobOffer.info.jobOfferList')}` }}
+        options={{ headerTitle: `${i18n.t('home.home')}` }}
       />
       <JobOfferStack.Screen
         name='JobOffer'

front/src/pages/profile/ProfileNav.tsx

@@ -50,12 +50,12 @@ const ProfileNav = () => {
       <ProfileStack.Screen
         name='Profile'
         component={ProfilePage}
-        options={{ headerTitle: `${i18n.t('profile.info.profile')}` }}
+        options={{ headerTitle: `${i18n.t('profile.profile')}` }}
       />
       <ProfileStack.Screen
         name='ProfileUpdate'
         component={ProfileUpdatePage}
-        options={{ headerTitle: `${i18n.t('profile.info.profile')}` }}
+        options={{ headerTitle: `${i18n.t('profile.profile')}` }}
       />
 
       <ProfileStack.Screen