feat : Première navigation

src/app/(tabs)/_layout.tsx

@@ -1,5 +1,8 @@
+import { BahlaTabBar } from '@/components/navigation/BahlaTabBar';
 import { useAuth } from '@/stores/authStore';
-import { Redirect, Stack } from 'expo-router';
+import { colors } from '@/theme/colors';
+import { Redirect, Tabs } from 'expo-router';
+import { Compass, Map, Ticket, UserRound } from 'lucide-react-native';
 
 export default function TabsLayout() {
     const session = useAuth((state) => state.session);
@@ -8,5 +11,42 @@ export default function TabsLayout() {
 
     if (session.role === 'org') return <Redirect href="../(org)" />;
 
-    return <Stack screenOptions={{ headerShown: false}} />;
+    return (
+        <Tabs
+            screenOptions={{
+                headerShown: false,
+                sceneStyle: { backgroundColor: colors.deepBackground },
+            }}
+            tabBar={(props) => <BahlaTabBar {...props} />}
+        >
+            <Tabs.Screen
+                name="index"
+                options={{
+                    title: 'Découvrir',
+                    tabBarIcon: ({ color, size }) => <Compass color={color} size={size} />,
+                }}
+            />
+            <Tabs.Screen
+                name="map"
+                options={{
+                    title: 'Carte',
+                    tabBarIcon: ({ color, size }) => <Map color={color} size={size} />,
+                }}
+            />
+            <Tabs.Screen
+                name="my-events"
+                options={{
+                    title: 'Mes events',
+                    tabBarIcon: ({ color, size }) => <Ticket color={color} size={size} />,
+                }}
+            />
+            <Tabs.Screen
+                name="profile"
+                options={{
+                    title: 'Profil',
+                    tabBarIcon: ({ color, size }) => <UserRound color={color} size={size} />,
+                }}
+            />
+        </Tabs>
+    );
 }