diff --git a/nuxt4/app/composables/useAuthentik.ts b/nuxt4/app/composables/useAuthentik.ts index 1160550..3e99bf2 100644 --- a/nuxt4/app/composables/useAuthentik.ts +++ b/nuxt4/app/composables/useAuthentik.ts @@ -2,11 +2,29 @@ * Composable para leer información de usuario de Authentik * Los headers son inyectados por Authentik Proxy Outpost */ + +interface AuthentikUser { + username: string + email: string | undefined + name: string | undefined + groups: string[] + uid: string | undefined + avatar: string +} + +interface AuthStatusResponse { + authenticated: boolean + user?: { + username: string + name?: string + } +} + export const useAuthentik = () => { // Leer headers en el servidor y almacenarlos en state - const authentikUser = useState('authentikUser', () => { + const authentikUser = useState('authentikUser', () => { // Solo en el servidor, leer los headers - if (process.server) { + if (import.meta.server) { const headers = useRequestHeaders() const username = headers['x-authentik-username'] @@ -58,9 +76,8 @@ export const useAuthentik = () => { toast.add({ title: 'Modo Offline', description: 'No se puede validar sesión sin conexión', - color: 'gray', - icon: 'i-heroicons-wifi', - timeout: 5000 + color: 'neutral', + icon: 'i-heroicons-wifi' }) return } @@ -70,13 +87,12 @@ export const useAuthentik = () => { title: 'Verificando sesión...', description: 'Consultando estado en Authentik', color: 'info', - icon: 'i-heroicons-arrow-path', - timeout: 2000 + icon: 'i-heroicons-arrow-path' }) try { // Consultar el endpoint de API que verifica contra Authentik - const response = await $fetch('/api/auth/status') + const response = await $fetch('/api/auth/status') if (response.authenticated && response.user) { // Sesión activa en Authentik @@ -84,8 +100,7 @@ export const useAuthentik = () => { title: 'Sesión Activa', description: `Conectado como: ${response.user.name || response.user.username}`, color: 'success', - icon: 'i-heroicons-check-circle', - timeout: 5000 + icon: 'i-heroicons-check-circle' }) } else { // Sin sesión en Authentik @@ -94,35 +109,33 @@ export const useAuthentik = () => { description: 'No hay sesión activa en Authentik', color: 'warning', icon: 'i-heroicons-exclamation-triangle', - timeout: 10000, actions: [{ label: 'Iniciar Sesión', - click: () => { + onClick: () => { // Recargar la página forzará a Authentik a redirigir al login window.location.reload() } }] }) } - } catch (error) { + } catch (error: unknown) { // 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 + color: 'neutral', + icon: 'i-heroicons-wifi' }) 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() || '' + const errorMessage = (error as Error)?.message || String(error) const isCorsOrRedirectError = errorMessage.includes('Failed to fetch') || errorMessage.includes('CORS') || - error?.statusCode === 302 + (error as any)?.statusCode === 302 if (isCorsOrRedirectError) { // Interpretar como sesión expirada/inválida @@ -131,10 +144,9 @@ export const useAuthentik = () => { description: 'No hay sesión activa en Authentik', color: 'warning', icon: 'i-heroicons-exclamation-triangle', - timeout: 10000, actions: [{ label: 'Iniciar Sesión', - click: () => { + onClick: () => { // Recargar la página forzará a Authentik a redirigir al login window.location.reload() } @@ -146,8 +158,7 @@ export const useAuthentik = () => { title: 'Error', description: 'No se pudo verificar el estado de la sesión', color: 'error', - icon: 'i-heroicons-x-circle', - timeout: 5000 + icon: 'i-heroicons-x-circle' }) } console.error('Error checking session status:', error)