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

fix: month gets skipped when the current date is the 31st and the user clicks next month button #862

Merged
merged 2 commits into from
Jun 18, 2019
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
16 changes: 16 additions & 0 deletions library/src/lib/calendar/calendar.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -614,7 +614,23 @@ export class CalendarComponent implements OnInit, OnDestroy, AfterViewChecked, C
}

setCurrentMonth(month: number) {
// get the current date of the month
const currentDate = this.date.getDate();
// get the number of days in the new month
const daysInNewMonth = new Date(this.date.getFullYear(), month + 1, 0).getDate();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if this is december, will the Date object automatically go to January of next year?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes

new Date(2019, 12, 1) = Wed Jan 01 2020 00:00:00 GMT-0700 (Mountain Standard Time)

/*
if the currentDate > daysInNewMonth, set the date to the first for now, to prevent skipping a month
in the event that the currentDate is 31 and the next month has 30 days
*/
if (currentDate > daysInNewMonth) {
this.date.setDate(1);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Does this go to the next month?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No, it sets the date for the current month to 1, but sets it back later

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

hmm not sure how friendly this for ux

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is all happening internally, not with the actual ngModel the user sees

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah I know, but so if the user is on the 31st and clicks next, it goes to date(1) of the same month that was currently displayed? Or the next month?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The month that is currently displayed, but I don't think this really matters because it reverts back a few lines later

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you describe the PR in the description? And also exactly the flow of the bug? Like for instance, if the user presses the next month button, this and this happens.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added a little description. The original ticket is linked in the description with a gif demonstration

}
// set the month
this.date.setMonth(month);
// if currentDate > daysInNewMonth, restore the date to whichever number is lower, today's date or the number of days in this month
if (currentDate > daysInNewMonth) {
this.date.setDate(Math.min(currentDate, daysInNewMonth));
}
this.month = this.date.getMonth();
this.monthName = this.monthsFullName[this.date.getMonth()];
this.year = this.date.getFullYear();
Expand Down