correction merge selectChantier

app/(tabs)/_layout.tsx

@@ -23,67 +23,61 @@ export default function TabLayout() {
   const colorScheme = useColorScheme();
 
   return (
-    <UserProvider>
-      <ChantierProvider>
-        <RessourcesProvider>
-          <Tabs.Navigator
-            initialRouteName='explore'
-            screenOptions={{
-              tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
-              headerShown: false,
-              tabBarButton: HapticTab,
-            }}>
-            <Tabs.Screen
-              name="home"
-              component={Home}
-              options={{
-                title: 'Home',
-                tabBarIcon: ({ color }) => (
-                  <IconSymbol size={28} name="house.fill" color={color} />
-                ),
-              }}
-            />
-            <Tabs.Screen
-              name="gestionnaire_ressource"
-              component={ListMateriel}
-              options={{
-                title: 'Ressources',
-                tabBarIcon: ({ color }) => (
-                  <IconSymbol size={28} name="backpack.fill" color={color} />
-                ),
-              }}
-            />
-            <Tabs.Screen
-              name="GestionOuvrier"
-              component={GestionOuvrier}
-              options={{
-                title: 'Bonjour',
-                tabBarIcon: ({ color }) => <IconSymbol size={28} name="person.fill" color={color} />,
-              }}
-            />
-            <Tabs.Screen
-              name="explore"
-              component={MapScreen}
-              options={{
-                title: 'MapScreen',
-                tabBarIcon: ({ color }) => <IconSymbol size={28} name="paperplane.fill" color={color} />,
-              }}
-            >
-            </Tabs.Screen>
-            <Tabs.Screen
-              name="addChantier"
-              component={AddChantier}
-              options={{
-                title: 'Ajouter',
-                tabBarIcon: ({ color }) => (
-                  <AntDesign name="plus" size={24} color={color} />
-                ),
-              }}
-            />
+    <Tabs.Navigator
+      initialRouteName='explore'
+      screenOptions={{
+        tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
+        headerShown: false,
+        tabBarButton: HapticTab,
+      }}>
+      <Tabs.Screen
+        name="home"
+        component={Home}
+        options={{
+          title: 'Home',
+          tabBarIcon: ({ color }) => (
+            <IconSymbol size={28} name="house.fill" color={color} />
+          ),
+        }}
+      />
+      <Tabs.Screen
+        name="gestionnaire_ressource"
+        component={ListMateriel}
+        options={{
+          title: 'Ressources',
+          tabBarIcon: ({ color }) => (
+            <IconSymbol size={28} name="backpack.fill" color={color} />
+          ),
+        }}
+      />
+      <Tabs.Screen
+        name="GestionOuvrier"
+        component={GestionOuvrier}
+        options={{
+          title: 'Bonjour',
+          tabBarIcon: ({ color }) => <IconSymbol size={28} name="person.fill" color={color} />,
+        }}
+      />
+      <Tabs.Screen
+        name="explore"
+        component={MapScreen}
+        options={{
+          title: 'MapScreen',
+          tabBarIcon: ({ color }) => <IconSymbol size={28} name="paperplane.fill" color={color} />,
+        }}
+      >
+      </Tabs.Screen>
+      <Tabs.Screen
+        name="addChantier"
+        component={AddChantier}
+        options={{
+          title: 'Ajouter',
+          tabBarIcon: ({ color }) => (
+            <AntDesign name="plus" size={24} color={color} />
+          ),
+        }}
+      />
 
-          </Tabs.Navigator>
-        </RessourcesProvider>
-      </ChantierProvider>
-    </UserProvider>
+    </Tabs.Navigator>
   );
 }

app/(tabs)/addChantier.tsx

