Filter Bar

import {
  FilterBar,
  FilterBarItem,
  AdaptFiltersDialog,
  useFilterBarAdapt,
} from "@/components/ui/filter-bar";

const ALL_FILTERS = [
  { name: "search", label: "Search", mandatory: true },
  { name: "status", label: "Status", mandatory: true },
  { name: "customer", label: "Customer" },     // Adapt 로 추가 가능
  { name: "currency", label: "Currency" },
];

const adapt = useFilterBarAdapt({
  filters: ALL_FILTERS,
  defaultVisible: ["search", "status"],
});

<FilterBar
  variant="Standard"
  onGo={() => fetchData(filters)}
  activeCount={2}
  visibleFields={adapt.visible}
  onAdaptFilters={() => adapt.setOpen(true)}
  totalFields={adapt.totalFields}
  activeFields={adapt.activeFields}
>
  <FilterBarItem name="search" label="Search">
    <Input value={q} onChange={(e) => setQ(e.target.value)} />
  </FilterBarItem>

  <FilterBarItem name="status" label="Status">
    <Select value={status} onValueChange={setStatus}>…</Select>
  </FilterBarItem>

  <FilterBarItem name="customer" label="Customer">
    <Input … />
  </FilterBarItem>
</FilterBar>

<AdaptFiltersDialog
  open={adapt.open}
  onOpenChange={adapt.setOpen}
  filters={adapt.filters}
  visible={adapt.visible}
  onVisibleChange={adapt.setVisible}
/>