test

components/selectChantier.tsx

@@ -5,7 +5,6 @@ import { useEffect, useState } from "react";
 import {
   Dimensions,
   Image,
-  LayoutAnimation,
   Pressable,
   ScrollView,
   StyleSheet,
@@ -42,9 +41,16 @@ export default function SelectChantier() {
   const AnimatedThemedTextInput =
     Animated.createAnimatedComponent(ThemedTextInput);
 
-  function onPressOpen(): void {
+  async function onPressOpen(){
-    LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
     setIsOpen(!isOpen);
+    if(!isOpen){
+      const updatedChantiers = await getChantiers();
+      setChantiers(updatedChantiers)
+    }
+  }
+
+  function onPressAddChantier(){
+
   }
 
   useEffect(() => {
@@ -90,15 +96,28 @@ export default function SelectChantier() {
         </AnimatedThemedButton>
         {isOpen && (
           <View style={styles.menu}>
+
             <ThemedTextInput lvl={1} border={4} style={styles.input} placeholder="Rechercher un chantier" value={search} onChangeText={setSearch}/>
+
+            <ThemedButton style={styles.buttonAdd} onPress={() => onPressAddChantier()}>
+              <ThemedText style={styles.buttonText}>
+                +
+              </ThemedText>
+            </ThemedButton>
+
             <ThemedView lvl={2} style={styles.list}>
               <ScrollView contentContainerStyle={styles.chantiersList}>
                 {chantiers.map((chantier, index) =>
+                <>
                   renderChantier(chantier, index)
+                  renderChantier(chantier, index)
+                  renderChantier(chantier, index)
+                  renderChantier(chantier, index)
+                </>
                 )}
               </ScrollView>
             </ThemedView>
-          </View>
+        </View>
         )}
       </AnimatedThemedView>
     </Animated.View>
@@ -197,4 +216,8 @@ const styles = StyleSheet.create({
   buttonText: {
     textAlign: "center",
   },
+  buttonAdd:{
+    borderRadius: 10,
+    marginBottom: 10,
+  }
 });

components/setStatus.tsx

@@ -1,5 +1,5 @@
 import { useChantier } from '@/app/ContextChantier';
-import { changeChantierStatus, getChantiers } from "@/services/ressourcesService";
+import { changeChantierStatus } from "@/services/ressourcesService";
 import { useState } from 'react';
 import { Dimensions, LayoutAnimation, Modal, Pressable, StyleSheet, View } from 'react-native';
 import Animated, { LinearTransition } from 'react-native-reanimated';
@@ -31,17 +31,16 @@ export default function SetStatus() {
 
     async function onConfirm(): Promise<void> {
         if(chantier == null) return;
-        setOpenConfirmation(false);
+        
         setCurrentStatus(tempStatus);
         setIsOpen(false);
         await changeChantierStatus(chantier.id,tempStatus)
         //Il faut changer le UX 
         setChantier({...chantier,etat: tempStatus})
 
-        //Il faut charger la bdd
+        setOpenConfirmation(false);
-        //const updatedChantiers = await getChantiers();
+
-        //const updatedChantier = updatedChantiers.find(c=> c.id=== chantier.id);
+        
-        //if (updatedChantier) setChantier(updatedChantier);
     }
 
     function onCancel(): void {
@@ -70,14 +69,14 @@ export default function SetStatus() {
       return(
         <Modal transparent={true} >
           <View style={styles.overlay}>
-            <ThemedView style={styles.OverlayView}>
+            <ThemedView style={styles.overlayView}>
               <ThemedText style={{fontSize: 25}}>Changer l'était du chantier en {tempStatus} ?</ThemedText>
-              <View style={styles.OverlayView}>
+              <View style={styles.overlayView}>
                 <ThemedButton lvl={2} border={5} style={styles.buttonValid} onPress={() => onConfirm()}>
                   <ThemedText style={{fontSize: 25}}>Confirmer</ThemedText>
                 </ThemedButton>
               </View>
-              <View style={styles.OverlayView}>
+              <View style={styles.overlayView}>
                 <ThemedButton lvl={2} border={5} style={styles.buttonValid} onPress={() => onCancel()}>
                   <ThemedText style={{fontSize: 25}}>Annuler</ThemedText>
                 </ThemedButton>
@@ -177,7 +176,7 @@ const styles = StyleSheet.create({
     width:"100%",
     height:"100%",
   },
-  OverlayView:{
+  overlayView:{
     borderRadius: 20,
     padding: 20,
     alignItems: "center",
@@ -185,7 +184,7 @@ const styles = StyleSheet.create({
     //backgroundColor:'#ff0000',
   },
   buttonValid:{
-    borderWidth: 2,
+    //borderWidth: 2,
     width:'100%',
     margin: 0,
     borderRadius: 15,

components/themed-button.tsx

@@ -15,6 +15,7 @@ export type ThemedPressableProps = PressableProps & {
 export function ThemedButton({ style, lightColor, darkColor,lvl=1,border=-1,opacity="FF",shadow=false, ...otherProps }: ThemedPressableProps) {
   var lvlStr:string = "background";
   var borderColor ="";
+  var borderWidth = 0;
   if(lvl>=0 && lvl<6){
     lvlStr+=lvl;
   }
@@ -28,6 +29,7 @@ export function ThemedButton({ style, lightColor, darkColor,lvl=1,border=-1,opac
     if(border>=0 && border<6){
       borderStr="background"+border;
       borderColor = useThemeColor({ light: lightColor, dark: darkColor },borderStr as 'background0'|'background1'|'background2'|'background3'|'background4'|'background5');
+      borderWidth = 2;
     }
     else{
       borderColor = backgroundColor
@@ -44,5 +46,5 @@ export function ThemedButton({ style, lightColor, darkColor,lvl=1,border=-1,opac
     shadowRadius: 6,
   }
 
-  return <Pressable  style={(state) =>[{ backgroundColor, borderColor }, shadow && shadowStyle, typeof style === 'function' ? style(state) : style,]} {...otherProps}/>;
+  return <Pressable  style={(state) =>[{ backgroundColor, borderColor, borderWidth }, shadow && shadowStyle, typeof style === 'function' ? style(state) : style,]} {...otherProps}/>;
 }

components/themed-view.tsx

@@ -16,6 +16,7 @@ export type ThemedViewProps = ViewProps & {
 export function ThemedView({ style, lightColor, darkColor,lvl=1,border=-1,opacity="FF",shadow=false, ...otherProps }: ThemedViewProps) {
   var lvlStr:string = "background";
   var borderColor ="";
+  var borderWidth =0;
   if(lvl>=0 && lvl<6){
     lvlStr+=lvl;
   }
@@ -29,6 +30,7 @@ export function ThemedView({ style, lightColor, darkColor,lvl=1,border=-1,opacit
     if(border>=0 && border<6){
       borderStr="background"+border;
       borderColor = useThemeColor({ light: lightColor, dark: darkColor },borderStr as 'background0'|'background1'|'background2'|'background3'|'background4'|'background5');
+      borderWidth = 2;
     }
     else{
       borderColor = backgroundColor
@@ -45,5 +47,5 @@ export function ThemedView({ style, lightColor, darkColor,lvl=1,border=-1,opacit
     shadowRadius: 6,
   }
 
-  return <View style={[{ backgroundColor, borderColor }, shadow && shadowStyle, style]} {...otherProps} />;
+  return <View style={[{ backgroundColor, borderColor, borderWidth }, shadow && shadowStyle, style]} {...otherProps} />;
 }