fix(auth): useLogin maps login response to User, ProtectedRoute calls useAuth()

frontend/src/api/auth.ts

@@ -26,7 +26,18 @@ export function useLogin() {
     mutationFn: (payload: LoginPayload) =>
       apiPost('/auth/login', payload),
     onSuccess: (data: any) => {
-      setUser(data.user || data);
+      // Map flat login response to User interface
+      const user = data.user || {
+        id: data.user_id,
+        email: data.email,
+        first_name: data.name?.split(' ')[0] || '',
+        last_name: data.name?.split(' ').slice(1).join(' ') || '',
+        role: data.role,
+        is_system_admin: data.is_system_admin,
+        tenants: [{ id: data.tenant_id, name: data.tenant_name, slug: '' }],
+        avatar_url: null,
+      };
+      setUser(user);
       setError(null);
       // Store CSRF token for subsequent unsafe requests
       if (data.csrf_token) {

frontend/src/routes/ProtectedRoute.tsx

@@ -1,11 +1,15 @@
 import React from 'react';
 import { Navigate, useLocation } from 'react-router-dom';
 import { useAuthStore } from '@/store/authStore';
+import { useAuth } from '@/hooks/useAuth';
 
 export function ProtectedRoute({ children }: { children: React.ReactNode }) {
   const { isAuthenticated } = useAuthStore();
   const location = useLocation();
 
+  // Load user data on mount (handles page refresh)
+  useAuth();
+
   if (!isAuthenticated) {
     return <Navigate to="/login" state={{ from: location }} replace />;
   }