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

// https://vite.dev/config/
export default defineConfig(() => {
  return {
    plugins: [
      vue(),
      tailwindcss(),
      VitePWA({
        selfDestroying: true,
        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}'],
          // ⚡ EVITA LAS PANTALLAS BLANCAS: No cachees el backend u orígenes API
          navigateFallbackDenylist: [/^\/api/, /^\/rest\/v1/],
          runtimeCaching: [
            {
              // ASSETS EXTERNOS E IMÁGENES SUPERBASE
              urlPattern: /^https:\/\/(.*\.(png|jpg|jpeg|svg|webp|woff2|css))/,
              handler: 'CacheFirst',
              options: {
                cacheName: 'assets-estaticos-sibu',
                expiration: { maxEntries: 100, maxAgeSeconds: 60 * 60 * 24 * 30 }, // 30 días
                cacheableResponse: { statuses: [0, 200] },
              },
            },
            {
              // LLAMADAS API SEMI-ESTÁTICAS (Supabase listas que no mutan tan rápido)
              urlPattern: /^https:\/\/.*\.supabase\.co\/rest\/v1\/(routes|bus_stops)/,
              handler: 'StaleWhileRevalidate',
              options: {
                cacheName: 'api-estatica-sibu',
                cacheableResponse: { statuses: [0, 200] },
              },
            },
            {
              // LLAMADAS API REALTIME / DELUXE
              urlPattern: /^https:\/\/.*\.supabase\.co\/rest\/v1\/(shuttles|locations|users)/,
              handler: 'NetworkFirst',
              options: {
                cacheName: 'api-dinamica',
                networkTimeoutSeconds: 5, // Vital en zonas rurales: si el 3G no responde en 5s, muestra la caché
                cacheableResponse: { statuses: [0, 200] },
              },
            },
            {
              // FONT CACHE (Google)
              urlPattern: /^https:\/\/fonts\.(?:googleapis|gstatic)\.com\/.*/i,
              handler: 'CacheFirst',
              options: {
                cacheName: 'google-fonts',
                expiration: { maxEntries: 10, maxAgeSeconds: 60 * 60 * 24 * 365 },
                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: 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'
            }
          },
        },
      },
    },
  }
})