import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { X } from "lucide-react";
import { Button } from "../button";
import { DateCombobox, SelectionCombobox, TextCombobox, StringListCombobox } from "./comboBox/comboBox";
import dayjs from "dayjs";
function generateComboboxOptions(filter, setFilters, filterGroups) {
    switch (filter.type) {
        case "date":
            return (_jsx(DateCombobox, { filterValues: Array.isArray(filter.value) && typeof filter.value[0] === 'object' ? filter.value.map((v) => v.value || '') : [], isRange: filter.multiple, setFilterValues: (filterValues) => {
                    setFilters((prev) => prev.map((f) => f === filter ? {
                        ...f,
                        value: filterValues.length > 0 ?
                            filterValues.map(dateValue => ({
                                value: dateValue,
                                label: dayjs(dateValue).format("LLL dd, y"),
                            })) : []
                    } : f));
                } }));
        case "text":
            return (_jsx(TextCombobox, { filterType: filter.placeholder || filter.name, filterValue: Array.isArray(filter.value) && filter.value[0] && typeof filter.value[0] === 'object' ? filter.value[0].value || "" : "", setFilterValue: (textValue) => {
                    setFilters((prev) => prev.map((f) => f === filter
                        ? {
                            ...f,
                            value: [
                                {
                                    value: textValue,
                                    label: textValue,
                                },
                            ],
                        }
                        : f));
                } }));
        case "stringList":
            return (_jsx(StringListCombobox, { filterType: filter.placeholder || filter.name, filterValues: Array.isArray(filter.value) && typeof filter.value[0] === 'string' ? filter.value : [], setFilterValues: (values) => {
                    setFilters((prev) => prev.map((f) => f === filter
                        ? { ...f, value: values }
                        : f));
                } }));
        case 'select':
        default: {
            const filterGroup = filterGroups.find(group => group.name === filter.name);
            return (_jsx(SelectionCombobox, { filterType: filter.placeholder || filter.name, filterValues: Array.isArray(filter.value) && typeof filter.value[0] === 'object' ? filter.value : [], setFilterValues: (filterValues) => {
                    setFilters((prev) => prev.map((f) => f === filter
                        ? { ...f, value: filterValues }
                        : f));
                }, options: filterGroup?.options || [], labelRenderer: filterGroup?.labelRenderer }));
        }
    }
}
export default function Filters({ filters, setFilters, filterGroups, }) {
    return (_jsx("div", { className: "flex gap-2 flex-wrap justify-start", children: filters
            .filter((filter) => filter.value?.length > 0)
            .map((filter) => (_jsxs("div", { className: "flex gap-[1px] items-center text-sm", children: [_jsx("div", { className: "flex gap-1.5 shrink-0 rounded-l bg-muted p-1.5 h-8 items-center", children: filter.placeholder || filter.name }), generateComboboxOptions(filter, setFilters, filterGroups), _jsx(Button, { variant: "ghost", size: "icon", onClick: () => {
                        setFilters((prev) => prev.filter((f) => f !== filter));
                    }, className: "bg-muted rounded-l-none rounded-r-sm size-8 hover:text-primary hover:bg-muted/50 transition shrink-0", children: _jsx(X, { className: "size-6" }) })] }, filter.name + '-' + (filter.type == 'date' ? 'date' : filter.type === 'stringList' && typeof filter.value[0] === 'string' ? filter.value.join(',') : Array.isArray(filter.value) ? filter.value.map((v) => v.value).join(',') : '')))) }));
}
//# sourceMappingURL=filters.js.map