import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import svgr from "vite-plugin-svgr";
import { resolve } from "path";

// https://vite.dev/config/
export default defineConfig(({ mode }) => {
  const isDev = mode === "development";
  const isMarketingBuild = mode === "marketing";

  return {
    plugins: [
      react(),
      svgr({
        svgrOptions: {
          icon: true,
          // This will transform your SVG to a React component
          exportType: "named",
          namedExport: "ReactComponent",
        },
      }),
    ],
    // Optimize dependency pre-bundling
    optimizeDeps: {
      include: [
        // Only pre-bundle frequently used, small dependencies
        "clsx",
        "tailwind-merge",
        "zustand",
        // Include apexcharts for proper module resolution (skip during marketing-only build)
        ...(isMarketingBuild ? [] : ["apexcharts", "react-apexcharts"]),
      ],
      // Exclude heavy dependencies that are only used in specific pages
      // They will be lazy-loaded when needed
      exclude: [
        "@fullcalendar/core",
        "@fullcalendar/daygrid",
        "@fullcalendar/interaction",
        "@fullcalendar/list",
        "@fullcalendar/react",
        "@fullcalendar/timegrid",
        "@react-jvectormap/core",
        "@react-jvectormap/world",
        "react-dnd",
        "react-dnd-html5-backend",
        "swiper",
      ],
      esbuildOptions: {
        target: 'es2020',
      },
    },
    // Build configuration for code splitting
    build: {
      // Enable minification (esbuild is faster than terser)
      minify: 'esbuild',
      // Enable CSS code splitting
      cssCodeSplit: true,
      // Optimize chunk size
      rollupOptions: {
        input: isMarketingBuild
          ? {
              marketing: resolve(__dirname, "marketing.html"),
            }
          : {
              main: resolve(__dirname, "index.html"),
              marketing: resolve(__dirname, "marketing.html"),
            },
        output: {
          // Optimize chunk file names
          chunkFileNames: 'assets/js/[name]-[hash].js',
          entryFileNames: 'assets/js/[name]-[hash].js',
          assetFileNames: 'assets/[ext]/[name]-[hash].[ext]',
        },
      },
      // Increase chunk size warning limit (default is 500kb)
      chunkSizeWarningLimit: 600,
      // Enable source maps in dev only
      sourcemap: isDev,
      // Report compressed sizes
      reportCompressedSize: true,
    },
    // Only configure server and HMR in development mode
    ...(isDev && {
      server: {
        host: "0.0.0.0", // Allow external connections (for Docker)
        port: isMarketingBuild ? 5174 : 5173, // Different port for marketing dev
        strictPort: false, // Allow port fallback if port is busy
        allowedHosts: [
          "app.igny8.com",
          "igny8.com",
          "localhost",
          "127.0.0.1",
        ],
        watch: {
          usePolling: true, // Needed for file watching in Docker
        },
        hmr: {
          // Behind reverse proxy - use same origin strategy
          // Client connects via public domain on default HTTPS port (443)
          // Caddy automatically proxies WebSocket upgrades from 443 to dev port
          protocol: "wss",
          // Don't specify host/port - Vite will use same origin as page
          // This ensures client connects to wss://domain.com (port 443 implicit)
        },
        // Increase timeout for slow connections and dependency pre-bundling
        timeout: 120000, // 120 seconds (2 minutes) to match Caddy timeout
      },
    }),
  };
});