import { Meta, Story, Canvas, ArgsTable } from '@storybook/addon-docs/blocks';
import Error from '../Error';

<Meta
    title={`Atoms/Error`}
    component={Error}
    argTypes={{
        errorText: {
            // Using text type to allow the control to be changed in the story. JSX is not supported at this time.
            control: { type: 'text' },
        },
        errorIcon: {
            control: { disable: true },
        },
    }}
    args={{
        title: 'Internal Server Error (Error 500)',
        errorText:
            <>
                The page could not load because of a server error. Wait, then refresh the page.
                <br />
                If this error reappears, contact support.
            </>,
        links: ['View all invoices', 'Go to homepage'],
    }}
/>

### Without links
<Canvas>
    <Story name="Without links" argTypes={{ links: { control: { disable: true } } }}>
        {({ title, errorText }) => (
            <Error
                title={title}
                errorText={errorText}
            />
        )}
    </Story>
</Canvas>

## Props
<ArgsTable of={Error} />
