Add DynamicTable with footer Canvas to storybook

This commit is contained in:
Mattias van den Belt 2022-03-19 02:02:23 +01:00
parent 0a5ce6f34a
commit 5fab3b5e7a

View File

@ -8,7 +8,7 @@ import { Box } from '@strapi/design-system/Box';
import { Flex } from '@strapi/design-system/Flex';
import { BaseCheckbox } from '@strapi/design-system/BaseCheckbox';
import { Dialog, DialogBody, DialogFooter } from '@strapi/design-system/Dialog';
import { Tbody, Td, Tr } from '@strapi/design-system/Table';
import { Tbody, Td, Tr, TFooter } from '@strapi/design-system/Table';
import { Typography } from '@strapi/design-system/Typography';
import { IconButton } from '@strapi/design-system/IconButton';
import { Plus, Pencil, Trash } from '@strapi/icons';
@ -93,6 +93,43 @@ import { DynamicTable } from '@strapi/helper-plugin';
</Story>
</Canvas>
## Usage No content with footer
<Canvas>
<Story name="no-content-with-footer">
{() => {
const headers = [
{
name: 'firstname',
metadatas: { label: 'Firstname', sortable: false },
key: '__firstname_key__',
},
{
name: 'lastname',
metadatas: { label: 'Email', sortable: false },
key: '__lastname_key__',
},
{
name: 'email',
metadatas: { label: 'Email', sortable: false },
key: '__email_key__',
},
];
const [{ query }, setQuery] = useQueryParams();
useEffect(() => {
setQuery({ filters: { $and: [{ firstname: { $eq: 'soupette' } }] } });
}, []);
return (
<Main>
<Box paddingTop={6}>
<DynamicTable headers={headers} contentType="users" footer={<TFooter icon={<Plus />}>Add another user</TFooter>}/>
</Box>
</Main>
);
}}
</Story>
</Canvas>
## Usage No content with filters
<Canvas>