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

shownDate changes do not change Calendar #552 #625

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

Conversation

abtahi-tajwar
Copy link

Problem Statement

We need a way to manually change the shown date to a specific month because it is not always relevant to automatically navigate to the selected start date itself. Currently, this package offers an attribute named shownDate which does not respond desirably.

Faced Problem Scenario

This problem was faced by me while I was implementing a date range picker with this package. The purpose of that picker is to let users pick vacation ranges from the calendar. However, I had to check existing leaves and vacations while changing each month which updates a state by calling an API. That API update is re-rendering the selected date and the navigation is coming back to that selected date.

Solution of this Pull Request

In this PR, I have added another attribute named setShownDate which will return a callback function to navigate to a specific month. The callback function will take one date parameter. It will simply move the view to that specific date.

How to use

const [changeShownDate, setChangeShownDate] = useState(null)
<DateRange 
{...props}
setShownDate={func => setChangeShownDate(func)}
/>

<button onClick={() => setChangeShownDate(changeShownDate(new Date('01/25/2015')))}>

After calling the function from state, the calendar will navigate to the specific date.

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.

1 participant