diff --git a/src/pages/admin/groupes.js b/src/pages/admin/groupes.js index ea457c9d..252392a7 100644 --- a/src/pages/admin/groupes.js +++ b/src/pages/admin/groupes.js @@ -1,6 +1,6 @@ import { useEffect, useState } from 'react'; import { Link as RouterLink } from 'react-router-dom'; -import { Breadcrumb, BreadcrumbItem, Col, Modal, ModalTitle, ModalContent, Row, Tag, Text } from '@dataesr/react-dsfr'; +import { Breadcrumb, BreadcrumbItem, Col, Modal, ModalTitle, ModalContent, Row, Tag, Text, TextInput } from '@dataesr/react-dsfr'; import Button from '../../components/button'; import useFetch from '../../hooks/useFetch'; import GroupForm from '../../components/forms/groups'; @@ -19,6 +19,7 @@ export default function GroupsPage() { const [modalContent, setModalContent] = useState(null); const { notice } = useNotice(); const { setEditMode } = useEditMode(); + const [searchQuery, setSearchQuery] = useState(''); useEffect(() => setEditMode(true), [setEditMode]); @@ -51,27 +52,56 @@ export default function GroupsPage() { ); setIsOpen(true); }; + const filteredData = data?.data.filter((item) => item?.name?.toLowerCase().includes(searchQuery.toLowerCase())); const renderGroups = () => { if (!data || !data.data?.length) return null; - return data.data.map((group) => ( - - -
- {`${group.name} ${group.acronym ? `(${group.acronym})` : ''}`.trim()} - - Autres noms : + + return ( + <> + + + + Filtrer par groupe : - {group.otherNames.length ? group.otherNames.map((name) => {name}) : Aucun alias pour le moment} -
-
- -
+ setSearchQuery(e.target.value)} + /> +
-
- - )); + + {filteredData.map((group) => ( + + +
+ + {`${group.name} ${group.acronym ? `(${group.acronym})` : ''}`.trim()} + + + Autres noms : + + {group.otherNames.length ? ( + group.otherNames.map((name) => {name}) + ) : ( + Aucun alias pour le moment + )} +
+
+ +
+
+
+ + ))} + + ); }; + if (error) return
Erreur
; if (isLoading) return ; return ( diff --git a/src/pages/admin/users.js b/src/pages/admin/users.js index b1664fa9..1bdc4ba6 100644 --- a/src/pages/admin/users.js +++ b/src/pages/admin/users.js @@ -400,7 +400,9 @@ export default function AdminUsersPage() { {(data?.totalCount) && } - + + + setQuery(e.target.value)} size="sm" />