/* eslint-disable import/no-extraneous-dependencies */
import React from 'react';
import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import Sinon from 'sinon';
import { Filters } from '../src/Filters';
import FilterAvailable from '../src/FilterAvailable';
import { FilterCheckbox } from '../src/FilterCheckbox';
import styles from '../src/Filters.scss';

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

const availableFilters = [
  {
    endpoint: '/filterA',
    key: 'aaa',
    value: 'AAA'
  },
  {
    endpoint: '/filterB',
    key: 'bbb',
    value: 'BBB'
  }
];

const I18nText = 'I18n Translation Text';
const I18n = { t: () => I18nText };

const shallowRender = (props = {}) => {
  const mergedProps = Object.assign({}, {
    I18n,
    onFetch: () => {},
    onSave: () => {}
  }, props);

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

describe('Filters', () => {
  describe('add filter menu', () => {
    it('renders', () => {
      const wrapper = shallowRender({ availableFilters, savedFilters: {} });
      const addFilterElement = wrapper.find(FilterAvailable);
      expect(addFilterElement.exists()).toBe(true);
    });

    it('is not rendered if all are active', () => {
      const savedFilters = { aaa: [], bbb: [] };
      const wrapper = shallowRender({ availableFilters, savedFilters });
      const addFilterElement = wrapper.find(FilterAvailable);
      expect(addFilterElement.exists()).toBe(false);
    });
  });

  describe('saved filter menus', () => {
    it('render with type checkbox', () => {
      const savedFilters = { aaa: [] };
      const wrapper = shallowRender({ availableFilters, savedFilters });
      const addFilterElement = wrapper.find('checkbox');
      expect(addFilterElement.exists()).toBe(true);
    });
    it('render with type calender', () => {
      const savedFilters = { choose_date: [] };
      const availableCalendarFilters = [
        {
          endpoint: '/filterA',
          key: 'choose_date',
          value: 'Choose Date',
          type: 'calendar'
        }
      ];
      const wrapper = shallowRender({
        availableFilters: availableCalendarFilters,
        savedFilters
      });

      const addFilterElement = wrapper.find('calendar');
      expect(addFilterElement.exists()).toBe(true);
    });

    it('render with type location', () => {
      const savedFilters = { location_picker: [] };
      const availableCalendarFilters = [
        {
          endpoint: '/filterA',
          key: 'location_picker',
          value: 'Choose Location',
          type: 'location'
        }
      ];

      const wrapper = shallowRender({
        availableFilters: availableCalendarFilters,
        I18n,
        savedFilters
      });

      const addFilterElement = wrapper.find('location');
      expect(addFilterElement.exists()).toBe(true);
    });

    it('are not rendered if empty', () => {
      const wrapper = shallowRender({ availableFilters, savedFilters: {} });
      const savedFiltersElements = wrapper.find(FilterCheckbox);
      expect(savedFiltersElements.exists()).toBe(false);
    });
  });

  describe('clear all button', () => {
    const savedFilters = { aaa: [1234] };

    it('does not render if no saved filters', () => {
      const wrapper = shallowRender({ availableFilters, savedFilters: {} });
      const clearAllElement = wrapper.find(`.${styles.clearAllFilters}`);
      expect(clearAllElement.exists()).toBe(false);
    });

    it('triggers analytics', () => {
      const onAnalytics = Sinon.spy();
      const wrapper = shallowRender({
        availableFilters,
        savedFilters,
        I18n,
        onAnalytics
      });

      const clearAllElement = wrapper.find(`.${styles.clearAllFilters}`);
      clearAllElement.simulate('click');
      expect(onAnalytics.called).toBe(true);
    });

    it('triggers save callback', () => {
      const onSave = Sinon.spy();
      const wrapper = shallowRender({
        availableFilters,
        savedFilters,
        I18n,
        onSave
      });

      const clearAllElement = wrapper.find(`.${styles.clearAllFilters}`);
      clearAllElement.simulate('click');
      expect(onSave.called).toBe(true);
    });

    it('removes all saved filters', () => {
      const wrapper = shallowRender({ availableFilters, I18n, savedFilters });
      const clearAllElement = wrapper.find(`.${styles.clearAllFilters}`);
      clearAllElement.simulate('click');

      const savedFiltersElements = wrapper.find(FilterCheckbox);
      expect(savedFiltersElements.exists()).toBe(false);
    });
  });
});