1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
metamask-extension/ui/pages/swaps/countdown-timer/countdown-timer.stories.js
George Marshall 854fc71ae7
Organizing storybook to echo app folder structure (#12796)
* Organizing storybook to echo app folder structure

* Updating new stories to follow new convention from develop
2021-12-01 11:27:57 -08:00

67 lines
1.5 KiB
JavaScript

import React from 'react';
import { number } from '@storybook/addon-knobs';
import CountdownTimer from './countdown-timer';
export default {
title: 'Pages/Swaps/CountdownTimer',
id: __filename,
};
const getTimeStartedFromDecrimentSeconds = (seconds) =>
Date.now() - seconds * 1000;
export const DefaultStory = () => {
const timeStartedSecondDecriment = number(
'Set timeStarted to curren time minus X seconds',
10,
);
return (
<CountdownTimer
timeStarted={getTimeStartedFromDecrimentSeconds(
timeStartedSecondDecriment,
)}
timeOnly
/>
);
};
DefaultStory.storyName = 'Default';
export const CustomTimerBase = () => {
const timeStartedSecondDecriment = number(
'Set timeStarted to curren time minus X seconds',
10,
);
return (
<CountdownTimer
timeStarted={getTimeStartedFromDecrimentSeconds(
timeStartedSecondDecriment,
)}
timerBase={150000}
timeOnly
/>
);
};
// Label keys used in below stories are just for demonstration purposes
export const WithLabelInfoTooltipAndWarning = () => {
const timeStartedSecondDecriment = number(
'Set timeStarted to curren time minus X seconds',
0,
);
return (
<CountdownTimer
timeStarted={getTimeStartedFromDecrimentSeconds(
timeStartedSecondDecriment,
)}
timerBase={20000}
labelKey="disconnectPrompt"
infoTooltipLabelKey="disconnectAllAccountsConfirmationDescription"
warningTime="0:15"
/>
);
};