import { createBoard } from '@wixc3/react-board';
import { Button, OverlayToaster, Toaster } from '@blueprintjs/core';

// board cover
import cover from '../../../../assets/toast/primary.svg';

const toaster: Toaster = OverlayToaster.create({
    autoFocus: true,
    canEscapeKeyClear: true,
    maxToasts: 3,
    position: 'top',
    usePortal: true,
});

export default createBoard({
    name: 'Primary',
    Board: () => {
        return (
            <Button
                intent="primary"
                onClick={() =>
                    toaster.show({
                        action: { text: 'Cancel' },
                        isCloseButtonShown: false,
                        icon: 'cloud-upload',
                        intent: 'primary',
                        message: 'Loading...',
                    })
                }
            >
                Toast
            </Button>
        );
    },
    tags: ['primary', 'toast'],
    cover,
});
