import { jsx as _jsx } from "react/jsx-runtime";
import { useUserSession } from "@vertesia/ui/session";
import { SelectBox } from "@vertesia/ui/core";
import { useEffect, useState } from "react";
export function facetOptionLabel(bucket) {
    return `${bucket.name} (${bucket.count})`;
}
export function TypeFacet({ search, buckets, placeholder = "Filter by Type", className }) {
    const [options, setOptions] = useState([]);
    const { typeRegistry } = useUserSession();
    const filterValue = search.getFilterValue("type");
    const onChange = (option) => {
        search.setFilterValue("type", option?._id);
    };
    useEffect(() => {
        if (typeRegistry) {
            const options = buckets.map((bucket) => {
                let name;
                if (bucket._id == null) {
                    bucket._id = "Document";
                    name = "Document";
                }
                else {
                    name = typeRegistry.getTypeName(bucket._id);
                    if (!name) {
                        console.warn("Content Object Type not found", bucket._id);
                        name = bucket._id;
                    }
                }
                return {
                    ...bucket,
                    name
                };
            });
            options.sort((a, b) => a.name.localeCompare(b.name));
            setOptions(options);
        }
    }, [buckets, typeRegistry]);
    const value = options?.find((option) => option._id === filterValue);
    return (_jsx(SelectBox, { filterBy: "name", className: className, isClearable: true, optionLabel: facetOptionLabel, options: options, value: value, onChange: onChange, by: '_id', placeholder: placeholder }));
}
//# sourceMappingURL=TypeFacet.js.map