// @flow
import React from 'react';
import { mountWrappedComponent, itIsAccessible } from '../../../utils/tests';
import type { AnimatedFilterBarProps } from './animated-filter-bar.proptypes';
import { AnimatedFilterBar } from './index';
import { FilterTab } from './components/filter-tab';

const DEFAULT_PROPS: AnimatedFilterBarProps = {
  options: [
    { value: 'd5', label: '5D' },
    { value: 'm1', label: '1M' },
    { value: 'm6', label: '6M' },
    { value: 'ytd', label: 'YTD' },
  ],
  onChange: jest.fn(),
};

describe('FilterBar', () => {
  it('has no default options selected if no selected value given', () => {
    const timeRangeSwitcher = mountWrappedComponent(
      <AnimatedFilterBar {...DEFAULT_PROPS} />,
    );

    timeRangeSwitcher.find(FilterTab).forEach((tab) => {
      expect(tab.prop('selected')).toBe(false);
    });
  });

  it('selects a tab by default', () => {
    const defaultValue = 'm6';
    const timeRangeSwitcher = mountWrappedComponent(
      <AnimatedFilterBar {...DEFAULT_PROPS} value={defaultValue} />,
    );

    timeRangeSwitcher.find(FilterTab).forEach((tab, index) => {
      if (DEFAULT_PROPS.options[index].value === defaultValue) {
        expect(tab.prop('selected')).toBe(true);
      } else {
        expect(tab.prop('selected')).toBe(false);
      }
    });
  });

  it('calls onChange for the tab value when tab is clicked', () => {
    const timeRangeSwitcher = mountWrappedComponent(
      <AnimatedFilterBar {...DEFAULT_PROPS} />,
    );
    const index = 0;

    timeRangeSwitcher.find(FilterTab).at(index).simulate('click');

    expect(DEFAULT_PROPS.onChange).toHaveBeenCalledTimes(1);
  });

  itIsAccessible(<AnimatedFilterBar {...DEFAULT_PROPS} />);
});
