diff --git a/client/src/api/atlas.ts b/client/src/api/atlas.ts index 6eb4796d..1fa1a4ef 100644 --- a/client/src/api/atlas.ts +++ b/client/src/api/atlas.ts @@ -96,7 +96,11 @@ export async function getGeoIdsFromSearch( q: string, territoiresType: string = "" ) { - const url = `${VITE_APP_SERVER_URL}/atlas/get-geo-ids-from-search?q=${q}&niveau_geo=${territoiresType}`; + let niveau_geo = ""; + if (territoiresType !== "all") { + niveau_geo = territoiresType; + } + const url = `${VITE_APP_SERVER_URL}/atlas/get-geo-ids-from-search?q=${q}&niveau_geo=${niveau_geo}`; return fetch(url).then((response) => response.json()); } diff --git a/client/src/pages/atlas/components/main/tabs/search/index.tsx b/client/src/pages/atlas/components/main/tabs/search/index.tsx index 7071b485..ca9e722b 100644 --- a/client/src/pages/atlas/components/main/tabs/search/index.tsx +++ b/client/src/pages/atlas/components/main/tabs/search/index.tsx @@ -9,6 +9,7 @@ import { Spinner, Text, Title, + Badge, } from "@dataesr/dsfr-plus"; import { @@ -27,7 +28,7 @@ type SearchTypes = { }; export function Search() { - const [territoiresType, setTerritoiresType] = useState(""); + const [territoiresType, setTerritoiresType] = useState("all"); const [searchValue, setSearchValue] = useState(""); const navigate = useNavigate(); @@ -41,10 +42,10 @@ export function Search() { isLoading: isLoadingSearch, refetch, } = useQuery({ - queryKey: ["atlas/search", searchValue, territoiresType], - queryFn: () => getGeoIdsFromSearch(searchValue, territoiresType), + queryKey: ["atlas/search", searchValue], + queryFn: () => getGeoIdsFromSearch(searchValue), enabled: false, - }); + }); // TODO: add a debounce + delete unused props const handleClick = async () => { refetch(); @@ -70,6 +71,34 @@ export function Search() { // Sort the list of territories by label territoiresList.sort((a, b) => a.label.localeCompare(b.label)); + function GetFilterButton({ type, label }) { + if(!dataSearch) { + return null; + } + return ( +
  • + {dataSearch?.filter((el) => el.niveau_geo === type)?.length === 0 && type!=="all" ? ( + null + ):( + setTerritoiresType(type)}> + {label} + + { + (type === "all" && dataSearch?.length) || dataSearch?.filter((el) => el.niveau_geo === type)?.length + } + + + )} +
  • + ); + } + + const filteredData = territoiresType !== "all" + ? dataSearch?.filter((el) => el.niveau_geo === territoiresType) + : dataSearch; + return ( @@ -124,48 +153,13 @@ export function Search() {
      -
    • - setTerritoiresType("")}>Tous -
    • -
    • - setTerritoiresType("REGION")}> - Régions - -
    • -
    • - setTerritoiresType("ACADEMIE")}> - Académies - -
    • -
    • - setTerritoiresType("DEPARTEMENT")}> - Départements - -
    • -
    • - setTerritoiresType("UNITE_URBAINE")}> - Unités urbaines - -
    • -
    • - setTerritoiresType("COMMUNE")}> - Communes - -
    • + {dataSearch?.length > 0 && (
    @@ -182,16 +176,13 @@ export function Search() { exemple : "Paris", "Bretagne", "Occitanie", etc ...
    Puis cliquez sur le bouton "Rechercher" -
    - Vous pouvez limiter les résultats à un type de territoire - en cliquant sur les boutons correspondants )} {dataSearch?.length > 0 ? (