45 lines
1.1 KiB
TypeScript
45 lines
1.1 KiB
TypeScript
|
import React from 'react';
|
||
|
|
|
||
|
|
import { action } from '@storybook/addon-actions';
|
||
|
|
import { date, number } from '@storybook/addon-knobs';
|
||
|
|
import { storiesOf } from '@storybook/react';
|
||
|
|
|
||
|
|
import { Countdown, Props } from './Countdown';
|
||
|
|
|
||
|
|
const defaultDuration = 10 * 1000;
|
||
|
|
const createProps = (overrideProps: Partial<Props> = {}): Props => ({
|
||
|
|
duration: number('duration', overrideProps.duration || defaultDuration),
|
||
|
|
expiresAt: date(
|
||
|
|
'expiresAt',
|
||
|
|
overrideProps.expiresAt
|
||
|
|
? new Date(overrideProps.expiresAt)
|
||
|
|
: new Date(Date.now() + defaultDuration)
|
||
|
|
),
|
||
|
|
onComplete: action('onComplete'),
|
||
|
|
});
|
||
|
|
|
||
|
|
const story = storiesOf('Components/Countdown', module);
|
||
|
|
|
||
|
|
story.add('Just Started', () => {
|
||
|
|
const props = createProps();
|
||
|
|
|
||
|
|
return <Countdown {...props} />;
|
||
|
|
});
|
||
|
|
|
||
|
|
story.add('In Progress', () => {
|
||
|
|
const props = createProps({
|
||
|
|
duration: 3 * defaultDuration,
|
||
|
|
expiresAt: Date.now() + defaultDuration,
|
||
|
|
});
|
||
|
|
|
||
|
|
return <Countdown {...props} />;
|
||
|
|
});
|
||
|
|
|
||
|
|
story.add('Done', () => {
|
||
|
|
const props = createProps({
|
||
|
|
expiresAt: Date.now() - defaultDuration,
|
||
|
|
});
|
||
|
|
|
||
|
|
return <Countdown {...props} />;
|
||
|
|
});
|