import type { StorybookConfig } from '@storybook/nextjs-vite'
import { dirname, join } from 'path'
import { mergeConfig } from 'vite'

const config: StorybookConfig = {
  stories: ['../lib/**/*.mdx', '../lib/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
  addons: [
    getAbsolutePath('@storybook/addon-links'),
    getAbsolutePath('@storybook/addon-themes'),
    getAbsolutePath('@storybook/addon-vitest'),
    getAbsolutePath('@storybook/addon-docs'),
    getAbsolutePath('@storybook/addon-a11y'),
    getAbsolutePath('storybook-react-intl'),
  ],
  framework: {
    name: getAbsolutePath('@storybook/nextjs-vite'),
    options: {},
  },
  async viteFinal(config) {
    return mergeConfig(config, {
      plugins: [
        // Add babel plugin for react-intl transformation
        {
          name: 'formatjs-transform',
          async transform(code, id) {
            if (id.includes('node_modules')) return
            if (!/\.(jsx?|tsx?)$/.test(id)) return

            const babel = await import('@babel/core')
            const result = babel.transformSync(code, {
              plugins: [
                [
                  'formatjs',
                  {
                    idInterpolationPattern: '[sha512:contenthash:base64:6]',
                    ast: true,
                  },
                ],
              ],
              filename: id,
            })

            return result?.code
          },
        },
      ],
    })
  },
}
export default config

function getAbsolutePath(value: string) {
  return dirname(require.resolve(join(value, 'package.json')))
}