import path from 'node:path'
import type { StorybookConfig } from '@storybook/vue3-vite'
import vue from '@vitejs/plugin-vue'

const config: StorybookConfig = {
  stories: ['../app/components/**/*.stories.@(js|ts)'],
  addons: ['@storybook/addon-essentials', '@storybook/addon-interactions'],
  framework: {
    name: '@storybook/vue3-vite',
    options: {}
  },
  core: {
    disableTelemetry: true
  },
  docs: {
    autodocs: false
  },
  viteFinal: async (baseConfig) => {
    const projectRoot = path.resolve(__dirname, '..')
    baseConfig.resolve = baseConfig.resolve || {}
    baseConfig.resolve.alias = {
      ...baseConfig.resolve.alias,
      '~': path.resolve(__dirname, '../app'),
      '@': path.resolve(__dirname, '../app'),
      '@graphql-typed-document-node/core': path.resolve(__dirname, './shims/graphql-typed-document-node-core.ts')
    }
    baseConfig.plugins = baseConfig.plugins || []
    baseConfig.plugins.push(vue())
    baseConfig.root = projectRoot
    baseConfig.server = {
      ...(baseConfig.server || {}),
      fs: {
        ...(baseConfig.server?.fs || {}),
        allow: Array.from(
          new Set([
            ...(baseConfig.server?.fs?.allow || []),
            projectRoot
          ])
        )
      }
    }
    return baseConfig
  }
}

export default config
