Skip to content

Commit bc84ae7

Browse files
Merge pull request #5214 from OlegDev1/main
fix: "previous month" button appears when selecting a date
2 parents ce8c371 + 0021d7d commit bc84ae7

File tree

2 files changed

+38
-1
lines changed

2 files changed

+38
-1
lines changed

src/calendar.tsx

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -528,6 +528,14 @@ export default class Calendar extends Component<CalendarProps, CalendarState> {
528528
return;
529529
}
530530

531+
const monthsShown =
532+
this.props.monthsShown ?? Calendar.defaultProps.monthsShown;
533+
const monthsToSubtract = this.props.showPreviousMonths
534+
? monthsShown - 1
535+
: 0;
536+
const monthSelectedIn = this.props.monthSelectedIn ?? monthsToSubtract;
537+
const fromMonthDate = subMonths(this.state.date, monthSelectedIn);
538+
531539
let allPrevDaysDisabled;
532540
switch (true) {
533541
case this.props.showMonthYearPicker:
@@ -543,7 +551,7 @@ export default class Calendar extends Component<CalendarProps, CalendarState> {
543551
);
544552
break;
545553
default:
546-
allPrevDaysDisabled = monthDisabledBefore(this.state.date, this.props);
554+
allPrevDaysDisabled = monthDisabledBefore(fromMonthDate, this.props);
547555
break;
548556
}
549557

src/test/calendar_test.test.tsx

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -448,6 +448,35 @@ describe("Calendar", () => {
448448
expect(nextButtonAriaLabel).toBe(nextYearAriaLabel);
449449
});
450450

451+
it("should not have previous month button when selecting a date in the second month, when min date is specified", () => {
452+
const { container } = render(
453+
<DatePicker
454+
inline
455+
monthsShown={2}
456+
minDate={new Date("2024-11-06")}
457+
maxDate={new Date("2025-01-01")}
458+
/>,
459+
);
460+
461+
expect(
462+
container.querySelector(".react-datepicker__navigation--previous"),
463+
).toBe(null);
464+
465+
const secondMonthDate = safeQuerySelectorAll(
466+
container,
467+
".react-datepicker__day--009",
468+
)[1];
469+
if (!secondMonthDate) {
470+
throw new Error("second month date is not found");
471+
}
472+
473+
fireEvent.click(secondMonthDate);
474+
475+
expect(
476+
container.querySelector(".react-datepicker__navigation--previous"),
477+
).toBe(null);
478+
});
479+
451480
describe("custom header", () => {
452481
const months = [
453482
"January",

0 commit comments

Comments
 (0)