Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: added "excludeDisabledDays" prop for range picker #2001

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

benoitgoupilleau
Copy link

Context

I'm planning to use react-day-picker for a booking website and typically I would use the range picker. Days that are already booked would appear as disabled but the current package let the user pick a range with potentially disabled days inside.
In that particular use-case, it doesn't work as a booking can't overlap another one.

Screenshot 2023-12-21 at 20 29 30 Screenshot 2023-12-21 at 20 29 56

Analysis

Current code only disables dates for clicking on it, so when a user selects a range, the from can be before a disabled date and the to after, hence selecting a disabled date. In a case of a booking website, that would mean someone could double book.

Solution

My solution is to pass a boolean excludeDisabledDays as prop and if true, the modifiers.disabled will be updated with the enclosing disabled dates. Hence if the user selects a date before a disabled date, then all the dates after that disabled date will be also disabled. The function findDisabledDays looks for the closest disabled dates after and before the selected date and that result is used to update the disabled dates accordingly.
The function addToRange had to be updated as with a min provided, the user could have ended up in the situation where no other dates could be selected. Clicking again on the selected date will now clear the range.
Screenshot 2023-12-21 at 20 31 30
Screenshot 2023-12-21 at 20 31 44

@gpbl
Copy link
Owner

gpbl commented Apr 16, 2024

@benoitgoupilleau thanks for your work here! I don't think a new prop is idea to fix the bug - the exposed solution here should be the default behavior.

The changes proposed may have impact over the performances - reason I haven't merged this yet. I'll keep this open to review it in the next future.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants