Add user info header to authentication dropdown
- Created /api/auth/userinfo endpoint to fetch user data from Authentik headers - Added userInfo state and fetchUserInfo() function to useAuth composable - Implemented compact user info header in dropdown with avatar, name, and email - Avatar shows user initials with gradient background - Styled with glassmorphism design matching app aesthetic
This commit is contained in:
@@ -6,6 +6,9 @@ const isAuthenticated = ref(true) // Asumimos autenticado al inicio (si la pági
|
||||
const isCheckingAuth = ref(false)
|
||||
const lastCheckTime = ref(0)
|
||||
|
||||
// Estado de información del usuario
|
||||
const userInfo = ref(null)
|
||||
|
||||
// Listener para cambios de autenticación desde otras tabs/ventanas
|
||||
let visibilityChangeListener: (() => void) | null = null
|
||||
let focusListener: (() => void) | null = null
|
||||
@@ -106,12 +109,31 @@ export const useAuth = () => {
|
||||
window.location.href = window.location.origin + '/'
|
||||
}
|
||||
|
||||
const fetchUserInfo = async () => {
|
||||
if (!isAuthenticated.value) {
|
||||
console.log('[Auth] Cannot fetch user info - not authenticated')
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
const info = await $fetch('/api/auth/userinfo')
|
||||
userInfo.value = info
|
||||
console.log('[Auth] User info loaded:', info)
|
||||
} catch (error) {
|
||||
console.warn('[Auth] Failed to fetch user info:', error)
|
||||
userInfo.value = null
|
||||
}
|
||||
}
|
||||
|
||||
const logout = async () => {
|
||||
console.log('[Auth] Logging out...')
|
||||
|
||||
// Marcar como no autenticado y desregistrar SW
|
||||
await markUnauthenticated()
|
||||
|
||||
// Limpiar información del usuario
|
||||
userInfo.value = null
|
||||
|
||||
// Navegar directamente al servidor de Authentik para logout
|
||||
// Authentik tiene un flujo de invalidación por defecto que cierra la sesión
|
||||
console.log('[Auth] Navigating to Authentik logout...')
|
||||
@@ -198,8 +220,10 @@ export const useAuth = () => {
|
||||
authChecked,
|
||||
isCheckingAuth,
|
||||
authStatus,
|
||||
userInfo,
|
||||
checkAuth,
|
||||
triggerAuth,
|
||||
fetchUserInfo,
|
||||
logout,
|
||||
markUnauthenticated,
|
||||
setupVisibilityListener,
|
||||
|
||||
Reference in New Issue
Block a user