Improve PWA offline functionality and fix session caching

- Enable navigateFallback for offline navigation support
- Add JSON files to glob patterns for heroicons support
- Change Authentik API caching from NetworkFirst to NetworkOnly to prevent stale session data
- Add offline detection in checkSessionStatus with proper user feedback
- Add no-cache headers to /api/auth/status endpoint to prevent browser caching
- Show "Modo Offline" toast when user tries to check session while offline

nuxt4/app/composables/useAuthentik.ts

@@ -53,6 +53,18 @@ export const useAuthentik = () => {
   const checkSessionStatus = async () => {
     const toast = useToast()
 
+    // Verificar si está offline primero
+    if (!navigator.onLine) {
+      toast.add({
+        title: 'Modo Offline',
+        description: 'No se puede validar sesión sin conexión',
+        color: 'gray',
+        icon: 'i-heroicons-wifi',
+        timeout: 5000
+      })
+      return
+    }
+
     // Mostrar toast de "verificando..."
     toast.add({
       title: 'Verificando sesión...',
@@ -93,6 +105,18 @@ export const useAuthentik = () => {
         })
       }
     } catch (error) {
+      // Verificar si está offline ahora (pudo desconectarse durante la petición)
+      if (!navigator.onLine) {
+        toast.add({
+          title: 'Modo Offline',
+          description: 'No se puede validar sesión sin conexión',
+          color: 'gray',
+          icon: 'i-heroicons-wifi',
+          timeout: 5000
+        })
+        return
+      }
+
       // Si el error es por redirect de Authentik (CORS/fetch error), significa que no hay sesión
       // Authentik redirige a login cuando no hay sesión válida, causando error CORS en fetch
       const errorMessage = error?.message || error?.toString() || ''

nuxt4/nuxt.config.ts

@@ -72,22 +72,15 @@ export default defineNuxtConfig({
       ]
     },
     workbox: {
-      navigateFallback: undefined,
+      navigateFallback: '/',
-      globPatterns: ['**/*.{js,css,html,png,svg,ico}'],
+      globPatterns: ['**/*.{js,css,html,png,svg,ico,json}'],
       cleanupOutdatedCaches: true,
       runtimeCaching: [
         {
           urlPattern: /^https:\/\/authentik\.nucleoriofrio\.com\/.*/i,
-          handler: 'NetworkFirst',
+          handler: 'NetworkOnly',
           options: {
-            cacheName: 'authentik-api-cache',
+            networkTimeoutSeconds: 10
-            expiration: {
-              maxEntries: 10,
-              maxAgeSeconds: 60 * 60 * 24 // 24 hours
-            },
-            cacheableResponse: {
-              statuses: [0, 200]
-            }
           }
         }
       ]

nuxt4/server/api/auth/status.get.ts

@@ -3,6 +3,13 @@
  * Consulta los headers inyectados por Authentik Proxy Outpost
  */
 export default defineEventHandler((event) => {
+  // Establecer headers para prevenir caching
+  setResponseHeaders(event, {
+    'Cache-Control': 'no-store, no-cache, must-revalidate, proxy-revalidate',
+    'Pragma': 'no-cache',
+    'Expires': '0'
+  })
+
   // Leer headers de Authentik en tiempo real
   const headers = getHeaders(event)