Patrones de Vite 8+ — CULTIVA Dashboard

// vite.config.ts — CULTIVA Dashboard
import { defineConfig, loadEnv } from 'vite'
import react from '@vitejs/plugin-react-swc'
import checker from 'vite-plugin-checker'
import tsconfigPaths from 'vite-tsconfig-paths'

export default defineConfig(({ command, mode }) => {
  // Solo vars VITE_ — sin secretos expuestos
  const env = loadEnv(mode, process.cwd(), ['VITE_'])

  return {
    plugins: [
      react(),             // SWC: HMR más rápido que Babel
      tsconfigPaths(),     // alias de tsconfig.json → sin duplicar
      checker({ typescript: true }), // type-check en build
    ],

    server: {
      host: true,           // 0.0.0.0 — accesible en Docker
      port: 3000,
      hmr: { clientPort: 3000 },
      warmup: {
        clientFiles: ['./src/main.tsx', './src/routes/**/*.tsx'],
      },
      proxy: {
        '/api': {
          target: env.VITE_API_URL || 'http://localhost:8080',
          changeOrigin: true,
          rewrite: (p) => p.replace(/^\/api/, ''),
        },
      },
      fs: { allow: ['..', '../../packages'] }, // monorepo
    },

    optimizeDeps: {
      include: ['lodash-es', 'date-fns'], // CJS → ESM
    },

    build: {
      sourcemap: false,     // no leak de fuente en producción
      rolldownOptions: {
        output: {
          manualChunks: {
            'react-vendor': ['react', 'react-dom'],
            'ui-vendor': ['@radix-ui/react-dialog'],
          },
        },
      },
    },
  }
})

build: {
  rolldownOptions: {
    output: {
      manualChunks: {
        // vendores React aislados
        'react-vendor': [
          'react',
          'react-dom',
          'react/jsx-runtime',
        ],
        // UI separado de lógica
        'ui-vendor': [
          '@radix-ui/react-dialog',
          '@radix-ui/react-popover',
          'lucide-react',
        ],
        // utils pesados
        'utils-vendor': [
          'lodash-es',
          'date-fns',
          'zod',
        ],
      },
    },
  },
}

// Acceso monorepo a packages/
server: {
  fs: {
    allow: [
      '.',       // project root
      '..',      // workspace root
      '../../packages',
    ],
  },
},

// SSR: arreglar paquetes ESM-only
ssr: {
  noExternal: [
    '@cultivaia/ui-kit', // ESM-only
    'some-esm-dep',
  ],
  external: [
    'node-native-pkg', // keep as require()
  ],
  target: 'node',
},

// Pre-bundle deps CJS problemáticos
optimizeDeps: {
  include: [
    'lodash-es',
    'date-fns',
    'cjs-package',
  ],
}

// src/stores/campaigns.ts
// Store de campañas con HMR preservado
let state = {
  campaigns: [] as Campaign[],
  activeFilter: 'all',
}

if (import.meta.hot) {
  // Recuperar estado previo al hot-reload
  const saved = import.meta.hot.data.state
  if (saved) state = saved

  // Guardar estado ANTES de reemplazar módulo
  import.meta.hot.dispose((data) => {
    data.state = state  // mutar, no reasignar
  })

  import.meta.hot.accept()
}

// Optimización: evitar barrel
// BAD:  import { useCampaigns } from '@/stores'
// GOOD: import { useCampaigns } from '@/stores/campaigns'