- Convertir imágenes hardcodeadas a variables (REG, REPO_OWNER)
- Agregar variables APP_NAME y APP_DOMAIN al workflow
- Agregar flag --wait al despliegue para esperar contenedores listos
- Pasar variables de entorno (RADIUS_*) explícitamente en cada paso
- Agregar paso informativo sobre el deployment
- Simplificar comandos docker compose (sin -f innecesario)
- Corregir indentación del docker-compose.yml
- Eliminar paso redundante "Show service status"
Estos cambios hacen que el workflow sea más robusto y consistente
con el patrón usado en analiticaNucleo.
- Quitar transform translateY de UserCard hover (card-inner y botones)
- Quitar transform translateY de .icon-btn hover en styles.css
- Quitar transform translateY de .card hover en styles.css
- Quitar transform translateY de GroupCheckButton hover
- Reemplazar efectos de movimiento por cambios sutiles de opacidad
- Actualizar transiciones para remover propiedades transform innecesarias
- Cambiar a diseño limpio tipo ficha con información organizada en filas label-value
- Reducir avatar a inicial pequeña (36x36px) con fondo sutil
- Implementar sistema de sombras suaves de múltiples capas para profundidad
- Simplificar paleta de colores con acentos sutiles
- Mejorar tipografía con mejor jerarquía (18px título, 13px info)
- Cambiar botones a diseño minimalista con borde sutil
- Agregar transiciones suaves con cubic-bezier para movimiento natural
- Implementar hover con elevación de 4px y sombras progresivas
- Organizar información en formato tabla limpia (vlan, estado, conexión, etiquetas)
- Reducir efectos visuales excesivos por diseño más elegante y profesional
- Agregar avatar circular con inicial del usuario y estados visuales (normal, conectado, deshabilitado)
- Implementar iconos SVG en todos los botones de acción (editar, desconectar, habilitar/deshabilitar, eliminar, expandir)
- Mejorar jerarquía de información con chips de colores específicos (VLAN azul, activo verde, deshabilitado rojo, conectado rosa)
- Agregar animación pulse en avatar cuando el usuario está conectado
- Implementar efectos hover con elevación y sombras rosas
- Organizar etiquetas y dispositivos en secciones separadas con bordes
- Resolver conflictos de merge en styles.css (mantener estilos de scrollbar y gradientes de topbar/panel)
- Agregar responsive design para móviles
- Mejorar transiciones y efectos glassmorphism en toda la card
- Copia hook de plantillaNuxtAuthentikProxy
- Configura para repositorio radiusNucleo
- Espera hasta 10 minutos a que termine la action
- Muestra estado final con detalles y URL de logs
Problema: El callback /outpost.goauthentik.io/callback estaba en el router
público sin middleware de Authentik, causando que llegara directamente
a Node.js → 404 Error
Solución: Quitar /outpost.goauthentik.io del router público para que
el callback pase por el router principal con el middleware
authentik-forward-auth@file, que maneja correctamente el flujo OAuth
PROBLEMA:
- Frontend hacía fetch a APIs protegidas por Authentik
- Cuando sesión expiraba, Authentik redirigía causando error de CORS
- TypeError: Failed to fetch
SOLUCIÓN:
1. Backend inyecta window.__AUTHENTIK_USER__ en HTML inicial (app.js)
- Servidor lee headers de Authentik y los pasa al frontend
- Evita fetch innecesario en carga inicial
2. Frontend usa window.__AUTHENTIK_USER__ como fuente principal (useAuthentik.js)
- Solo hace fetch cuando se fuerza refresh
- Detecta errores de CORS como señal de sesión expirada
- Muestra mensaje claro al usuario
3. App.vue detecta errores de autenticación en APIs
- Cuando fetch falla con CORS, recarga página automáticamente
- Authentik manejará la re-autenticación
SEGURIDAD:
- Todos los endpoints /api/* siguen protegidos por Authentik
- No se exponen APIs sin autenticación
- Headers de Authentik solo presentes con sesión válida
- Backend: Nuevos endpoints /api/auth/status y /api/auth/check-group
- Frontend: Composable useAuthentik para gestión de autenticación
- Frontend: Componentes UserDropdown, UserAvatar, SessionStatusButton, GroupCheckButton
- Frontend: Integración en topbar con dropdown de usuario
- Config: URLs de Authentik y configuración de avatares
- Lectura de headers x-authentik-* inyectados por Traefik
- Verificación de grupos RBAC (frontend y backend)
- Validación de sesión contra Authentik
Problema:
- Los assets (CSS/JS) estaban siendo bloqueados por Authentik
- El servidor devolvía HTML (página de login) en lugar de CSS
- Error: MIME type 'text/html' is not a supported stylesheet
Solución:
- Crear dos routers en Traefik:
1. Router público (prioridad 100): /assets, /icons, manifest, favicon SIN autenticación
2. Router principal (prioridad 10): Todo lo demás CON autenticación
- Los assets estáticos ahora se sirven directamente sin pasar por Authentik
- Mantiene la seguridad para el resto de la aplicación
Rutas públicas: /assets/*, /.well-known/*, /icons/*, /manifest.webmanifest, /favicon.ico
Cambios:
- Crear componente Toast.vue con soporte para posiciones (top/bottom, left/center/right)
- Crear composable useToast.js para manejar notificaciones
- Integrar sistema de toast en App.vue
- Implementar detección de PWA:
* Detecta si el usuario está en modo standalone (PWA instalada)
* Si puede instalar, muestra toast con botón de instalación
* Si ya está instalada pero no se usa, sugiere abrir en app
- Toast persistente hasta que el usuario interactúe
- Soporte para tema claro/oscuro
- Animaciones suaves y diseño moderno
- Responsive para móviles
El sistema permite mostrar toasts de tipo: success, error, warning, info, pwa
con opciones de posición, duración, acciones personalizadas y modo persistente.
Cambios en App.vue:
- Agregar botón Inicio con emoji 🏠 en el topbar
- Botón apunta a https://inicio.nucleoriofrio.com
- Posicionado al inicio de la sección de acciones
- Usa clase .icon-btn para consistencia visual
El botón usa scope extensions para navegar dentro de la PWA.
- Agregar labels de Traefik al servicio radiusnucleo-node para exposición en wifi.nucleoriofrio.com
- Configurar autenticación con Authentik y soporte para SSE/WebSocket
- Renombrar servicio node a radiusnucleo-node con container_name explícito
- Actualizar redes a radiusnucleo_radius_net como externa
- Consolidar workflow de Gitea en un solo job build-and-deploy
- Agregar creación automática de red radiusnucleo_radius_net en workflow
