diff --git a/frontend/src/lang/search.ts b/frontend/src/lang/search.ts index 149c30f92..8f74992e3 100644 --- a/frontend/src/lang/search.ts +++ b/frontend/src/lang/search.ts @@ -4,12 +4,18 @@ import * as langHelper from '@/common/langHelper' const strings = new LocalizedStrings({ fr: { VIEW_ON_MAP: 'Voir sur la carte', + SHOW_FILTERS: 'Afficher les filtres', + HILE_FILTERS: 'Masquer les filtres', }, en: { VIEW_ON_MAP: 'View on map', + SHOW_FILTERS: 'Show Filters', + HILE_FILTERS: 'Hide Filters', }, es: { VIEW_ON_MAP: 'Ver en el mapa', + SHOW_FILTERS: 'Mostrar filtros', + HILE_FILTERS: 'Ocultar filtros', }, }) diff --git a/frontend/src/pages/Search.tsx b/frontend/src/pages/Search.tsx index 125b318f6..f3f658bda 100644 --- a/frontend/src/pages/Search.tsx +++ b/frontend/src/pages/Search.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useState } from 'react' import { useLocation } from 'react-router-dom' -import { Box, Dialog, DialogContent, DialogTitle, IconButton } from '@mui/material' -import { Close as CloseIcon } from '@mui/icons-material' +import { Box, Button, Dialog, DialogContent, DialogTitle, IconButton } from '@mui/material' +import { Close as CloseIcon, Tune as FiltersIcon } from '@mui/icons-material' import * as bookcarsTypes from ':bookcars-types' import * as bookcarsHelper from ':bookcars-helper' import env from '@/config/env.config' @@ -58,6 +58,7 @@ const Search = () => { const [seats, setSeats] = useState(-1) const [openMapDialog, setOpenMapDialog] = useState(false) // const [distance, setDistance] = useState('') + const [showFilters, setShowFilters] = useState(false) const [loadingPage, setLoadingPage] = useState(true) useEffect(() => { @@ -254,8 +255,9 @@ const Search = () => { <> {pickupLocation.latitude && pickupLocation.longitude && ( @@ -271,6 +273,7 @@ const Search = () => { )} + { collapse onSubmit={handleCarFilterSubmit} /> - - - - - - - - - - - + + + + { + showFilters && ( + <> + + + + + + + + + + + + + ) + } )} @@ -353,8 +374,9 @@ const Search = () => { {pickupLocation && (