import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { VitePWA } from 'vite-plugin-pwa'
import vueDevTools from 'vite-plugin-vue-devtools'
import tailwindcss from '@tailwindcss/vite'
import path from 'path'

// https://vite.dev/config/
export default defineConfig(({ mode }) => {
  const isDev = mode === 'development'

  return {
    plugins: [
      vue(),
      tailwindcss(),
      // VueDevTools SOLO en desarrollo
      isDev ? vueDevTools() : false,
      VitePWA({
        registerType: 'autoUpdate',
        includeAssets: ['icon-192.png', 'icon-512.png', 'icon-1024.png', 'favicon.ico'],
        manifest: {
          name: 'SIBU - Sistema de Transporte',
          short_name: 'SIBU',
          description: 'Sistema de Transporte Público',
          theme_color: '#fee715',
          background_color: '#ffffff',
          display: 'standalone',
          orientation: 'portrait',
          scope: '/',
          start_url: '/',
          icons: [
            {
              src: 'icon-192.png',
              sizes: '192x192',
              type: 'image/png',
            },
            {
              src: 'icon-512.png',
              sizes: '512x512',
              type: 'image/png',
            },
            {
              src: 'icon-1024.png',
              sizes: '1024x1024',
              type: 'image/png',
            },
          ],
        },
        workbox: {
          globPatterns: ['**/*.{js,css,html,ico,png,svg,woff2}'],
          runtimeCaching: [
            {
              urlPattern: /^https:\/\/fonts\.googleapis\.com\/.*/i,
              handler: 'CacheFirst',
              options: {
                cacheName: 'google-fonts-cache',
                expiration: {
                  maxEntries: 10,
                  maxAgeSeconds: 60 * 60 * 24 * 365, // 1 year
                },
                cacheableResponse: {
                  statuses: [0, 200],
                },
              },
            },
            {
              urlPattern: /^https:\/\/fonts\.gstatic\.com\/.*/i,
              handler: 'CacheFirst',
              options: {
                cacheName: 'gstatic-fonts-cache',
                expiration: {
                  maxEntries: 10,
                  maxAgeSeconds: 60 * 60 * 24 * 365, // 1 year
                },
                cacheableResponse: {
                  statuses: [0, 200],
                },
              },
            },
          ],
        },
        devOptions: {
          enabled: false,
          type: 'module',
        },
      }),
    ],
    resolve: {
      alias: {
        '@': path.resolve(__dirname, './src'),
      },
    },
    build: {
      // Ajustar límite de advertencia (MapView + Google Maps son grandes por naturaleza)
      chunkSizeWarningLimit: 700,
      rollupOptions: {
        output: {
          // Dividir código en chunks lógicos para cargas más rápidas en producción
          manualChunks: (id) => {
            // Vendor: Firebase (bundle más pesado del stack)
            if (id.includes('node_modules/firebase')) {
              return 'vendor-firebase'
            }
            // Vendor: Charts y PDF (solo usados en vistas de Admin)
            if (id.includes('node_modules/chart.js') || id.includes('node_modules/vue-chartjs')) {
              return 'vendor-charts'
            }
            if (id.includes('node_modules/jspdf') || id.includes('node_modules/html2canvas')) {
              return 'vendor-pdf'
            }
            // Vendor: Ecosistema Vue (vue, pinia, router, i18n)
            if (
              id.includes('node_modules/vue') ||
              id.includes('node_modules/pinia') ||
              id.includes('node_modules/vue-router') ||
              id.includes('node_modules/vue-i18n')
            ) {
              return 'vendor-vue'
            }
            // Vendor: Google Maps loader
            if (id.includes('node_modules/@googlemaps')) {
              return 'vendor-maps'
            }
          },
        },
      },
    },
  }
})