fini fontionnalité de anomalie, ptet changer styles

components/anomaly.tsx

@@ -1,9 +1,10 @@
 import { Chantier } from '@/class/class';
-import { ThemedView, } from '@/components/theme/themed-view';
-import React from 'react';
-import { Image, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';
+import { ThemedView } from '@/components/theme/themed-view';
+import React, { use, useState } from 'react';
+import { TouchableOpacity, StyleProp, StyleSheet, View, ViewStyle,Text, TextInput } from 'react-native';
 import { ThemedText } from './theme/themed-text';
-
+import { deleteAnomalie, addAnomalie, getChantiers } from '@/services/ressourcesService';
+import { useChantier } from '@/app/ContextChantier';
 
 type Props = {
     data: {
@@ -12,7 +13,25 @@ type Props = {
     style?: StyleProp<ViewStyle>;
 };
 
-export default function Anomaly({data,style , ...otherProps }: Props) {
+export default function Anomaly({data,style}: Props) {
+
+  const{syncChantier }= useChantier();
+
+  const handleDelete = async (anomaly: string) => {
+    await deleteAnomalie(data.chantier!.id, anomaly);
+    data.chantier!.anomalies = data.chantier!.anomalies.filter(a => a !== anomaly);
+    await syncChantier();
+  };
+
+  const handleAdd = async () => {
+    if (newAnomaly.trim().length === 0) return;
+    await addAnomalie(data.chantier!.id, newAnomaly.trim());
+    data.chantier!.anomalies.push(newAnomaly.trim());
+    setNewAnomaly("");
+    await syncChantier();
+  };
+
+  const [newAnomaly, setNewAnomaly] = useState("");
 
   return(
     <View  style={style}>
@@ -23,11 +42,21 @@ export default function Anomaly({data,style , ...otherProps }: Props) {
                   data.chantier.anomalies.map((anomaly, index) => (
                   <ThemedView key={index} lvl={2} style={styles.anomalyItem}>
                     <ThemedText>• {anomaly}</ThemedText>
+                    <TouchableOpacity onPress={() => handleDelete(anomaly)} style={styles.deleteButton}>
+                    <Text style={styles.deleteText}>✕</Text>
+                    </TouchableOpacity>
                   </ThemedView>
                   ))
                 ) : (
                   <ThemedText style={styles.noAnomaly}>Aucune anomalie</ThemedText>
                 ) }
+                {/* Add Anomaly Section */}
+                <View style={styles.addContainer}>
+                <TextInput style={styles.input} placeholder="Nouvelle anomalie..." value={newAnomaly} onChangeText={setNewAnomaly} />
+                <TouchableOpacity style={styles.addButton} onPress={handleAdd}>
+                  <Text style={styles.addButtonText}>Ajouter</Text>
+                </TouchableOpacity>
+        </View>
                 </ThemedView>
         ): null}
     </View>
@@ -55,4 +84,41 @@ const styles = StyleSheet.create({
     fontStyle: "italic",
     opacity: 0.7,
   },
-});
+  //delete button styles
+  deleteButton: {
+    backgroundColor: "red",
+    width: 24,
+    height: 24,
+    borderRadius: 12,
+    alignItems: "center",
+    justifyContent: "center",
+  },
+  deleteText: {
+    color: "white",
+    fontWeight: "bold",
+    fontSize: 14,
+    lineHeight: 14,
+  },
+  //add anomaly styles
+  addContainer: {
+    marginTop: 10,
+    flexDirection: "row",
+    alignItems: "center"
+  },
+  input: {
+    flex: 1,
+    backgroundColor: "white",
+    padding: 8,
+    borderRadius: 8,
+    marginRight: 8,
+  },
+  addButton: {
+    paddingVertical: 8,
+    paddingHorizontal: 12,
+    borderRadius: 8,
+  },
+  addButtonText: {
+    color: "white",
+    fontWeight: "bold",
+  }
+})