import * as React from 'react'

import { MantineProvider } from '@mantine/core'
import type { Preview, StoryFn } from '@storybook/react'
import theme from 'config/mantine.config'

import '@mantine/core/styles.css'

/** @see {@link https://storybook.js.org/docs/7/essentials/toolbars-and-globals#create-a-decorator | Create a decorator} */
const withMantine = (Story: StoryFn) => (
  <MantineProvider theme={theme}>
    <Story />
  </MantineProvider>
)

const preview: Preview = {
  decorators: [withMantine]
}