import { cn } from "@site/src/utils/cn"; export type SidebarFilterOption = { label: string; value: string; count?: number; }; export type SidebarFilterGroup = { title: string; options: SidebarFilterOption[]; maxHeight?: string; }; interface SidebarFilterProps { groups: SidebarFilterGroup[]; selectedValues: Record; onChange: (groupTitle: string, values: string[]) => void; } export function SidebarFilter({ groups, selectedValues, onChange }: SidebarFilterProps) { const toggleValue = (groupTitle: string, value: string) => { const currentValues = selectedValues[groupTitle] || []; const newValues = currentValues.includes(value) ? currentValues.filter((v) => v !== value) : [...currentValues, value]; onChange(groupTitle, newValues); }; return (

{groups.map((group) => (

{group.title}

{group.options.map((option) => (

toggleValue(group.title, option.value)} className="form-checkbox h-4 w-4 text-purple-600 transition duration-150 ease-in-out" /> {option.label}

{option.count !== undefined && ( {option.count} )} ))}

{group.maxHeight && (

)}

))}

); }