t0gre/react-datepicker

initialVisibleMonth ignored when startDate and endDate are set

Opened this issue · 0 comments

@datepicker-react/hooks or @datepicker-react/styled version
e.g. @datepicker-react/hooks@2.8.4

Describe the bug
When passing in a startDate and endDate parameter to the in addition to a initialVisibleMonth useDatePicker hook, the initialVisibleMonth is ignored, and the the initialVisibleMonth defaults to the startDate

Source code (including props configuration)
Steps to reproduce the behavior:

const [state, setState] = useState({
    startDate: new Date(2020, 1, 1),
    endDate: new Date(2022, 1, 1),
    focusedInput: START_DATE
  });
  const {
    firstDayOfWeek,
    activeMonths,
    isDateSelected,
    isDateHovered,
    isFirstOrLastSelectedDate,
    isDateBlocked,
    isDateFocused,
    onDateHover,
    onDateSelect,
    onDateFocus,
    goToPreviousMonths,
    goToNextMonths
  } = useDatepicker({
    startDate: state.startDate,
    endDate: state.endDate,
    focusedInput: state.focusedInput,
    onDatesChange: handleDateChange,
    initialVisibleMonth: new Date(2022, 1, 1),
    numberOfMonths: 2
  });

  function handleDateChange(data) {
    if (!data.focusedInput) {
      setState({ ...data, focusedInput: START_DATE });
    } else {
      setState(data);
    }
  }

codeSandbox link

Screenshots/Gifs
If applicable, add screenshots or gifs to help explain your problem.
initialVisibleMonth param respected:
Screenshot 2023-03-08 at 15 55 52

initialVisibleMonth ignored, view is set to startDate:
Screenshot 2023-03-08 at 15 55 28

Desktop (please complete the following information):
N/A

Smartphone (please complete the following information):
N/A

Is the issue reproducible in Storybook?
Unknown - netlify link returns a 404

Additional context
Add any other context about the problem here.
It is an edge case where the datepicker is pre-filled with a range over 2 months.

I have been using this as a workaround

React.useEffect(() => goToDate(endDate, [goToDate]);

as a workaround to go to the current date