import { resolve } from "node:path";
import react from "@vitejs/plugin-react";
import tailwindcss from "@tailwindcss/vite";
import { defineConfig, type Plugin } from "vite";

const appRoutes = new Set([
  "",
  "devices",
  "accelerators",
  "systems",
  "models",
  "compare",
  "bounds",
]);

function appHtmlFallback(): Plugin {
  return {
    name: "local-frontier-app-html-fallback",
    configureServer(server) {
      server.middlewares.use((request, _response, next) => {
        if (request.method !== "GET" && request.method !== "HEAD") {
          next();
          return;
        }

        const url = new URL(request.url ?? "/", "http://local-frontier.dev");
        const route =
          decodeURIComponent(url.pathname).replace(/^\/+/, "").split("/")[0] ??
          "";
        if (appRoutes.has(route)) {
          request.url = `/app.html${url.search}`;
        }
        next();
      });
    },
  };
}

export default defineConfig({
  plugins: [appHtmlFallback(), react(), tailwindcss()],
  resolve: {
    alias: {
      "@": resolve(import.meta.dirname, "src"),
    },
  },
  build: {
    rollupOptions: {
      input: resolve(import.meta.dirname, "app.html"),
    },
  },
});