import React from 'react';
import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import Sinon from 'sinon';
import { FilterCalendar } from '../src/FilterCalendar/FilterCalendar';
import styles from '../src/Filters.scss';

Enzyme.configure({ adapter: new Adapter() });

const filter = {
  endpoint: '/filterA',
  key: 'aaa',
  value: 'AAA',
  type: 'calendar'
};

const committedDateRange = ['2017-09-05T07:00:00Z', '2017-09-20T07:00:00Z'];
const committedSingleDay = ['2017-09-05T07:00:00Z'];

const I18nText = 'I18n Translation Text';
const I18nObj = { t: () => I18nText, locale: 'en' };

const shallowRender = (props = {}) => {
  const mergedProps = Object.assign({}, {
    currentIndex: -1,
    filter,
    I18n: I18nObj,
    keyListeners: () => {},
    onRemove: () => {},
    committedDates: [],
    isRange: null,
    onSave: () => {},
    removeFilter: () => {},
    styles
  }, props);

  return Enzyme.shallow(
    <FilterCalendar {...mergedProps} />
  );
};

describe('FilterCalendar', () => {
  it('renders the selected date range in the filter token', () => {
    const wrapper = shallowRender({
      committedDates: committedDateRange
    });
    const countElement = wrapper.find(`.${styles.tokenTitle__date}`);
    expect(countElement.text()).toBe('09/05/2017 - 09/20/2017');
  });

  it('renders the selected date in the filter token', () => {
    const wrapper = shallowRender({
      committedDates: committedSingleDay
    });
    const countElement = wrapper.find(`.${styles.tokenTitle__date}`);
    expect(countElement.text()).toBe('09/05/2017');
  });

  describe('on blur', () => {
    it('is not expanded', () => {
      const wrapper = shallowRender({
        committedDates: committedDateRange
      });
      wrapper.setState({ expanded: true });
      wrapper.instance().onBlur();
      expect(wrapper.state('expanded')).toBe(false);
    });

    it('sends current filter and selected keys to save handler', () => {
      const onSave = Sinon.spy();
      const wrapper = shallowRender({
        onSave,
        committedDates: committedDateRange
      });
      wrapper.setState({ ignoreBlur: false });
      wrapper.instance().onBlur();
      expect(onSave.calledWithExactly(filter, committedDateRange, {})).toBe(true);
    });
  });
});