// @flow
import React from 'react';
import { mountWrappedComponent, itIsAccessible } from '../../../utils/tests';
import type { TimeRangeSelectorProps } from './time-range-selector.proptypes';
import { TimeRangeSelector } from './index';
import { TimeRangeItem } from './components/time-range-item.component';

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

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

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

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

    timeRangeSwitcher.find(TimeRangeItem).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(
      <TimeRangeSelector {...DEFAULT_PROPS} />,
    );
    const index = 0;

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

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

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