mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-18 07:23:21 +01:00
429847a686
Our Storybook dependencies have been updated to v6.1.9, from v5. This was done to address a security vulnerability in a transitive dependency of these packages (`highlight.js`). The primary changes required by this Storybook update were the change in import path for the `withKnobs` hook, the change in background config format, and the webpack configuration. Storybook seems to work correctly. The migration was guided by the Storybook changelog[1] and the Storybook v6 migration guide[2]. There is one Storybook error remaining; it fails to load the Euclid font. This is a pre-existing error though, so we can fix it in a later PR. The `yarn.lock` file was deduplicated in this PR as well, as it was required to fix various install warnings that were introduced with this update. [1]: https://github.com/storybookjs/storybook/blob/next/CHANGELOG.md [2]: https://github.com/storybookjs/storybook/blob/next/MIGRATION.md
64 lines
1.4 KiB
JavaScript
64 lines
1.4 KiB
JavaScript
import React from 'react'
|
|
import { number } from '@storybook/addon-knobs'
|
|
import CountdownTimer from './countdown-timer'
|
|
|
|
export default {
|
|
title: 'CountdownTimer',
|
|
}
|
|
|
|
const getTimeStartedFromDecrimentSeconds = (seconds) =>
|
|
Date.now() - seconds * 1000
|
|
|
|
export const Default = () => {
|
|
const timeStartedSecondDecriment = number(
|
|
'Set timeStarted to curren time minus X seconds',
|
|
10,
|
|
)
|
|
|
|
return (
|
|
<CountdownTimer
|
|
timeStarted={getTimeStartedFromDecrimentSeconds(
|
|
timeStartedSecondDecriment,
|
|
)}
|
|
timeOnly
|
|
/>
|
|
)
|
|
}
|
|
|
|
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"
|
|
/>
|
|
)
|
|
}
|