- Copiar iconos desde /pwa_assets/icons/ a /public/
- Agregar iconos de 72x72, 96x96, 128x128, 144x144, 152x152, 256x256, 384x384
- Actualizar manifest con todos los tamaños de iconos
- Mejorar compatibilidad con diferentes dispositivos y resoluciones
- Mantener iconos maskable existentes para adaptive icons
- Agregar share_target al manifest de la PWA
- Crear endpoint /api/share-target para recibir archivos compartidos
- Guardar archivos temporalmente en /public/temp-shared
- Modificar UserProfileForm para aceptar imágenes externas
- Detectar automáticamente imágenes compartidas y procesarlas
- Crear endpoint /api/share-target/cleanup para limpiar temporales
- Mostrar toast informativo al recibir imagen compartida
- Redirigir automáticamente al formulario de perfil
- Soportar compartir desde galería, otras apps, etc.
- Quitar botones de selección de estado de presencia
- Agregar chip compacto y discreto al lado del email
- El chip solo muestra el estado actual (no permite cambiarlo)
- El estado se manejará dinámicamente desde el backend
- Por defecto el estado es 'disponible' (online)
- Actualizar estilos para modo claro y oscuro
- Agregar zona de drag & drop con feedback visual
- Agregar botón para subir foto desde dispositivo
- Implementar validación de tipo de archivo (solo imágenes)
- Implementar validación de tamaño (máximo 5MB)
- Agregar estilos responsive y soporte para modo oscuro
- Banner visible en header del formulario
- Explica que cambios son locales hasta guardar
- Diseño con borde izquierdo y fondo suave
- Soporte dark mode
- Mejora UX explicando comportamiento de persistencia
- Agregar efecto glassmorphism con blur y transparencia
- Mejorar bordes redondeados y sombras
- Usar colores más suaves y profesionales
- Agregar text-shadow para mejor legibilidad
- Actualizar estilos de dark mode con glassmorphism
- Mantener consistencia visual con el resto de la app
- Reemplazar prompt del navegador por modal personalizado
- Modal muestra lista de campos modificados con estilo de la app
- Distingue entre almacenamiento local y servidor
- Incluye soporte para modo oscuro
- Mejora UX con diseño responsive
- Nuevo botón "Reiniciar" en el footer junto a Cancelar y Guardar
- Solo aparece cuando hay cambios pendientes (v-if="hasChanges")
- Color warning con variant soft para indicar acción destructiva
- Ícono de arrow-path (flecha circular)
- Función resetForm() que:
- Pide confirmación al usuario
- Restaura todos los campos a valores originales
- Limpia la cookie de borrador
- Muestra toast informativo
- Ubicado entre botones Cancelar y Guardar cambios
El botón permite descartar todos los cambios y volver al estado
original sin tener que recargar la página.
- Hacer el mensaje más claro y explicativo
- Enfatizar que los cambios NO se han enviado al servidor
- Indicar que quedarán guardados localmente en el navegador
- Agregar instrucción de cómo guardar definitivamente
- Iniciar con pregunta "¿Estás seguro de salir?"
Mensaje anterior era ambiguo, ahora es más específico sobre:
- Qué se guarda (localmente)
- Qué NO se guarda (en el servidor)
- Qué hacer para guardar definitivamente
- Agregar cookie para persistir cambios del formulario (7 días)
- Detectar y mostrar campos modificados con indicadores visuales
- Alertar al usuario antes de salir si hay cambios sin guardar
- Restaurar borrador automáticamente al reabrir formulario
- Notificar al usuario de cambios restaurados con toast
- Limpiar cookie al guardar exitosamente
Indicadores visuales:
- Label en color warning para campos modificados
- Badge "Modificado" con ícono de lápiz
- Mensaje en beforeunload listando campos pendientes
La cookie guarda todos los campos del formulario y se restauran
automáticamente al abrir el formulario de nuevo.
- Mover sección de foto de perfil al primer lugar del formulario
- Eliminar preview del avatar (MsnAvatar) - no repetir
- Simplificar botones: más compactos (size="sm", iconos w-4 h-4)
- Eliminar card/container extra (.avatar-section) con background y padding
- Nueva clase simple .avatar-actions-simple con solo flex y gap
- Limpiar estilos CSS no utilizados (avatar-section, avatar-preview, avatar-actions)
- Restaurar capture_links en PWA manifest (requerido para funcionamiento correcto)
- Agregar sección en README explicando error TS2353 intencional
- Documentar que capture_links es experimental pero funcional y necesario
- Incluir referencias a documentación oficial de la especificación
La propiedad capture_links es necesaria para capturar navegaciones
dentro del scope de la PWA en el ecosistema Nucleo V3.
- Actualizar UModal para usar v-model:open en lugar de v-model
- Envolver contenido de UModal en slot #content según nueva sintaxis
- Corregir tipos en CameraCapture: agregar verificación de objeto antes de spread
- Cambiar tipo de retorno de getAppIconUrl de null a undefined
- Comentar capture_links en manifest PWA (propiedad experimental no soportada en tipos)
- Resolver todos los errores de TypeScript y warnings de hidratación
Errores corregidos:
- TS2353: width no existe en tipo ui de UModal
- TS2698: Spread types solo de tipos objeto
- TS18048: camera posiblemente undefined
- TS2322: null no asignable a undefined
- TS2353: capture_links no existe en ManifestOptions
- Agregar CameraCapture.vue con soporte multi-dispositivo
* Soporte para múltiples cámaras (frontal/trasera)
* Manejo robusto de permisos y errores
* Preview y confirmación de foto
* Detección automática de capacidades del dispositivo
- Crear endpoint /api/avatar/upload para subir avatares
* Validación de tipo y tamaño de archivo
* Almacenamiento en /public/avatars/
* Actualización de atributos en Authentik
* Limpieza automática de avatares antiguos
- Actualizar UserProfileForm con gestión de avatar
* Integración con CameraCapture en modal
* Preview del avatar actual con MsnAvatar
* Opciones para cambiar y eliminar avatar
- Actualizar useAuthentik para avatares personalizados
* Carga de atributos completos del usuario
* Soporte para avatar_url desde Authentik
* Fallback a UI Avatars si no hay custom avatar
- Eliminar SVG complejo y usar CSS radial-gradient
- Implementar degradado radial que simula iluminación real
- Agregar efectos glossy con pseudo-elementos ::before y ::after
- Usar box-shadow para profundidad 3D
- Simplificar implementación para mejor rendimiento
- Agregar componente MsnAvatar con marco SVG de grosor variable
- Implementar degradados radiales estilo Frutiger Aero
- Agregar composable usePresence con detección de inactividad
- Incluir selector de estados: Online, Away, Busy, Offline
- Actualizar UserHeader para usar el nuevo avatar
- Crear ícono con diseño de usuarios/amigos
- Agregar variaciones de nombre: amigos.svg, amigos-app.svg, amigosapp.svg
- Esto cubre diferentes posibles slugs de la aplicación
- Agregar handler @click en app-items
- En desktop, prevenir default y usar window.open() directamente
- Esto bypasea completamente el sistema capture_links del manifest
- Mantener enlaces nativos como fallback para móvil
- Cambiar capture_links de 'existing-client-navigate' a 'none'
- Remover scope_extensions que forzaban navegación en misma ventana
- Ahora el navegador respetará target='_blank' en desktop
- Los enlaces externos abrirán en nueva ventana/PWA
- Cambiar detección de desktop de min-width a (pointer: fine)
- Esto detecta si tiene mouse/trackpad (desktop) vs touch (móvil)
- Más confiable para PWAs que se abren con ancho fijo
- Mantener ancho como fallback para compatibilidad
- Agregar logs en useDeviceType para ver detección de desktop
- Agregar logs en shouldOpenInNewTab para ver resultado
- Esto ayudará a diagnosticar por qué no se abren nuevas ventanas
- Mover verificaci\u00f3n de target='_blank' antes del parseo de URL
- Esto garantiza que links con target='_blank' nunca sean interceptados
- Permite que desktop abra PWAs en nuevas ventanas correctamente
- Crear composable useDeviceType para detectar desktop/móvil
- Modificar ApplicationsList para usar target='_blank' en desktop
- Ajustar pwa-link-handler para permitir nuevas ventanas en desktop
- En móvil mantener comportamiento original según openInNewTab
- Agregar id único (/?app=inicio) para identificar PWA
- Implementar launch_handler con navigate-existing para mantener una sola ventana
- Mejoras basadas en especificaciones actualizadas de Chrome for Developers
- Agregar scope_extensions en manifest para capturar navegaciones a otros subdominios
- Configurar Traefik para servir archivos .well-known sin autenticación
- Documentar configuración completa del sistema
- Filtrar app "perfil" de la lista (hardcoded por slug y nombre)
- Búsqueda en tiempo real con v-model (sin debounce)
- Orientación "any" para respetar dispositivo móvil
- Contador de apps con glassmorphism personalizado
- Estilos matching chips y badges de la app
- Soporte completo modo día/noche para contador
- Agregar capture_links al manifest para captura automática
- Configurar clientsClaim y skipWaiting en workbox
- Plugin de cliente para interceptar clics en enlaces
- Interceptar window.open() para enlaces internos
- Solo activo cuando la app corre como PWA instalada
- Usar router de Nuxt para navegación interna fluida
- Detectar display-mode standalone y window-controls-overlay
- Track transparente con glassmorphism
- Thumb con gradiente de color del cielo
- Día: Celeste (#87CEEB) con brillo
- Noche: Azul oscuro con tinte morado
- Bordes y sombras para efecto de profundidad
- Hover con mayor intensidad de color
- Soporte completo para WebKit y Firefox
- Campo de búsqueda con glassmorphism
- Filtrar por nombre, URL y descripción
- Icono de lupa y botón para limpiar búsqueda
- Persistencia en cookie (1 semana)
- Estilos completos para modo día y noche
- Eliminar border-bottom blanco de barra de título
- Agregar box-shadow: none a barra de título
- Forzar margin y padding 0 en html y body
- Eliminar borders y outlines que puedan crear gap
- Aplicar reglas a contenedor raíz de Nuxt (#__nuxt)
- Forzar margin-top: 0 en la barra misma
- Agregar reglas para [data-v-app] de Nuxt UI
- Reemplazar UBadge con spans personalizados
- Aplicar mismo estilo que filtros de grupos
- Badges primarios con color primary y glassmorphism
- Badge de conteo (+N) con estilo neutral
- Hover con efecto de elevación sutil
- Soporte completo para modo oscuro con brillo ajustado
- Aumentar opacidad del patrón en modo light (0.03 → 0.08)
- Agregar margin: 0 a la barra de título
- Forzar margin y padding: 0 en body y html
- Eliminar línea blanca entre body y barra de título
- Reemplazar UButton por botones nativos con estilos personalizados
- Aplicar glassmorphism consistente con el resto de la app
- Estados normal y activo con efectos de sombra y color
- Hover con translateY para efecto de elevación
- Soporte completo para modo oscuro con opacidades ajustadas
- Botones activos con color primario y borde resaltado
- Barra completamente transparente con patrón sutil de cuadrícula
- Título en chip cuadrado con bordes mínimamente redondeados
- Glassmorphism en el chip para contraste y legibilidad
- Patrón discreto (3% opacidad día, 2% noche)
- Configurar pointer-events para bloquear interacción debajo
- Traducir mensajes de API a español
- Configurar idioma español en HTML y manifest (lang="es")
- Actualizar nombres de app: "Perfil Nucleo"
- Crear WindowTitleBar para Window Controls Overlay
- Ajustar padding para acomodar barra de título
- Traducir campos restantes en componentes legacy
- Crear componente UserProfileForm con diseño glassmorphism
- Alternar entre lista de apps y formulario de edición
- Quitar modal de UserHeader, usar emit event
- Agregar nuevos campos deshabilitados:
* Avatar URL
* Teléfono
* Cédula
* Fecha de nacimiento
* NFC vinculada
* PIN numérico
* Código Nucleo V2
- Sistema de eventos entre componentes
- Mover botón editar al lado del nombre (siempre visible, sutil)
- Quitar efecto hover del header
- Detectar tema del sistema operativo automáticamente
- Actualizar theme-color dinámicamente (azul cielo día / oscuro noche)
- Usar cookies para persistir tema y filtros (1 año)
- Sincronizar filtros de apps con cookies
- Intentar meta_icon de Authentik primero
- Buscar apple-touch-icon.png del dominio (PWA)
- Intentar favicon.ico como fallback
- Mostrar icono por defecto si todo falla
- Sistema de retry inteligente para evitar requests duplicados
- Agregar función applyThemeClass para sincronizar con HTML
- Aplicar clase dark/light al elemento HTML
- Agregar watcher para actualizar clase en cambios de tema
- Inicializar clase correcta en onMounted
- Separar estilos dark mode en bloque sin scoped
- Usar selectores .dark directos en lugar de :global(.dark)
- Agregar !important para superar especificidad de scoped
- Agregar función applyThemeClass para sincronizar con HTML
- Aplicar clase dark/light al elemento HTML
- Agregar watcher para actualizar clase en cambios de tema
- Inicializar clase correcta en onMounted
- Agregar scrollbar personalizada compacta (8px) adaptable al tema
- Estilo de scrollbar verde (#00DC82) con opacidad diferente para día/noche
- Soporte para WebKit (Chrome/Safari) y Firefox
- Arreglar SVG de colinas para usar 100% del ancho horizontal (preserveAspectRatio=none)
- Revertir modal a estructura funcional (v-model:open, title prop, #content slot)
- Igualar transparencia en modo oscuro usando rgba(0,0,0,0.3-0.4) en lugar de rgba(15,15,25)
- Aplicar tintado negro puro para reducir brillo en modo oscuro manteniendo misma transparencia
- Cambiar botones de quick-actions a variant solid con efectos 3D
- Agregar box-shadow multicapa con inset shadows a botones
- Implementar efectos hover y active en botones de sesión
- Cambiar badges de grupos a variant solid
- Agregar efectos 3D a badges con sombras y hover
- Mejorar color del email en modo oscuro (negro en lugar de gris)
- Aumentar peso de fuente del email en modo oscuro para mejor legibilidad
