From 2e1c46f178bbdc9a5be8e8a5dd4ce6c05da2fe4d Mon Sep 17 00:00:00 2001
From: "arthur.bassi" <arthur.bassi@luby.com.br>
Date: Fri, 14 Aug 2026 09:42:18 -0300
Subject: [PATCH] fix(vendors): restore filter drawer labels for e2e and visual
 CI

Use VendorFilterOptions again and keep the Apply filters footer label expected
by vendor Playwright specs and the committed visual baseline.
---
 .../_components/vendor-filters-drawer.tsx     | 22 ++++---------------
 1 file changed, 4 insertions(+), 18 deletions(-)

diff --git a/src/app/(protected)/vendors/_components/vendor-filters-drawer.tsx b/src/app/(protected)/vendors/_components/vendor-filters-drawer.tsx
index 86cb612a..b18c568c 100644
--- a/src/app/(protected)/vendors/_components/vendor-filters-drawer.tsx
+++ b/src/app/(protected)/vendors/_components/vendor-filters-drawer.tsx
@@ -1,9 +1,9 @@
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useState } from "react";
 import CloseIcon from "@mui/icons-material/Close";
 import { Box, Button, Chip, Drawer, IconButton, Stack, Typography } from "@mui/material";
 import type { VendorFacets } from "@/domain/vendors/types/vendor";
+import { VendorFilterOptions } from "./vendor-filter-options";
 import { emptyVendorFilters, type VendorFilters } from "./vendor-filters";
-import { VendorFiltersDrawerFields } from "./vendor-filters-drawer-fields";
 
 interface VendorFiltersDrawerProps {
   open: boolean;
@@ -30,11 +30,6 @@ export function VendorFiltersDrawer({
     }
   }, [open, appliedFilters]);
 
-  const companyOptions = useMemo(() => facets?.companies ?? [], [facets]);
-  const tradeOptions = useMemo(() => facets?.trades ?? [], [facets]);
-  const locationOptions = useMemo(() => facets?.locations ?? [], [facets]);
-  const jobBucketOptions = useMemo(() => facets?.jobBuckets ?? [], [facets]);
-
   const activeCount =
     draft.companies.length + draft.trades.length + draft.locations.length + draft.jobBuckets.length;
 
@@ -84,16 +79,7 @@ export function VendorFiltersDrawer({
         </Stack>
 
         <Box className="flex-1 overflow-y-auto" sx={{ px: 2.5 }}>
-          <VendorFiltersDrawerFields
-            draft={draft}
-            setDraft={setDraft}
-            options={{
-              companies: companyOptions,
-              trades: tradeOptions,
-              locations: locationOptions,
-              jobBuckets: jobBucketOptions,
-            }}
-          />
+          <VendorFilterOptions facets={facets} draft={draft} setDraft={setDraft} />
         </Box>
 
         <Stack
@@ -109,7 +95,7 @@ export function VendorFiltersDrawer({
             Clear all
           </Button>
           <Button variant="contained" onClick={handleApply} fullWidth>
-            Apply
+            Apply filters
           </Button>
         </Stack>
       </Stack>