import {defineConfig, loadEnv} from 'vite'
import react from '@vitejs/plugin-react'

// The dev server proxies the API routes so the browser sees a single origin and
// no CORS configuration is needed during development. /graphql, /media and
// /healthz are listed alongside /api because the service mounts them at the root
// rather than under /api.
export default defineConfig(({mode}) => {
  // loadEnv is needed here rather than import.meta.env, because vite.config.ts is
  // evaluated before the .env files are exposed to client code. '.' is the env
  // dir, which defaults to the project root.
  const env = loadEnv(mode, '.', 'VITE_')
  const target = env.VITE_PROXY_TARGET || 'http://localhost:8080'

  const proxy = {
    target,
    changeOrigin: true,
    secure: false,
  }

  return {
    plugins: [react()],
    base: './',
    server: {
      proxy: {
        '/api': proxy,
        // GET /graphql only serves the static query console; it cannot execute a
        // query, so proxying it is safe.
        '/graphql': proxy,
        '/media': proxy,
        '/healthz': proxy,
      },
    },
  }
})