import { InputNumber } from 'antd';
import { useState, useEffect } from 'react';
import { useOrderFillterState } from '../../../zustand/OrderFillter';

const CustomNumber = () => {
    const [valueFrom, setValueFrom] = useState<number | null>(null);
    const [valueTo, setValueTo] = useState<number | null>(null);
    const { totalFrom, setTotalFrom, totalTo, setTotalTo } = useOrderFillterState();

    // Set initial state based on totalFrom and totalTo

    const onChangeFrom = (value: number | null) => {
        setValueFrom(value);
        setTotalFrom(value);
    };

    const onChangeTo = (value: number | null) => {
        setValueTo(value);
        setTotalTo(value);
    };

    return (
        <div className='CustomNumber'>
            <InputNumber placeholder='PriceFrom' value={valueFrom} onChange={onChangeFrom} />
            <InputNumber placeholder='PriceTo' value={valueTo} onChange={onChangeTo} />
        </div>
    );
};

export default CustomNumber;
