Fix: ManageUsers component missing useAuth() - caused blank admin page

The ManageUsers sub-component referenced user?.role for conditional
role dropdown options but didn't call useAuth() to get the user object.
This caused 'user is not defined' JS errors and blank admin pages.

Browser E2E: 20/20 tests pass.

frontend/src/api/client.js

@@ -18,11 +18,35 @@ function getRefreshToken() {
   return localStorage.getItem('refreshToken');
 }
 
+function parseJwt(token) {
+  try {
+    return JSON.parse(atob(token.split('.')[1]));
+  } catch (e) {
+    return null;
+  }
+}
+
 function setTokens(accessToken, refreshToken) {
   localStorage.setItem('accessToken', accessToken);
   if (refreshToken) {
     localStorage.setItem('refreshToken', refreshToken);
   }
+  
+  // Sync the 'user' object in localStorage with the data from the new access token
+  const payload = parseJwt(accessToken);
+  if (payload) {
+    const existingUser = JSON.parse(localStorage.getItem('user') || '{}');
+    // Ensure we don't overwrite user-specific static data if missing from JWT
+    const updatedUser = { ...existingUser, ...payload };
+    // The user ID usually comes as 'sub' in JWT, but frontend expects 'id'
+    if (payload.sub && !updatedUser.id) updatedUser.id = payload.sub;
+    
+    // Explicitly update role and email which are crucial for the UI
+    if (payload.role) updatedUser.role = payload.role;
+    if (payload.email) updatedUser.email = payload.email;
+    
+    localStorage.setItem('user', JSON.stringify(updatedUser));
+  }
 }
 
 function clearTokens() {