mirror of
https://github.com/elyby/accounts-frontend.git
synced 2024-12-11 07:49:01 +05:30
74f04e9080
* Create storybooks for developers' pages * Fix ‘ApplicationForm/Create Minecraft server’ story * Clean up the code * Concretize the types and behaviour
54 lines
2.0 KiB
TypeScript
54 lines
2.0 KiB
TypeScript
import React, { ComponentType, ComponentProps } from 'react';
|
|
import { storiesOf } from '@storybook/react';
|
|
import { action } from '@storybook/addon-actions';
|
|
|
|
import ApplicationsIndex from './ApplicationsIndex';
|
|
import { TYPE_APPLICATION } from 'app/components/dev/apps';
|
|
|
|
import { OauthAppResponse } from 'app/services/api/oauth';
|
|
import rootStyles from 'app/pages/root/root.scss';
|
|
import devStyles from 'app/pages/dev/dev.scss';
|
|
|
|
export const DevLayout: ComponentType = ({ children }) => (
|
|
<div className={rootStyles.wrapper}>
|
|
<div className={devStyles.container}>{children}</div>
|
|
</div>
|
|
);
|
|
|
|
export const sampleApp: OauthAppResponse = {
|
|
clientId: 'my-application',
|
|
clientSecret: 'cL1eNtS3cRE7xNJqfWQdqrMRKURfW1ssP4kiX6JDW0_szM-n-q',
|
|
type: TYPE_APPLICATION,
|
|
name: 'My Application',
|
|
websiteUrl: '',
|
|
createdAt: 0,
|
|
countUsers: 0,
|
|
};
|
|
|
|
const commonProps: Omit<ComponentProps<typeof ApplicationsIndex>, 'isLoading' | 'displayForGuest' | 'applications'> = {
|
|
clientId: null,
|
|
resetClientId: action('resetClientId'),
|
|
resetApp: async (...args) => action('resetApp')(...args),
|
|
deleteApp: async (clientId) => action('deleteApp')(clientId),
|
|
};
|
|
|
|
storiesOf('Components/Dev/Apps/ApplicationsIndex', module)
|
|
.addDecorator((storyFn) => <DevLayout>{storyFn()}</DevLayout>)
|
|
.add('Guest', () => <ApplicationsIndex isLoading={false} displayForGuest applications={[]} {...commonProps} />)
|
|
.add('Loading', () => <ApplicationsIndex isLoading displayForGuest={false} applications={[]} {...commonProps} />)
|
|
.add('Empty', () => (
|
|
<ApplicationsIndex isLoading={false} displayForGuest={false} applications={[]} {...commonProps} />
|
|
))
|
|
.add('With apps', () => (
|
|
<ApplicationsIndex
|
|
isLoading={false}
|
|
displayForGuest={false}
|
|
applications={[
|
|
sampleApp,
|
|
{ ...sampleApp, clientId: 'my-application1', countUsers: 10 },
|
|
{ ...sampleApp, clientId: 'my-application2', countUsers: 1 },
|
|
]}
|
|
{...commonProps}
|
|
/>
|
|
));
|