// @flow
import React from 'react';
import { mountWrappedComponent, itIsAccessible } from '../../../../utils/tests';

import { FilterBarTab } from './filter-bar-tab';
import type { FilterBarProps } from './filter-bar.proptypes';
import { FilterBar } from './index';

const DEFAULT_PROPS: FilterBarProps = {
  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 filterBar = mountWrappedComponent(<FilterBar {...DEFAULT_PROPS} />);

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

  it('selects a tab by default', () => {
    const selectedValue = 'm6';
    const filterBar = mountWrappedComponent(
      <FilterBar {...DEFAULT_PROPS} selectedValue={selectedValue} />,
    );

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

  it('calls onChange with the tab value when tab is clicked', () => {
    const handleOnChange = jest.fn();
    const filterBar = mountWrappedComponent(
      <FilterBar {...DEFAULT_PROPS} onChange={handleOnChange} />,
    );

    filterBar.find(FilterBarTab).at(0).simulate('click');

    expect(handleOnChange).toHaveBeenCalledTimes(1);
    expect(handleOnChange).toHaveBeenCalledWith(DEFAULT_PROPS.options[0].value);
  });

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