feat: ajoute un filtre par nom

proto-module-actu-react
Jalil Arfaoui 2023-01-30 01:33:46 +01:00
parent 65f2a848b3
commit b7b3dc1f54
1 changed files with 5 additions and 1 deletions

View File

@ -40,15 +40,19 @@ function FiltreDepartement(props: { onChange: (event: React.ChangeEvent<HTMLSele
export const ListeResistants = () => {
const { resistants } = useLoaderData() as { resistants: Resistant[] }
const [departement, setDepartement] = React.useState<string|null>(null)
const [nom, setNom] = React.useState<string|null>(null)
const filtreDepartements = (event: React.ChangeEvent<HTMLSelectElement>) => setDepartement(event.target.value)
const filtreNom = (event: React.ChangeEvent<HTMLInputElement>) => setNom(event.target.value)
return (
<>
<div id="listeResistants">
<input type="text" name=""/>
Nom: <input type="text" name="" onChange={filtreNom}/>
&nbsp;
<FiltreDepartement onChange={filtreDepartements}/>
{resistants
.filter(r => !nom || r.noms?.toLowerCase().includes(nom.toLowerCase()))
.filter(r => !departement || r.departement?.includes(departement))
.map((r) => <ResistantRow resistant={r} key={r.noms}/>)}
<Outlet/>