import { jsxLocPlugin } from "@builder.io/vite-plugin-jsx-loc";
import react from "@vitejs/plugin-react";
import path from "node:path";
import { createRequire } from "node:module";
import { defineConfig, type Plugin } from "vite";

const PROJECT_ROOT = import.meta.dirname;
const require = createRequire(import.meta.url);
const tailwindcss3 = require("tailwindcss3");
const autoprefixer = require("autoprefixer");

function legacyIndexRewritePlugin(): Plugin {
  return {
    name: "legacy-index-rewrite",
    apply: "serve",
    configureServer(server) {
      server.middlewares.use((req, _res, next) => {
        const url = (req.url ?? "").split("?")[0];
        if (url === "/" || url === "/index.html" || url === "/i.modern.html") {
          req.url = "/i.legacy.html";
        }
        next();
      });
    },
  };
}

/** Dev MPA may discover modern CSS — stub them so Tailwind v3 postcss does not choke. */
function legacySkipModernCssPlugin(): Plugin {
  return {
    name: "legacy-skip-modern-css",
    enforce: "pre",
    apply: "serve",
    load(id) {
      const norm = id.replace(/\\/g, "/");
      if (norm.endsWith("/client/src/index.css")) {
        return "/* legacy dev: skip modern index.css */";
      }
      if (/node_modules\/tailwindcss\/index\.css/.test(norm)) {
        return "/* legacy dev: skip tailwind v4 */";
      }
    },
  };
}

/* ── Deploy base path ── */
const DEPLOY_ENV = process.env.DEPLOY_ENV || "production";
const isProd = process.env.NODE_ENV === "production";
const deployBase = isProd
  ? (DEPLOY_ENV === "test" ? "/x8/test/legacy/" : "/x8/v2/legacy/")
  : "/";

export default defineConfig({
  plugins: [legacySkipModernCssPlugin(), legacyIndexRewritePlugin(), react(), jsxLocPlugin()],
  define: {
    "import.meta.env.VITE_X8_LEGACY": JSON.stringify("1"),
  },
  base: deployBase,
  resolve: {
    alias: {
      "@": path.resolve(PROJECT_ROOT, "client", "src"),
      "@shared": path.resolve(PROJECT_ROOT, "shared"),
      "@assets": path.resolve(PROJECT_ROOT, "attached_assets"),
    },
    dedupe: ["react", "react-dom"],
  },
  envDir: path.resolve(PROJECT_ROOT),
  root: path.resolve(PROJECT_ROOT, "client"),
  publicDir: path.resolve(PROJECT_ROOT, "client/public"),
  css: {
    transformer: "postcss",
    postcss: {
      plugins: [
        tailwindcss3({ config: path.join(PROJECT_ROOT, "tailwind.legacy.config.cjs") }),
        autoprefixer(),
      ],
    },
  },
  build: {
    target: ["chrome91", "edge91"],
    cssTarget: "chrome91",
    outDir: path.resolve(PROJECT_ROOT, "dist/legacy"),
    emptyOutDir: true,
    minify: "terser",
    rollupOptions: {
      input: {
        i: path.resolve(PROJECT_ROOT, "client", "i.legacy.html"),
      },
      output: {
        manualChunks(id) {
          if (!id.includes("node_modules")) return;
          // Match modern build: echarts is lazy-loaded on EQ/Effects pages.
          if (
            id.includes("/echarts/") ||
            id.includes("/zrender/") ||
            id.includes("\\echarts\\") ||
            id.includes("\\zrender\\")
          ) {
            return "echarts-vendor";
          }
        },
      },
    },
    // streamdown pulls @shikijs/langs + mermaid; both lazy-loaded with AIPage.
    chunkSizeWarningLimit: 15000,
  },
  server: {
    port: 5173,
    strictPort: false,
    host: true,
    proxy: {
      "/luxsin-audio-api": {
        target: "https://api.luxsin.com.cn",
        changeOrigin: true,
        rewrite: (p) => p.replace(/^\/luxsin-audio-api/, "/audio"),
      },
    },
  },
});