import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import { branding } from './src/config/branding.js';

export default defineConfig({
  plugins: [
    react(),
    {
      name: 'html-transform',
      transformIndexHtml(html) {
        return html
          .replace(/<title>.*?<\/title>/, `<title>${branding.app.name}</title>`)
          .replace(
            /<meta name="description" content=".*?"\/>/,
            `<meta name="description" content="${branding.app.description}"/>`
          )
          .replace(
            /<meta name="keywords" content=".*?"\/>/,
            `<meta name="keywords" content="${branding.meta.keywords}"/>`
          )
          .replace(
            /<meta name="author" content=".*?"\/>/,
            `<meta name="author" content="${branding.meta.author}"/>`
          )
          .replace(
            /<meta name="theme-color" content=".*?"\/>/,
            `<meta name="theme-color" content="${branding.meta.themeColor}"/>`
          )
          .replace(
            /<meta name="apple-mobile-web-app-title" content=".*?"\/>/,
            `<meta name="apple-mobile-web-app-title" content="${branding.app.shortName}"/>`
          )
          .replace(
            /<meta property="og:title" content=".*?"\/>/,
            `<meta property="og:title" content="${branding.app.name}"/>`
          )
          .replace(
            /<meta property="og:description" content=".*?"\/>/,
            `<meta property="og:description" content="${branding.app.description}"/>`
          );
      },
    },
  ],
  server: {
    host: '0.0.0.0',
    port: 3000,
    proxy: {
      '/api': {
        target: 'http://backend:5000',
        changeOrigin: true,
      },
    },
  },
});