diff --git a/components/selectChantier.tsx b/components/selectChantier.tsx index cf81ed5..a23521f 100644 --- a/components/selectChantier.tsx +++ b/components/selectChantier.tsx @@ -1,10 +1,8 @@ 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, @@ -31,37 +29,48 @@ const { width, height } = Dimensions.get("window"); */ -export default function SelectChantier() { +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 || {}; const { chantier, setChantier } = useChantier(); const [search, setSearch] = useState(""); const [isOpen, setIsOpen] = useState(false); - const [isLoaded, setIsLoaded] = useState(false); - const [chantiers, setChantiers] = useState([]); - const router = useRouter(); + const [chantiers, setChantiers] = useState([]); - - // cast to any to avoid strict Animated typing issues for custom props like `lvl`/`border` - const AnimatedThemedView: any = Animated.createAnimatedComponent(ThemedView as any); - const AnimatedThemedText: any = Animated.createAnimatedComponent(ThemedText as any); - const AnimatedThemedButton: any = Animated.createAnimatedComponent(ThemedButton as any); - const AnimatedThemedTextInput: any = Animated.createAnimatedComponent(ThemedTextInput as any); + const AnimatedThemedView = Animated.createAnimatedComponent(ThemedView); + const AnimatedThemedText = Animated.createAnimatedComponent(ThemedText); + const AnimatedThemedButton = Animated.createAnimatedComponent(ThemedButton); + const AnimatedThemedTextInput = + Animated.createAnimatedComponent(ThemedTextInput); async function onPressOpen(){ - setIsLoaded(false); setIsOpen(!isOpen); if(!isOpen){ - const updatedChantiers = await getChantiers(); - setIsLoaded(true); - setChantiers(updatedChantiers) + if (propData && propData.length) { + setChantiers(propData as any[]); + } else { + const updatedChantiers = await getChantiers(); + setChantiers(updatedChantiers); + } } } function onPressAddChantier(){ - router.push('/(tabs)/ajoute_chantier') - 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); @@ -70,22 +79,56 @@ export default function SelectChantier() { loadChantiers(); }, []); - function selectChantier(chantier: Chantier): void { - setChantier(chantier); + 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); + } setIsOpen(false); } - const renderChantier = (chantier: Chantier, index: number) => { + 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; return ( - selectChantier(chantier)}> - + selectChantier(item)}> + - + - Adresse: {chantier.adresse} - Chef de chantier: {chantier.chef.last_name}{" "}{chantier.chef.name} - État: {chantier.etat} + {label} @@ -98,7 +141,19 @@ export default function SelectChantier() { onPressOpen()}> - {isOpen ? "Fermer" : (chantier!=null ? chantier.adresse : "Chantier")} + {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 && ( @@ -111,16 +166,14 @@ export default function SelectChantier() { + - - {isLoaded? + + {chantiers.map((chantier, index) => renderChantier(chantier, index) )} - : } - - + )} @@ -223,8 +276,5 @@ const styles = StyleSheet.create({ buttonAdd:{ borderRadius: 10, marginBottom: 10, - height: 30, - alignItems: 'center', - justifyContent: 'center', } });