1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
metamask-extension/ui/components/app/metamask-translation/metamask-translation.stories.js
Etienne Dusseault 1794ee8b72
Fix metamask-translation component for new Storybook format (#12892)
* metamask-translation

* Replacing broken ArgsTable with manual markdown table

* Grammer fix

Co-authored-by: georgewrmarshall <george.marshall@consensys.net>
2021-12-07 14:29:12 -08:00

48 lines
1.1 KiB
JavaScript

import React from 'react';
import { groupBy } from 'lodash';
import en from '../../../../app/_locales/en/messages.json';
import README from './README.mdx';
import MetaMaskTranslation from './metamask-translation';
const { keysWithoutSubstitution } = groupBy(Object.keys(en), (key) => {
if (en[key].message.includes('$1')) {
return 'keysWithSubstitution';
}
return 'keysWithoutSubstitution';
});
export default {
title: 'Components/App/MetamaskTranslation',
id: __filename,
component: MetaMaskTranslation,
parameters: {
docs: {
page: README,
},
},
argTypes: {
translationKey: { options: keysWithoutSubstitution, control: 'select' },
variables: { control: 'array' },
},
};
export const DefaultStory = (args) => {
return <MetaMaskTranslation {...args} />;
};
DefaultStory.storyName = 'Default';
DefaultStory.args = {
translationKey: keysWithoutSubstitution[0],
};
export const WithTemplate = (args) => (
<MetaMaskTranslation
{...args}
variables={[<h1 key="link">{args.translationKey}</h1>]}
/>
);
WithTemplate.args = {
translationKey: keysWithoutSubstitution[0],
};