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

// https://vite.dev/config/
export default defineConfig(({ mode }) => {
  // Environment-specific configuration
  const envConfig = {
    localhost: {
      port: 5174,
      strictPort: false,
    },
    dev: {
      port: 9501,
      strictPort: false,
    },
    test: {
      port: 9502,
      strictPort: false,
    },
    uat: {
      port: 5176,
      strictPort: false,
    },
  }

  const serverConfig = envConfig[mode as keyof typeof envConfig] || envConfig.localhost

  const env = loadEnv(mode, process.cwd(), '')
  console.log(`\n======================================`)
  console.log(`🚀 Starting frontend in [${mode}] mode`)
  console.log(`🔗 Backend API URL: ${env.VITE_API_URL || 'NOT SET'}`)
  console.log(`======================================\n`)

  return {
    plugins: [
      react(),
      tailwindcss()
    ],
    server: serverConfig,
    define: {
      __APP_ENV__: JSON.stringify(mode),
    },
  }
})