@@ -103,8 +103,9 @@ export default function AddChantier() {
             <ThemedTextInput lvl = {1} style = {styles.input} placeholder='Adresse du chantier' value = {adresse} onChangeText={setAdresse} />
             <ThemedTextInput lvl = {1} style = {styles.input} placeholder='durée estimée (en jours)' value = {duree} onChangeText={setDuree} />
             <ThemedTextInput lvl = {1} style = {styles.input} placeholder='chef de chantier' value= {chefChantier} onChangeText={setChefChantier}/>
-            <ThemedText style={{ fontWeight: "bold", marginTop: 15 }}>Équipe</ThemedText>
-            <Text style={{ fontWeight: "bold", marginTop: 15 }}>Ressources</Text>
+            <ThemedText style = {styles.text}>Ajouter un équipier</ThemedText>
+            
+            <ThemedText style = {styles.text}>Ajouter une ressources</ThemedText>
             <ThemedButton
               lvl={1}
               shadow={true}

app/_layout.tsx

@@ -14,6 +14,8 @@ import { auth, db } from "../firebase_config";
 
 import { Platform, UIManager } from 'react-native';
 import { ChantierProvider } from "./ContextChantier";
+import { UserProvider } from "./ContextUser";
+import { RessourcesProvider } from "./ContextRessource";
 
 
 export const unstable_settings = {
@@ -61,19 +63,23 @@ export default function RootLayout() {
   }, []);
 
   return (
-    <ChantierProvider>
-      <ThemeProvider value={colorScheme === "dark" ? DarkTheme : DefaultTheme}>
-        <Stack>
-          <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
-          <Stack.Screen name="selectChantier" options={{ headerShown: false }}/>
-          <Stack.Screen
-            name="modal"
-            options={{ presentation: "modal", title: "Modal" }}
-          />
-          <Stack.Screen name="login" options={{ headerShown: false }} />
-        </Stack>
-        <StatusBar style="auto" />
-      </ThemeProvider>
-    </ChantierProvider>
+    <UserProvider>
+      <ChantierProvider>
+        <RessourcesProvider>
+          <ThemeProvider value={colorScheme === "dark" ? DarkTheme : DefaultTheme}>
+            <Stack>
+              <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
+              <Stack.Screen name="selectChantier" options={{ headerShown: false }}/>
+              <Stack.Screen
+                name="modal"
+                options={{ presentation: "modal", title: "Modal" }}
+              />
+              <Stack.Screen name="login" options={{ headerShown: false }} />
+            </Stack>
+            <StatusBar style="auto" />
+          </ThemeProvider>
+        </RessourcesProvider>
+      </ChantierProvider>
+    </UserProvider>
   );
 }

components/selectChantier.tsx

@@ -1,8 +1,10 @@
 import { useChantier } from "@/app/ContextChantier";
 import { Chantier } from "@/class/class";
 import { getChantiers } from "@/services/ressourcesService";
