auth with handler

app/(tabs)/_layout.tsx

@@ -1,33 +1,27 @@
-import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { Tabs } from 'expo-router';
-import { } from 'expo-router';
 import React from 'react';
 import { HapticTab } from '@/components/expoExempleComponents/haptic-tab';
 import { IconSymbol } from '@/components/ui/icon-symbol';
 import { Colors } from '@/constants/theme';
 import { useColorScheme } from '@/hooks/use-color-scheme';
-import GestionOuvrier from './gestion_ouvrier';
-import ListMateriel from './gestionnaire_ressource';
-import Home from './home';
-import MapScreen from './mapScreen';
 import AntDesign from '@expo/vector-icons/AntDesign';
-import AddScreen from './addScreen';
+import { useUser } from '../ContextUser';
-
+import { useAuthHandler } from '../AuthHandler';
-const Tabs = createBottomTabNavigator();
 
 export default function TabLayout() {
   const colorScheme = useColorScheme();
+  const { role } = useUser();
+  
+  // Handle auth in tabs layout
+  useAuthHandler();
 
   return (
-    <Tabs.Navigator
+    <Tabs screenOptions={{tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint, headerShown: false, tabBarButton: HapticTab}}>
-      initialRouteName='explore'
+      <Tabs.Screen name="index" options={{ href: null}}/>
-      screenOptions={{
+      <Tabs.Screen name="explore" options={{ href: null }}/>
-        tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
+      <Tabs.Screen name="templateSreen" options={{ href: null}}/>
-        headerShown: false,
-        tabBarButton: HapticTab,
-      }}>
       <Tabs.Screen
         name="home"
-        component={Home}
         options={{
           title: 'Home',
           tabBarIcon: ({ color }) => (
@@ -37,7 +31,6 @@ export default function TabLayout() {
       />
       <Tabs.Screen
         name="gestionnaire_ressource"
-        component={ListMateriel}
         options={{
           title: 'Ressources',
           tabBarIcon: ({ color }) => (
@@ -46,34 +39,29 @@ export default function TabLayout() {
         }}
       />
       <Tabs.Screen
-        name="GestionOuvrier"
+        name="gestion_ouvrier"
-        component={GestionOuvrier}
         options={{
           title: 'Ouvriers',
           tabBarIcon: ({ color }) => <IconSymbol size={28} name="person.fill" color={color} />,
         }}
       />
       <Tabs.Screen
-        name="explore"
+        name="mapScreen"
-        component={MapScreen}
         options={{
-          title: 'MapScreen',
+          title: 'Map',
           tabBarIcon: ({ color }) => <IconSymbol size={28} name="paperplane.fill" color={color} />,
         }}
-      >
+      />
-      </Tabs.Screen>
       <Tabs.Screen
-        name="Ajouter"
+        name="addScreen"
-        component={AddScreen}
         options={{
           title: 'Ajouter',
+          href: role === 'chef' ? '/(tabs)/addScreen' : null,
           tabBarIcon: ({ color }) => (
             <AntDesign name="plus" size={24} color={color} />
           ),
         }}
       />
-
+    </Tabs>
-
-    </Tabs.Navigator>
   );
 }

app/AuthHandler.tsx

@@ -0,0 +1,45 @@
+import { useRouter, useSegments } from "expo-router";
+import { onAuthStateChanged } from "firebase/auth";
+import { doc, getDoc } from "firebase/firestore";
+import { useEffect } from "react";
+import { auth, db } from "../firebase_config";
+import { useUser } from "./ContextUser";
+
+export function useAuthHandler() {
+  const router = useRouter();
+  const segments = useSegments();
+  const { setUser, setRole } = useUser();
+
+  useEffect(() => {
+    const unsubscribe = onAuthStateChanged(auth, async (currentUser) => {
+      if (!currentUser) {
+        setUser(null);
+        setRole(null);
+        router.replace("/login/login");
+        return;
+      }
+
+      const userDocRef = doc(db, "user", currentUser.uid);
+      const userDoc = await getDoc(userDocRef);
+
+      if (!userDoc.exists()) {
+        setUser(null);
+        setRole(null);
+        router.replace("/login/login");
+        return;
+      }
+
+      const { role } = userDoc.data();
+      setUser(currentUser);
+      setRole(role);
+      
+      // Only redirect if we're on login page
+      const inAuthGroup = segments[0] === 'login';
+      if (inAuthGroup) {
+        router.replace("/(tabs)/home");
+      }
+    });
+    
+    return unsubscribe;
+  }, []);
+}

app/login/login.tsx

@@ -1,16 +1,11 @@
 import { ThemedText } from "@/components/theme/themed-text";
 import { ThemedTextInput } from "@/components/theme/themed-textinput";
 import { ThemedView } from "@/components/theme/themed-view";
-import { router } from "expo-router";
+import { signInWithEmailAndPassword } from "firebase/auth";
-import {
-  signInWithEmailAndPassword
-} from "firebase/auth";
 import React, { useState } from "react";
 import { Button, StyleSheet, View } from "react-native";
 import { auth } from "../../firebase_config";
 
-const DEFAULT_ROLE = "resp";
-
 const LoginScreen: React.FC = () => {
   const [email, setEmail] = useState<string>("");
   const [password, setPassword] = useState<string>("");
@@ -18,21 +13,11 @@ const LoginScreen: React.FC = () => {
   const handleLogin = async () => {
     try {
       await signInWithEmailAndPassword(auth, email, password);
-      router.replace("/(tabs)");
     } catch (error: any) {
       alert(error.message);
     }
   };
 
-  /*const handleRegister = async () => {
-    try {
-      await createUserWithEmailAndPassword(auth, email, password);
-      router.replace("/(tabs)");
-    } catch (error: any) {
-      alert(error.message);
-    }
-  }; */
-
   return (
     <ThemedView lvl={1} style={styles.container}>
       <ThemedText style={styles.title}>Se connecter</ThemedText>
@@ -45,7 +30,6 @@ const LoginScreen: React.FC = () => {
         value={email}
         onChangeText={setEmail}
         autoCapitalize="none"
-
       />
       <ThemedTextInput
         lvl = {2}
@@ -59,7 +43,6 @@ const LoginScreen: React.FC = () => {
       />
       <Button title="Se connecter" onPress={handleLogin} />
       <View style={{ height: 10 }} />
-      {/* <Button title="S'inscrire" onPress={handleRegister} /> */}
     </ThemedView>
   );
 };
@@ -76,7 +59,6 @@ const styles = StyleSheet.create({
   },
   input: {
     borderWidth: 1,
-    //borderColor: "#ccc",
     borderRadius: 8,
     padding: 10,
     marginBottom: 10,