From a4b9d013e1e8ebddf69a781fcbdec7b5eeca7854 Mon Sep 17 00:00:00 2001 From: "Rodrigo Rodriguez (Pragmatismo)" Date: Wed, 7 Jan 2026 07:03:07 -0300 Subject: [PATCH] fix(auth): Integrate user menu with GBAuth service - Use GBAuth service events for user profile updates - Use correct storage keys (gb-access-token, gb-user-data) - Listen to userUpdated, login, logout events - Store tokens using AuthService.storeTokens() method - Add fallback for when GBAuth is not immediately available --- ui/suite/auth/auth.js | 27 +++++++++++--- ui/suite/index.html | 84 +++++++++++++++++++++++++------------------ 2 files changed, 73 insertions(+), 38 deletions(-) diff --git a/ui/suite/auth/auth.js b/ui/suite/auth/auth.js index cdc0d25..167a724 100644 --- a/ui/suite/auth/auth.js +++ b/ui/suite/auth/auth.js @@ -334,13 +334,32 @@ function initHtmxHandlers() { return; } - // Save token on successful login + // Save token using GBAuth service if available if (response.access_token) { const rememberMe = document.getElementById("remember"); - if (rememberMe && rememberMe.checked) { - localStorage.setItem("access_token", response.access_token); + const remember = rememberMe && rememberMe.checked; + + if (window.AuthService && window.AuthService.storeTokens) { + window.AuthService.storeTokens( + response.access_token, + response.refresh_token, + response.expires_in, + remember, + ); + if (response.user_id) { + window.AuthService.currentUser = { id: response.user_id }; + } } else { - sessionStorage.setItem("access_token", response.access_token); + // Fallback to direct storage with correct keys + const storage = remember ? localStorage : sessionStorage; + storage.setItem("gb-access-token", response.access_token); + if (response.refresh_token) { + storage.setItem("gb-refresh-token", response.refresh_token); + } + if (response.expires_in) { + const expiresAt = Date.now() + response.expires_in * 1000; + storage.setItem("gb-token-expires", expiresAt.toString()); + } } } diff --git a/ui/suite/index.html b/ui/suite/index.html index ec0b930..77a47af 100644 --- a/ui/suite/index.html +++ b/ui/suite/index.html @@ -2918,12 +2918,8 @@ }); }); - // User Profile Loading + // User Profile Loading - Integrates with GBAuth service (function () { - const token = - localStorage.getItem("access_token") || - sessionStorage.getItem("access_token"); - function updateUserUI(user) { const userName = document.getElementById("userName"); const userEmail = document.getElementById("userEmail"); @@ -2934,7 +2930,7 @@ const authText = document.getElementById("authText"); const authIcon = document.getElementById("authIcon"); - if (user) { + if (user && user.email) { const displayName = user.display_name || user.first_name || @@ -2947,9 +2943,10 @@ if (userName) userName.textContent = displayName; if (userEmail) userEmail.textContent = email; - if (userAvatar) - userAvatar.querySelector("span").textContent = - initial; + if (userAvatar) { + const avatarSpan = userAvatar.querySelector("span"); + if (avatarSpan) avatarSpan.textContent = initial; + } if (userAvatarLarge) userAvatarLarge.textContent = initial; @@ -2957,7 +2954,9 @@ authAction.href = "#"; authAction.onclick = function (e) { e.preventDefault(); - logout(); + if (window.GBAuth) { + window.GBAuth.logout(); + } }; authAction.style.color = "var(--error)"; } @@ -2969,31 +2968,48 @@ } } - function logout() { - fetch("/api/auth/logout", { method: "POST" }).finally( - () => { - localStorage.removeItem("access_token"); - sessionStorage.removeItem("access_token"); - window.location.href = "/auth/login.html"; - }, - ); - } + // Listen for auth service events + if (window.GBAuth) { + window.GBAuth.on("userUpdated", updateUserUI); + window.GBAuth.on("login", function () { + const user = window.GBAuth.getCurrentUser(); + if (user) updateUserUI(user); + }); + window.GBAuth.on("logout", function () { + window.location.href = "/auth/login.html"; + }); - if (token) { - fetch("/api/auth/me", { - headers: { Authorization: "Bearer " + token }, - }) - .then((res) => - res.ok - ? res.json() - : Promise.reject("Not authenticated"), - ) - .then((user) => updateUserUI(user)) - .catch((err) => { - console.log("Not authenticated:", err); - localStorage.removeItem("access_token"); - sessionStorage.removeItem("access_token"); - }); + // Load current user on page load + if (window.GBAuth.isAuthenticated()) { + const user = window.GBAuth.getCurrentUser(); + if (user && user.email) { + updateUserUI(user); + } else { + // Fetch from API if not cached + window.AuthService.fetchCurrentUser().then( + updateUserUI, + ); + } + } + } else { + // Fallback: wait for GBAuth to be available + document.addEventListener("DOMContentLoaded", function () { + setTimeout(function () { + if ( + window.GBAuth && + window.GBAuth.isAuthenticated() + ) { + const user = window.GBAuth.getCurrentUser(); + if (user) { + updateUserUI(user); + } else { + window.AuthService.fetchCurrentUser().then( + updateUserUI, + ); + } + } + }, 100); + }); } })();