import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import { fileURLToPath, URL } from "node:url";

const srcDir = fileURLToPath(new URL("./src", import.meta.url));
const apiTarget = process.env.API_URL || "http://127.0.0.1:3000";
const webPort = Number(process.env.VITE_PORT) || 5173;

export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: {
      "@": srcDir,
    },
  },
  server: {
    host: process.env.VITE_HOST || "127.0.0.1",
    port: webPort,
    strictPort: true,
    proxy: {
      "/api": {
        target: apiTarget,
        changeOrigin: true,
      },
    },
  },
  build: {
    outDir: "dist",
    sourcemap: false,
    chunkSizeWarningLimit: 1200,
    rollupOptions: {
      output: {
        manualChunks: {
          // Base vendor: se descarga en toda visita. `clsx` va aquí a propósito y
          // no por afinidad temática: lo usan `lib/format.ts` y también recharts,
          // así que sin fijarlo Rollup lo asigna al chunk `charts` y el chunk de
          // entrada acaba importando 111 KB gzip de recharts para obtener una
          // utilidad de 200 bytes. Eso lo pagaba incluso la landing.
          react: ["react", "react-dom", "react-router-dom", "clsx"],
          calendar: [
            "@fullcalendar/core",
            "@fullcalendar/react",
            "@fullcalendar/daygrid",
            "@fullcalendar/timegrid",
            "@fullcalendar/interaction",
          ],
          charts: ["recharts"],
          query: ["@tanstack/react-query"],
          icons: ["lucide-react"],
          // Solo las páginas públicas animan. Sin este chunk, Rollup mete
          // framer-motion en el bundle compartido y sus ~40 KB gzip se cobran en
          // cada carga del panel, que nunca lo usa.
          //
          // Se llama `framer` y no `motion` a propósito: `src/lib/motion.ts` genera
          // su propio chunk compartido entre landing y login, y dos `motion-*.js`
          // distintos en dist/ son una trampa al depurar.
          framer: ["framer-motion"],
        },
      },
    },
  },
});