import React, { forwardRef } from "react";
//import DatePicker from "react-datepicker";
//import "react-datepicker/src/stylesheets/datepicker.scss";
import { TimePicker } from "antd";
import moment from "moment";
import FormDatePicker from "../form-date-picker/form-date-picker.component";
//To be used as a form element only.

const DateTimePicker = (
  { value, onChange, onBlur, id, onlyFuture, ...restProps },
  ref
) => {
  // const handleChange = (newDate) => {
  //   if (value !== newDate && onChange) {
  //     onChange(newDate);
  //   }
  // };

  return (
    <div id={id}>
      <FormDatePicker
        {...restProps}
        {...(onlyFuture && {
          disabledDate: (d) => moment().subtract(1, "day").isAfter(d),
        })}
        value={value}
        onBlur={onBlur}
        onChange={onChange}
        onlyFuture={onlyFuture}
        isDateOnly={false}
      />

      <TimePicker
        value={value ? moment(value) : null}
        {...(onlyFuture && {
          disabledDate: (d) => moment().isAfter(d),
        })}
        onChange={onChange}
        showSecond={false}
        minuteStep={15}
        onBlur={onBlur}
        format="hh:mm a"
        {...restProps}
      />
    </div>
  );
};

export default forwardRef(DateTimePicker);