import { DatePicker } from 'antd'
import React from 'react'
import { useTranslation } from 'react-i18next';
import { useObjectToEdit } from '../../../zustand/ObjectToEditState';
import { useLocation, useNavigate } from 'react-router-dom';
import type { DatePickerProps } from "antd";
import dayjs from "dayjs";
import { DateEnum } from '../../../enums/Date';

const CustomDatePicker = () => {
    const [t] = useTranslation();
    const { set_param_to_send, param_to_send } = useObjectToEdit();
    const navigate = useNavigate();
    const location = useLocation();
  
    const onChange: DatePickerProps["onChange"] = (date, dateString) => {
      // console.log(date, dateString);
      const newObj = { ...param_to_send };
      newObj.date = dateString;
      set_param_to_send(newObj);
      navigate(
        `${location.pathname}?${param_to_send?.state ?? "all"}=${dateString}`,
      );
    };
    const Today = new Date() as any;


  return (
    <div className="CustomDatePicker">
    <DatePicker
      defaultValue={dayjs(Today)}
      placeholder={t(`input.select_date`)}
      onChange={onChange}
      format={DateEnum?.FORMATE}
    />
  </div>
  )
}

export default CustomDatePicker