/* eslint-disable react/jsx-props-no-spreading */
import React, { FunctionComponent } from 'react';
import { MuiPickersUtilsProvider } from '@material-ui/pickers';
import omit from 'lodash/omit';
import MomentUtils from '@date-io/moment';
import moment from 'moment';
import { StyledDatePicker } from './styled-component';
import { DateRangePicker, DatePicker } from './components';
import { Button } from '../Button';
import { Title } from '../Title';
import { Wrapper } from '../Wrapper';
import { MonthSelectionProps } from './types';
import 'moment/locale/ru';
import 'moment/locale/it';

const setLocale = (locale: string): void => {
  moment.locale(locale);
};

const MonthSelection: FunctionComponent<MonthSelectionProps> = (props) => {
  const { titleProps, titleChildren, isVisible, buttonCancel, buttonSave } = props;
  return isVisible ? (
    <Wrapper className="month-select calendar-base">
      {titleChildren ? <Title {...titleProps}>{titleChildren}</Title> : null}
      <StyledDatePicker {...omit(props, 'title', 'isVisible', 'variant')} views={['month']} />
      {buttonCancel || buttonSave ? (
        <div className="buttons-wrapper">
          {buttonCancel ? <Button {...buttonCancel} /> : null}
          {buttonSave ? <Button {...buttonSave} /> : null}
        </div>
      ) : null}
    </Wrapper>
  ) : null;
};

export const Calendar = {
  Provider: MuiPickersUtilsProvider,
  Utils: MomentUtils,
  setLocale,
  DatePicker,
  DateRangePicker,
  MonthSelection,
};
