import {FC, useEffect, useState} from "react";
import RNPickerSelect, {PickerSelectProps} from 'react-native-picker-select';
import {ControllerRenderProps} from "react-hook-form";
import {FilterState} from "../../features/filterSlice/filterSlice";
import {ShippingWarehouse} from "../../types/shippingWarehouse";
import generalApi from "../../api/generalApi";

type Props = {
    selectProps?: Omit<PickerSelectProps, "items" | "onValueChange">;
    controllerProps?: ControllerRenderProps<FilterState, "shippingWarehouseId">
}
const ShippingWarehouseSelect: FC<Props> = (props) => {
    const [items, setItems] = useState<ShippingWarehouse[]>([]);
    useEffect(() => {
        generalApi.getShippingWarehouses().then(response => {
            setItems(response);
        })
    }, []);
    return (
        <RNPickerSelect
            useNativeAndroidPickerStyle={true}
            style={{
                viewContainer: {
                    borderWidth: 1,
                    borderColor: "#9EA0A4",
                    borderRadius: "1%"
                }
            }}
            placeholder={{label: "Все склады", value: -1, color: "#9EA0A4"}}
            {...props.selectProps}
            onValueChange={(value, _) => {
                if (typeof value !== 'number') return;
                props.controllerProps?.onChange(value);
            }}
            value={props.controllerProps?.value}
            itemKey={"value"}
            items={items.map(sw => ({label: sw.name, value: sw.id, color:"black"}))}/>
    )
}

export default ShippingWarehouseSelect