import React, { useState } from "react";
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";

export default function CompactDateRangePicker({ startDate, endDate, setStartDate, setEndDate}) {
  // const [startDate, setStartDate] = useState(null);
  // const [endDate, setEndDate] = useState(null);
  console.log(startDate)
  console.log(endDate)
  console.log(setStartDate)
  console.log(setEndDate)
  return (
    <DatePicker
      selectsRange
      startDate={startDate}
      endDate={endDate}
      onChange={([start, end]) => {
        setStartDate(start);
        setEndDate(end);
        if (end && onChange) onChange({ startDate: start, endDate: end });
      }}
      isClearable
      maxDate={new Date()}
      placeholderText="Select date range"
      withPortal
    />
  );
}