/**
 * @file vite.config.web.mts
 * @description Vite configuration for web platform builds
 * 
 * This configuration file defines how the application is built for web platforms.
 * It extends the base configuration with web-specific settings and optimizations.
 * 
 * Build Process Integration:
 * 1. Configuration Loading:
 *    - Loads environment variables based on build mode
 *    - Merges base configuration from vite.config.common.mts
 *    - Loads application-specific configuration
 * 
 * 2. Platform Definition:
 *    - Sets VITE_PLATFORM environment variable to 'web'
 *    - Used by PlatformServiceFactory to load web-specific implementations
 * 
 * 3. Build Output:
 *    - Outputs to 'dist/web' directory
 *    - Creates vendor chunk for Vue-related dependencies
 *    - Enables PWA features with auto-update capability
 * 
 * 4. Development vs Production:
 *    - Development: Enables source maps and development features
 *    - Production: Optimizes chunks and enables PWA features
 * 
 * Usage:
 * - Development: npm run dev
 * - Production: npm run build:web
 * 
 * @see vite.config.common.mts
 * @see vite.config.utils.mts
 * @see PlatformServiceFactory.ts
 */

import { defineConfig, mergeConfig, loadEnv } from "vite";
import { VitePWA } from "vite-plugin-pwa";
import { createBuildConfig } from "./vite.config.common.mts";
import { loadAppConfig } from "./vite.config.utils.mts";

export default defineConfig(async ({ mode }) => {
  // Load environment variables based on build mode
  const env = loadEnv(mode, process.cwd(), '');
  
  // Load base configuration for web platform
  const baseConfig = await createBuildConfig('web');
  
  // Load application-specific configuration
  const appConfig = await loadAppConfig();

  // Merge configurations with web-specific settings
  return mergeConfig(baseConfig, {
    // Define platform-specific environment variables
    define: {
      'import.meta.env.VITE_PLATFORM': JSON.stringify('web'),
    },
    
    // Build output configuration
    build: {
      // Output directory for web builds
      outDir: 'dist/web',
      
      // Rollup-specific options
      rollupOptions: {
        output: {
          // Create separate vendor chunk for Vue-related dependencies
          manualChunks: {
            vendor: ['vue', 'vue-router', 'pinia'],
          }
        }
      }
    },
    
    // Vite plugins configuration
    plugins: [
      // Progressive Web App configuration
      VitePWA({
        // Auto-update service worker
        registerType: 'autoUpdate',
        
        // PWA manifest configuration
        manifest: appConfig.pwaConfig?.manifest,
        
        // Development options
        devOptions: {
          enabled: false
        },
        
        // Workbox configuration for service worker
        workbox: {
          cleanupOutdatedCaches: true,
          skipWaiting: true,
          clientsClaim: true,
          sourcemap: true
        }
      })
    ]
  });
});