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


export default defineConfig(({ mode }) => {
	const env = loadEnv(mode, process.cwd(), ""); // loads .env.free, .env.pro, etc.

	// Use a dedicated env var so it's explicit.
	const isDev = mode === "development";

	return {
		root: __dirname, // tell Vite the root of the project
		plugins: [react()],
		define: {
			__PRO__: JSON.stringify(process.env.__PRO__ === "1"), // IMPORTANT: stringify so it becomes a literal in the bundle
		},
		css: {
			// SCSS works out of the box. If you have globals, configure here.
			preprocessorOptions: {
				scss: {
					//additionalData: '', // e.g. @use "src/styles/variables" as *; use if you need global variables/mixins, otherwise omit
				},
			},
		},
		optimizeDeps: {
			entries: ["src/main.tsx"], // force Vite to track this in dev
		},
		server: {
			proxy: {
				// Forward all /wp-json calls to your local WP instance
				"/wp-json": {
					target: "http://hopadigital.local", // your local WP URL
					changeOrigin: true,
					secure: false
				}
			},
			watch: {
				usePolling: true,
				interval: 100, // check every 100ms
			},
			fs: {
				allow: [__dirname], // explicitly allow watching this directory
			},
			cors: true,  // allow all origins
			headers: {
				'Access-Control-Allow-Origin': '*',
			},
			host: true,
			port: 5173,
			strictPort: true,
			allowedHosts: ['hopadigital.local'],
		},
		base: isDev ? '/' : '/wp-content/plugins/zozo-chat/assets/',
		build: {
			outDir: resolve(__dirname, "../assets"),
			emptyOutDir: true,
			manifest: true,
			assetsDir: "",
			rollupOptions: {
				input: {
					"chat-widget": resolve(__dirname, "src/main.tsx"),
					"admin-widget": resolve(__dirname, "src/main-admin.tsx"),
				},
				output: {
					entryFileNames: "[name].js",
					chunkFileNames: "chunks/[name]-[hash].js",
					assetFileNames: "assets/[name]-[hash][extname]",
				},
			}
		}
	};
});