feat(booking-ui): add date navigation buttons in MobileFilters component
This commit is contained in:
@@ -352,18 +352,33 @@ function MobilePanelHeader() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function MobileFilters() {
|
function MobileFilters() {
|
||||||
const { selectedDate, setSelectedDate } = useBooking();
|
const { selectedDate, setSelectedDate, moveSelectedDate } = useBooking();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div className="grid grid-cols-[52px_1fr_52px] gap-3">
|
||||||
|
<Button
|
||||||
|
type="button"
|
||||||
|
variant="outline"
|
||||||
|
className="h-12 rounded-lg"
|
||||||
|
onClick={() => moveSelectedDate(-1)}
|
||||||
|
>
|
||||||
|
<ChevronLeft className="size-5" />
|
||||||
|
</Button>
|
||||||
<DatePicker
|
<DatePicker
|
||||||
value={fromIsoDateLocal(selectedDate)}
|
value={fromIsoDateLocal(selectedDate)}
|
||||||
onChange={(date) =>
|
onChange={(date) =>
|
||||||
setSelectedDate(date ? toIsoDateLocal(date) : toIsoDateLocal(new Date()))
|
setSelectedDate(date ? toIsoDateLocal(date) : toIsoDateLocal(new Date()))
|
||||||
}
|
}
|
||||||
className="h-12 w-full justify-center rounded-lg border-border/70 bg-card/75 px-4 text-sm font-medium"
|
className="h-12 rounded-lg border-border/70 bg-card/75 text-sm"
|
||||||
placeholder="Fecha"
|
|
||||||
/>
|
/>
|
||||||
|
<Button
|
||||||
|
type="button"
|
||||||
|
variant="outline"
|
||||||
|
className="h-12 rounded-lg"
|
||||||
|
onClick={() => moveSelectedDate(1)}
|
||||||
|
>
|
||||||
|
<ChevronRight className="size-5" />
|
||||||
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user