diff --git a/src/features/flights-map/components/FlightsMapFilter.tsx b/src/features/flights-map/components/FlightsMapFilter.tsx index e51db39c..799532aa 100644 --- a/src/features/flights-map/components/FlightsMapFilter.tsx +++ b/src/features/flights-map/components/FlightsMapFilter.tsx @@ -7,11 +7,17 @@ * @module */ -import { type FC, useState, useCallback, type FormEvent } from "react"; +import { type FC, useState, useCallback, useEffect, useMemo, type FormEvent } from "react"; import { AutoComplete, type AutoCompleteCompleteEvent } from "primereact/autocomplete"; import { Calendar } from "primereact/calendar"; import { useTranslation } from "@/i18n/provider.js"; import { useCitySearch, type CitySuggestion } from "@/shared/hooks/useCitySearch.js"; +import { + getMinDate, + getMaxDate, + buildDisabledDates, + findNextEnabledDate, +} from "../calendarRange.js"; import type { IFlightsMapFilterState } from "../types.js"; export interface FlightsMapFilterProps { @@ -41,6 +47,7 @@ function dateToYyyymmdd(value: Date): string { */ export const FlightsMapFilter: FC = ({ value, + availableDays, onChange, }) => { const { t } = useTranslation(); @@ -51,6 +58,27 @@ export const FlightsMapFilter: FC = ({ const { suggestions: departureSuggestions, search: searchDeparture } = useCitySearch(); const { suggestions: arrivalSuggestions, search: searchArrival } = useCitySearch(); + const minDate = useMemo(() => getMinDate(), []); + const maxDate = useMemo(() => getMaxDate(), []); + + const disabledDates = useMemo( + () => buildDisabledDates(minDate, maxDate, availableDays ?? []), + [minDate, maxDate, availableDays], + ); + + useEffect(() => { + if (!value.date) return; + const current = yyyymmddToDate(value.date); + if (!current) return; + + const snapped = findNextEnabledDate(current, disabledDates, minDate, maxDate); + const snappedYyyymmdd = snapped ? dateToYyyymmdd(snapped) : undefined; + + if (snappedYyyymmdd !== value.date) { + onChange({ ...value, date: snappedYyyymmdd }); + } + }, [disabledDates, minDate, maxDate, value, onChange]); + const handleDepartureSearch = useCallback((event: AutoCompleteCompleteEvent) => { void searchDeparture(event.query); }, [searchDeparture]); @@ -179,6 +207,9 @@ export const FlightsMapFilter: FC = ({ handleDateChange(e.value as Date | null)} + minDate={minDate} + maxDate={maxDate} + disabledDates={disabledDates} dateFormat="dd.mm.yy" showIcon className="input--filter"