+import { useRouter } from "expo-router";
 import { useEffect, useState } from "react";
 import {
+  ActivityIndicator,
   Dimensions,
   Image,
   Pressable,
@@ -13,11 +15,10 @@ import {
 import Animated, {
   LinearTransition
 } from "react-native-reanimated";
-import { ThemedButton } from "./theme/themed-button";
-import { ThemedText } from "./theme/themed-text";
-import { ThemedTextInput } from "./theme/themed-textinput";
-import { ThemedView } from "./theme/themed-view";
-import { router } from "expo-router";
+import { ThemedButton } from "@/components/theme/themed-button";
+import { ThemedText } from "@/components/theme/themed-text";
+import { ThemedTextInput } from "@/components/theme/themed-textinput";
+import { ThemedView } from "@/components/theme/themed-view";
 
 const screenHeight = Dimensions.get("window").height;
 const { width, height } = Dimensions.get("window");
@@ -30,19 +31,15 @@ const { width, height } = Dimensions.get("window");
 
 */
 
-export default function SelectChantier(props: {
-  data?: any[];
-  multiple?: boolean;
-  selected?: string[] | string | null;
-  onChange?: (val: any) => void;
-  placeholder?: string;
-}) {
-  const { data: propData, multiple = false, selected, onChange, placeholder } = props || {};
+export default function SelectChantier() {
   const { chantier, setChantier } = useChantier();
   const [search, setSearch] = useState("");
   const [isOpen, setIsOpen] = useState(false);
-  const [chantiers, setChantiers] = useState<any[]>([]);
+  const [isLoaded, setIsLoaded] = useState(false);
+  const [chantiers, setChantiers] = useState<Chantier[]>([]);
+  const router = useRouter();
 
+  
   const AnimatedThemedView = Animated.createAnimatedComponent(ThemedView);
   const AnimatedThemedText = Animated.createAnimatedComponent(ThemedText);
   const AnimatedThemedButton = Animated.createAnimatedComponent(ThemedButton);
@@ -50,29 +47,21 @@ export default function SelectChantier(props: {
     Animated.createAnimatedComponent(ThemedTextInput);
 
   async function onPressOpen(){
+    setIsLoaded(false);
     setIsOpen(!isOpen);
     if(!isOpen){
-      if (propData && propData.length) {
-        setChantiers(propData as any[]);
-      } else {
-        const updatedChantiers = await getChantiers();
-        setChantiers(updatedChantiers);
-      }
+      const updatedChantiers = await getChantiers();
+      setIsLoaded(true);
+      setChantiers(updatedChantiers)
     }
   }
 
   function onPressAddChantier(){
-    router.push('/(tabs)/addChantier')
+    router.push("/(tabs)/addChantier")
     setIsOpen(false)
   }
 
   useEffect(() => {
-    // If parent provided data, use it. Otherwise fetch chantiers.
-    if (propData && propData.length) {
-      setChantiers(propData as any[]);
-      return;
-    }
-
     async function loadChantiers() {
       const list = await getChantiers();
       setChantiers(list);
@@ -81,56 +70,22 @@ export default function SelectChantier(props: {
     loadChantiers();
   }, []);
 
-  function getId(item: any) {
-    return (item && (item.id ?? item._id ?? item.uid ?? item.key)) ?? String(item);
-  }
-
-  function getLabel(item: any) {
-    if (!item) return String(item);
-    if (item.adresse) return item.adresse;
-    if (item.nom) return item.nom;
-    if (item.name && item.last_name) return `${item.last_name} ${item.name}`;
-    if (item.name) return item.name;
-    if (item.label) return item.label;
-    if (typeof item === 'string') return item;
-    return JSON.stringify(item);
-  }
-
-  function selectChantier(item: any): void {
-    const id = String(getId(item));
-    if (multiple) {
-      // for multiple selection toggle id in selected array
-      const current = Array.isArray(selected) ? [...selected] : [];
-      const idx = current.indexOf(id);
-      if (idx >= 0) current.splice(idx, 1);
-      else current.push(id);
-      onChange?.(current);
-      // keep menu open for multiple selection
-      return;
-    }
-
-    // single selection
-    if (onChange) {
-      onChange(id);
-    } else {
-      // fallback behavior for old usage: if selecting a Chantier, update context
-      setChantier(item as Chantier);
-    }
+  function selectChantier(chantier: Chantier): void {
+    setChantier(chantier);
     setIsOpen(false);
   }
 
-  const renderChantier = (item: any, index: number) => {
-    const label = getLabel(item);
-    const id = String(getId(item));
-    const isSelected = Array.isArray(selected) ? selected.includes(id) : selected === id;
+  const renderChantier = (chantier: Chantier, index: number) => {
     return (
-        <Pressable key={index} onPress={() => selectChantier(item)}>
-          <ThemedView lvl={4} style={[styles.chantier, isSelected ? { borderWidth: 1 } : {}]}>
+        <Pressable key={index} onPress={() => selectChantier(chantier)}>
+          <ThemedView lvl={4} style={styles.chantier}>
             <View>
-              <Image source={{ uri: "https://cdn.discordapp.com/attachments/1425108443571945644/1427207643180826757/raw.png?ex=69392bb2&is=6937da32&hm=dcc09e76d3dca89d2418947b46efbd38673b9dc559027724b2e51d493b173bc9&" }} style={styles.image} />
+              <Image source={{ uri:"https://cdn.discordapp.com/attachments/1425108443571945644/1427207643180826757/raw.png?ex=69392bb2&is=6937da32&hm=dcc09e76d3dca89d2418947b46efbd38673b9dc559027724b2e51d493b173bc9&" /*chantier.urlImg*/ }} style={styles.image} />
             </View>
             <View>
-              <ThemedText>{label}</ThemedText>
+            <ThemedText>Adresse: {chantier.adresse}</ThemedText>
+            <ThemedText>Chef de chantier: {chantier.chef.last_name}{" "}{chantier.chef.name}</ThemedText>
+            <ThemedText>État: {chantier.etat}</ThemedText>
             </View>
           </ThemedView>
         </Pressable>
@@ -143,19 +98,7 @@ export default function SelectChantier(props: {
       <AnimatedThemedView layout={LinearTransition.duration(200)} lvl={2} shadow={true} style={styles.window}>
         <AnimatedThemedButton style={isOpen ? styles.buttonOpen : styles.buttonClose} lvl={isOpen ? 1 : 1} onPress={() => onPressOpen()}>
           <ThemedText style={styles.buttonText}>
-            {isOpen
-              ? "Fermer"
-              : (multiple
-                  ? (Array.isArray(selected) && selected.length ? `${selected.length} sélectionnés` : (placeholder ?? "Sélectionner"))
-                  : (selected ? (() => {
-                      // show label of selected single item if provided in propData
-                      if (selected && propData) {
-                        const found = propData.find((it: any) => String(getId(it)) === String(selected));
-                        return found ? getLabel(found) : (chantier ? (chantier.adresse ?? getLabel(chantier)) : (placeholder ?? "Chantier"));
-                      }
-                      return chantier ? (chantier.adresse ?? getLabel(chantier)) : (placeholder ?? "Chantier");
-                    })() : (placeholder ?? "Chantier"))
-                )}
+            {isOpen ? "Fermer" : (chantier!=null ? chantier.adresse : "Chantier")}
           </ThemedText>
         </AnimatedThemedButton>
         {isOpen && (
@@ -168,14 +111,16 @@ export default function SelectChantier(props: {
                 +
               </ThemedText>
             </ThemedButton>
-
-            <ThemedView lvl={2} style={styles.list}>
+            <View style={styles.list}>
+              {isLoaded?
               <ScrollView contentContainerStyle={styles.chantiersList}>
                 {chantiers.map((chantier, index) =>
                   renderChantier(chantier, index)
                 )}
               </ScrollView>
-            </ThemedView>
+              : <ActivityIndicator style={{height:"100%"}} color="#808080" size="large" />}
+            </View>
+
         </View>
         )}
       </AnimatedThemedView>
@@ -278,5 +223,8 @@ const styles = StyleSheet.create({
   buttonAdd:{
     borderRadius: 10,
     marginBottom: 10,
+    height: 30,
+    alignItems: 'center',
+    justifyContent: 'center',
   }
 });