import {FC} from "react";
import {Select} from "@mantine/core";
import {ClientSchema} from "../../../client";
import useClientsList from "../../../pages/ClientsPage/hooks/useClientsList.tsx";


type Props = {
    value?: ClientSchema;
    onChange: (client: ClientSchema) => void;
    withLabel?: boolean;
}
const ClientSelect: FC<Props> = ({value, onChange, withLabel = false}) => {
    const {clients} = useClientsList();
    const options = clients.map(client => ({label: client.name, value: client.id.toString()}))
    return (
        <Select
            searchable
            placeholder={"Выберите клиента"}
            value={value && options.find(client => client.value == value.id.toString())?.value}
            onChange={event => {
                if (!event) return;
                const client = clients.find(client => client.id == parseInt(event));
                if (!client) return;
                onChange(client);
            }}
            data={options}
            label={withLabel && "Клиент"}
        />
    )
}
export default ClientSelect;