React-dates: go to start/end date on focus

[jpollard-cs]

• a user selects a start date, navigates 6 months into the future and selects an end date
• the user decides they want to modify the start date so they have to navigate all the way back to the start date
• if focusing on the start date or end date provided a hook that would allow you to focus on the start/end date, this would somewhat simplify navigation

In a way this would be addressed with https://github.com/airbnb/react-dates/issues/25, but I think a user expects that clicking on a pre-selected date, or manually entering a date, would navigate to that date in the calendar popover.

[majapw]

Hmm I think actually https://github.com/airbnb/react-dates/issues/48 is more inline with this prompt. If the visible month itself was controlled, then we'd be able to set it based on whether start date or end date was in fact focused.

Unfortunately, there are a lot of open questions about the animation in particular that I would want to address.

[jpollard-cs]

ok, thanks - had a feeling that is the case - I will close this since it looks like #48 would provide the ability to introduce this behavior

[chriddyp]

I'm not sure if this is the same request or not, but I was able to solve this with:

[...]
                initialVisibleMonth={
                    () => {
                        if (this.state.focusedInput === 'endDate') {
                            return this.state.endDate;
                        } else {
                            return this.state.startDate;
                        }
                    }
                }

Before, it always focused on the startDate

After implementing initialVisibleMonth, it focuses on whatever date you selected. (This is particularly helpful if the endDate is years away from the startDate)

---

Huge thanks for the wonderful library ✨ !