import React from 'react';
import { withKnobs, select } from '@storybook/addon-knobs';
import { mount } from 'enzyme';
import { expect } from 'chai';
import { describe, it, specs } from '../../storybook/facade';
import Sparkline from './index';

export default (stories) => {
	stories.addDecorator(withKnobs);

	stories.add('Sparkline', () => {
		const type = select('Sparkline Type', {
			Bar: 'bar',
			Line: 'line'
		}, 'bar');

		const size = select('Font Size', {
			30: 30,
			60: 60
		}, 60);

		const component = type === 'bar' ? (
			<div style={{ background: '#FFF', padding: 20 }}>
				<Sparkline.Bar
					data={[5, 10, 8, 20, 12, 15]}
					fontSize={size}
				/>
			</div>
		) : (
			<div style={{ background: '#FFF', padding: 20 }}>
				<Sparkline.Line
					data={[5, 10, 8, 20, 12, 15]}
					fontSize={size}
				/>
			</div>
		);

		specs(() => describe('Sparkline', () => {
			const wrapper = mount(component);

			it('Should be ok', () => {
				expect(wrapper).be.ok;
			});
		}));

		return component;
	});
};
