Add missing previousYearButtonLabel and nextYearButtonLabel props (#1850

)
Hacker0x01 · Aug 19, 2019 · 1f4f271 · 1f4f271
1 parent 177562e
commit 1f4f271
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 1 deletion.
diff --git a/src/index.jsx b/src/index.jsx
@@ -160,6 +160,8 @@ export default class DatePicker extends React.Component {
     clearButtonTitle: PropTypes.string,
     previousMonthButtonLabel: PropTypes.string,
     nextMonthButtonLabel: PropTypes.string,
+    previousYearButtonLabel: PropTypes.string,
+    nextYearButtonLabel: PropTypes.string,
     timeInputLabel: PropTypes.string,
     renderCustomHeader: PropTypes.func,
     renderDayContents: PropTypes.func,
@@ -199,7 +201,9 @@ export default class DatePicker extends React.Component {
       timeIntervals: 30,
       timeCaption: "Time",
       previousMonthButtonLabel: "Previous Month",
-      nextMonthButtonLabel: "Next month",
+      nextMonthButtonLabel: "Next Month",
+      previousYearButtonLabel: "Previous Year",
+      nextYearButtonLabel: "Next Year",
       timeInputLabel: "Time",
 
       renderDayContents(date) {
@@ -679,6 +683,8 @@ export default class DatePicker extends React.Component {
         yearDropdownItemNumber={this.props.yearDropdownItemNumber}
         previousMonthButtonLabel={this.props.previousMonthButtonLabel}
         nextMonthButtonLabel={this.props.nextMonthButtonLabel}
+        previousYearButtonLabel={this.props.previousYearButtonLabel}
+        nextYearButtonLabel={this.props.nextYearButtonLabel}
         timeInputLabel={this.props.timeInputLabel}
         disabledKeyboardNavigation={this.props.disabledKeyboardNavigation}
         renderCustomHeader={this.props.renderCustomHeader}

diff --git a/test/calendar_test.js b/test/calendar_test.js
@@ -1043,6 +1043,23 @@ describe("Calendar", function() {
       expect(next.text()).to.equal("Next Year");
     });
 
+    it("should render custom next and previous labels", function() {
+      var calendar = mount(
+        <Calendar
+          dateFormat={DATE_FORMAT}
+          onSelect={() => {}}
+          onClickOutside={() => {}}
+          showMonthYearPicker
+          previousYearButtonLabel="Custom Previous Year Label"
+          nextYearButtonLabel="Custom Next Year Label"
+        />
+      );
+      const previous = calendar.find(".react-datepicker__navigation--previous");
+      const next = calendar.find(".react-datepicker__navigation--next");
+      expect(previous.text()).to.equal("Custom Previous Year Label");
+      expect(next.text()).to.equal("Custom Next Year Label");
+    });
+
     it("calls decreaseYear when previous month button clicked", () => {
       var calendar = TestUtils.renderIntoDocument(
         <Calendar