Pass dateFormatCalendar to MonthDropdown to determine nominative or genitive display of month name (Hacker0x01#858)

Author: mgrdevport

src/calendar.jsx

@@ -236,6 +236,7 @@ export default class Calendar extends React.Component {
       <MonthDropdown
           dropdownMode={this.props.dropdownMode}
           locale={this.props.locale}
+          dateFormat={this.props.dateFormat}
           onChange={this.changeMonth}
           month={this.state.date.month()} />
     )

src/month_dropdown.jsx

@@ -10,6 +10,7 @@ export default class MonthDropdown extends React.Component {
   static propTypes = {
     dropdownMode: PropTypes.oneOf(['scroll', 'select']).isRequired,
     locale: PropTypes.string,
+    dateFormat: PropTypes.string.isRequired,
     month: PropTypes.number.isRequired,
     onChange: PropTypes.func.isRequired
   }
@@ -69,7 +70,7 @@ export default class MonthDropdown extends React.Component {
   render () {
     const localeData = moment.localeData(this.props.locale)
     const monthNames = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11].map(
-      (M) => localeData.months(moment({M}))
+      (M) => localeData.months(moment({M}), this.props.dateFormat)
     )
 
     let renderedDropdown

test/month_dropdown_test.js

@@ -14,10 +14,12 @@ describe('MonthDropdown', () => {
   let sandbox
 
   function getMonthDropdown (overrideProps) {
+    const dateFormatCalendar = 'MMMM YYYY'
     return mount(
       <MonthDropdown
           dropdownMode="scroll"
           month={11}
+          dateFormat={dateFormatCalendar}
           onChange={mockHandleChange}
           {...overrideProps} />
     )
@@ -74,6 +76,21 @@ describe('MonthDropdown', () => {
       monthDropdown.find('.react-datepicker__month-option').at(2).simulate('click')
       expect(handleChangeResult).to.eq(2)
     })
+
+    it('should use dateFormat property to determine nominative or genitive display of month names', () => {
+      let dropdownDateFormat = getMonthDropdown({dateFormat: 'DD/MM/YYYY'})
+      expect(dropdownDateFormat.text()).to.contain('December')
+
+      dropdownDateFormat = getMonthDropdown({locale: 'el'})
+      expect(dropdownDateFormat.text()).to.contain('Δεκέμβριος')
+      dropdownDateFormat = getMonthDropdown({locale: 'el', showMonthDropwdown: true})
+      expect(dropdownDateFormat.text()).to.contain('Δεκέμβριος')
+
+      dropdownDateFormat = getMonthDropdown({dateFormat: 'DMMMMYYYY', locale: 'el'})
+      expect(dropdownDateFormat.text()).to.contain('Δεκεμβρίου')
+      dropdownDateFormat = getMonthDropdown({dateFormat: 'DMMMMYYYY', locale: 'el', showMonthDropwdown: true})
+      expect(dropdownDateFormat.text()).to.contain('Δεκεμβρίου')
+    })
   })
 
   describe('select mode', () => {