import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import path from 'path';

/**
 * Velocity-OS — Vite Configuration
 * Dev server proxies /api and /ws to core-api on port 8443.
 * Production build output: dist/ (served by Nginx in Docker).
 */
export default defineConfig({
  plugins: [react()],

  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src'),
      '@/components/ui': path.resolve(__dirname, './src/shared/ui'),
      '@/hooks': path.resolve(__dirname, './src/shared/hooks'),
      '@/lib': path.resolve(__dirname, './src/shared/lib'),
      '@/store': path.resolve(__dirname, './src/store'),
      '@/types': path.resolve(__dirname, './src/shared/types'),
      '@/utils': path.resolve(__dirname, './src/shared/utils'),
    },
  },

  server: {
    port: 3000,
    host: true,
    proxy: {
      // REST API → core-api
      '/api': {
        target: 'http://localhost:8443',
        changeOrigin: true,
        secure: false,
      },
      // WebSocket → core-api
      '/ws': {
        target: 'ws://localhost:8443',
        ws: true,
        changeOrigin: true,
      },
      // Dream Weaver gateway
      '/dream-weaver': {
        target: 'http://localhost:8290',
        changeOrigin: true,
      },
    },
  },

  build: {
    outDir: 'dist',
    sourcemap: false,      // no source maps in production build
    minify: 'esbuild',
    modulePreload: {
      resolveDependencies(_url, deps) {
        // Three.js is only needed after entering Studio/property 3D routes.
        // Do not preload the heavy R3F chunk on the Command/Pipeline landing path.
        return deps.filter((dep) => !dep.includes('vendor-three'));
      },
    },
    rollupOptions: {
      output: {
        // Content-hash filenames for immutable caching
        entryFileNames:  'assets/[name].[hash].js',
        chunkFileNames:  'assets/[name].[hash].js',
        assetFileNames:  'assets/[name].[hash].[ext]',
        // Manual chunks to keep vendor bundle separate
        manualChunks: {
          'vendor-react':     ['react', 'react-dom', 'react-router-dom'],
          'vendor-motion':    ['framer-motion'],
          'vendor-three':     ['three', '@react-three/fiber', '@react-three/drei'],
          'vendor-query':     ['@tanstack/react-query'],
          'vendor-zustand':   ['zustand'],
        },
      },
    },
  },

  optimizeDeps: {
    include: ['react', 'react-dom', 'framer-motion', 'zustand', '@tanstack/react-query'],
  },
});