/**
 * imui.monthPicker - Month
 * @author riverhan
 * @date 2017-2-19
 */

import React from 'react';
import PropTypes from 'prop-types';
import {
  getPureDate,
} from '../../datepicker/lib/dateUtils';
import MonthItem from './MonthItem';

class Month extends React.Component {
  static propTypes = {
    day: PropTypes.object.isRequired,
    onMonthClick: PropTypes.func.isRequired,
    minDate: PropTypes.object,
    maxDate: PropTypes.object,
  };

  static defaultProps = {
    day: new Date(),
  };

  renderMonthItems() {
    const day = getPureDate(this.props.day);
    const year = day.getFullYear();

    return [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
      .map((monthIndex, offset) =>
        <MonthItem
          {...this.props}
          key={`${year}-${offset}`}
          monthDay={new Date(year, monthIndex, 1)}
        />
      );
  }

  render() {
    return (
      <div
        className="im-mp-month"
      >
        {this.renderMonthItems()}
      </div>
    );
  }
}

export default Month;