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 && (
)}
+
{
collapse
onSubmit={handleCarFilterSubmit}
/>
-
-
-
-
-
-
-
-
-
-
-
+
+ }
+ disableElevation
+ fullWidth
+ onClick={() => setShowFilters((prev) => !prev)}
+ >
+ {showFilters ? strings.HILE_FILTERS : strings.SHOW_FILTERS}
+
+
+ {
+ showFilters && (
+ <>
+
+
+
+
+
+
+
+
+
+
+
+ >
+ )
+ }
>
)}
@@ -353,8 +374,9 @@ const Search = () => {
{pickupLocation && (