refactor: remove unused state and resize handler from DrowdownFilters component

This commit is contained in:
Marco Pedone 2025-12-30 09:43:03 +01:00
parent 3b2538736d
commit 5829a45718

View file

@ -1,7 +1,6 @@
import { keepPreviousData } from "@tanstack/react-query"; import { keepPreviousData } from "@tanstack/react-query";
import { import {
ChevronDown, ChevronDown,
ChevronUp,
Filter, Filter,
FilterX, FilterX,
MapIcon, MapIcon,
@ -11,7 +10,7 @@ import {
import type { GetServerSideProps } from "next"; import type { GetServerSideProps } from "next";
import dynamic from "next/dynamic"; import dynamic from "next/dynamic";
import Head from "next/head"; import Head from "next/head";
import { useCallback, useEffect, useMemo, useState } from "react"; import { useCallback, useMemo } from "react";
import { AccordionComp } from "~/components/accordionComp"; import { AccordionComp } from "~/components/accordionComp";
import { CTA_TipologiaModal } from "~/components/annunci_tutorial"; import { CTA_TipologiaModal } from "~/components/annunci_tutorial";
import { LazyCardAnnuncio } from "~/components/annuncio_card"; import { LazyCardAnnuncio } from "~/components/annuncio_card";
@ -35,6 +34,7 @@ import {
SelectTrigger, SelectTrigger,
SelectValue, SelectValue,
} from "~/components/ui/select"; } from "~/components/ui/select";
import { useMediaQuery } from "~/hooks/use-media-query";
import { cn, debounce } from "~/lib/utils"; import { cn, debounce } from "~/lib/utils";
import { useTranslation } from "~/providers/I18nProvider"; import { useTranslation } from "~/providers/I18nProvider";
import { import {
@ -198,23 +198,12 @@ const RicercaSideFilters = () => {
const DrowdownFilters = () => { const DrowdownFilters = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const { nFiltri } = useRicerca(); const { nFiltri } = useRicerca();
const [open, setOpen] = useState(false); const isBigScreen = useMediaQuery("(min-width: 96rem)");
// Close dropdown when page resizes
const handleResize = useCallback(() => {
setOpen(false);
}, []);
useEffect(() => {
window.addEventListener("resize", handleResize);
return () => {
window.removeEventListener("resize", handleResize);
};
}, [handleResize]);
if (isBigScreen) return null;
return ( return (
<div className="flex w-full sm:w-auto 2xl:hidden"> <div className="flex w-full sm:w-auto 2xl:hidden">
<DropdownMenu onOpenChange={setOpen} open={open}> <DropdownMenu>
<DropdownMenuTrigger asChild> <DropdownMenuTrigger asChild>
<Button <Button
className="group flex w-full flex-row gap-2 sm:w-auto" className="group flex w-full flex-row gap-2 sm:w-auto"
@ -225,7 +214,7 @@ const DrowdownFilters = () => {
</Badge> </Badge>
<Filter className="size-5" />{" "} <Filter className="size-5" />{" "}
{nFiltri === 1 ? t.annunci.filtro_attivo : t.annunci.filtri_attivi} {nFiltri === 1 ? t.annunci.filtro_attivo : t.annunci.filtri_attivi}
{open ? <ChevronUp /> : <ChevronDown />} <ChevronDown />
</Button> </Button>
</DropdownMenuTrigger> </DropdownMenuTrigger>
<DropdownMenuContent <DropdownMenuContent