Can we create the Custom Range for the Agenda view

guptajyoti845 commented 1 year ago

Check that this is really a bug

[X] I confirm

Reproduction link

https://codesandbox.io/s/calender-impl-75fq2k?file=/package.json

Bug description

In {Calendar} of react-big-calender, How can we create the custom range for the agenda view like we should disable/hide going back more than 2 days? and should disable/hide looking ahead more than 2 weeks? As we want the performer not to infinitely browse future and past data.

Expected Behavior

The user is unable to view data from more than 2 days before now() in Agenda View

The user is unable to view data from more than 2 weeks after now() in Agenda View.

Actual Behavior

Currently, users can infinitely browse future and past data.

react-big-calendar version

^1.5.0

React version

^18.1.0

Platform/Target and Browser Versions

Google Chrome Version 108.0.5359.124 (Official Build) (arm64)

Validations

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

Would you like to open a PR for this bug?

[X] I'm willing to open a PR

bu6n commented 1 year ago

You could always pass a custom Toolbar component that enables/disables some actions based on the date. Or only pass the relevant events to the calendar when this special user is logged in.

sbmaggarwal commented 1 year ago

@bu6n Is there an example available? I am also trying to do the same, overall calendar component is working but can't get this Custom Range for the Agenda view working.

bu6n commented 1 year ago

The custom range is not working yet with react-big-calendar. But what you could do (if you have a range picker or something) when you are in list view is pass only the events in the range of your picker, and then change the displayed date with that of your range picker. Don't have an example yet

jquense / react-big-calendar