Wrong time indicator position when changing min prop

[orck-adrouin]

Check that this is really a bug

• I confirm

Reproduction link

https://codesandbox.io/p/sandbox/react-big-calendar-example-forked-5vg8lz

Bug description

The time indicator position is not recalculated when changing the min prop value.

Our app display a blank calendar (no min/max values) while it is fetching the events from the server. Upon receiving the events it calculates the min/max values to use based on the events and update the calendar's props. I added a "clicky" button in the repro to simulate how our app changes the min value.

You can see the behavior the following GIF. You will also notice that selecting an event changes the position of the time indicator.

I developed the repro using Firefox however while posting this issue I noticed another, probably related, bug when using Chrome: changing the min/max values causes the header to be misaligned because the scrollbar is no longer visible. Do you want me to open another issue about this Chrome issue? GIF:

Expected Behavior

I expect the time indicator to be correctly positioned.

Actual Behavior

The "top offset" of the time indicator is not updated then the min prop changes and because of that it is not at the correct position. Forcing the calendar to render either by selecting an event or resizing the windows "fixes" the issue.

react-big-calendar version

1.14.1

React version

17.0.2

Platform/Target and Browser Versions

Windows Chrome, Firefox

Validations

• Read the docs.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
• Make sure this is a react-big-calendar issue and not an implementation issue

Would you like to open a PR for this bug?

• I'm willing to open a PR