From 6ff69cc308422c36f50d4255be305d01a6b6e5c6 Mon Sep 17 00:00:00 2001
From: michael <michael@modernfreedom.com>
Date: Thu, 18 Dec 2025 13:23:28 -0600
Subject: [PATCH] Display actual user name in sidebar from MSAL
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Add userName and userEmail props to Sidebar component
- Pass user info from MSAL to Sidebar in App.tsx
- Replace hardcoded "Steve O'Donoghue" with actual logged-in user

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 frontend/App.tsx                | 11 ++++++++++-
 frontend/components/Sidebar.tsx |  8 +++++---
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/frontend/App.tsx b/frontend/App.tsx
index 1fcccc1..bae1c68 100755
--- a/frontend/App.tsx
+++ b/frontend/App.tsx
@@ -4,6 +4,7 @@ import { useIsAuthenticated, useMsal } from '@azure/msal-react';
 import { InteractionStatus } from '@azure/msal-browser';
 import { Hero } from './components/Hero';
 import { analyzeProof } from './services/geminiService';
+import { getUserInfo } from './services/authService';
 import type { AgentReview, AgentName, FlaggedItem, ResolvedItem, ErrorItem } from './types';
 import { AGENT_NAMES } from './constants';
 import { Sidebar } from './components/Sidebar';
@@ -820,9 +821,17 @@ const App: React.FC = () => {
   // Determine background color based on view to avoid grey bar on Home view
   const mainBgColor = currentView === 'Home' ? 'bg-white' : 'bg-brand-gray';
 
+  // Get user info from MSAL for sidebar display
+  const userInfo = getUserInfo(msalInstance);
+
   return (
     <div className={`flex h-screen ${mainBgColor} font-sans text-gray-800 overflow-hidden`}>
-      <Sidebar activeItem={currentView} onNavigate={(view) => handleNavigate(view as View)} />
+      <Sidebar
+        activeItem={currentView}
+        onNavigate={(view) => handleNavigate(view as View)}
+        userName={userInfo?.name}
+        userEmail={userInfo?.email}
+      />
       <div className="flex-1 flex flex-col overflow-y-auto">
         <main className="flex-1 flex flex-col min-h-full">
           {renderContent()}
diff --git a/frontend/components/Sidebar.tsx b/frontend/components/Sidebar.tsx
index d5cc142..8a5d219 100755
--- a/frontend/components/Sidebar.tsx
+++ b/frontend/components/Sidebar.tsx
@@ -21,9 +21,11 @@ const navigation = [
 interface SidebarProps {
     activeItem: string;
     onNavigate: (viewName: string) => void;
+    userName?: string;
+    userEmail?: string;
 }
 
-export const Sidebar: React.FC<SidebarProps> = ({ activeItem, onNavigate }) => {
+export const Sidebar: React.FC<SidebarProps> = ({ activeItem, onNavigate, userName, userEmail }) => {
     return (
         <aside className="w-72 flex-shrink-0 bg-[#0f172a] text-slate-200 flex flex-col border-r border-slate-800 font-sans">
             {/* Brand Header */}
@@ -84,8 +86,8 @@ export const Sidebar: React.FC<SidebarProps> = ({ activeItem, onNavigate }) => {
                         <UserIcon className="h-5 w-5 text-white" />
                     </div>
                     <div className="overflow-hidden">
-                        <p className="font-semibold text-sm text-white truncate">Steve O'Donoghue</p>
-                        <p className="text-xs text-slate-400 truncate">OLIVER Agency</p>
+                        <p className="font-semibold text-sm text-white truncate">{userName || 'Unknown User'}</p>
+                        <p className="text-xs text-slate-400 truncate">{userEmail || ''}</p>
                     </div>
                 </button>
             </div>