import {closeFilter, FilterState, setFilterState} from "../../../features/filterSlice/filterSlice";
import {Controller, useForm} from "react-hook-form";
import {Button, View} from "react-native";
import ShippingWarehouseSelect from "../../ShippingWarehouseSelect/ShippingWarehouseSelect";
import {RFPercentage} from "react-native-responsive-fontsize";
import SortingButtons from "./SortingButtons";
import {useSelector} from "react-redux";
import {RootState, useAppDispatch} from "../../../redux/store";

const SortingModalBody = () => {
    const currentState = useSelector((state: RootState) => state.filter.state);
    const dispatch = useAppDispatch();
    const {control, handleSubmit} = useForm<FilterState>({
        defaultValues: currentState,
    })
    const onSubmit = (data: FilterState) => {
        dispatch(setFilterState(data));
        dispatch(closeFilter())
    }
    return (
        <View style={{
            padding: RFPercentage(1),
            display: "flex",
            flexDirection: "column",
            gap: RFPercentage(1),
        }}>

            <Controller
                name={"sorting"}
                control={control}
                render={({field}) => (<SortingButtons {...field}/>)}
            />
            <Controller control={control} name={"shippingWarehouseId"}
                        render={({field}) => (
                            <ShippingWarehouseSelect
                                controllerProps={field}/>)}/>
            <Button title={"Применить"} onPress={handleSubmit(onSubmit)}/>
        </View>

    );
}

export default SortingModalBody;