From 24c6fa1f7da00ec72a03a6c01c8dce1bf945a005 Mon Sep 17 00:00:00 2001
From: jtricerolph <info@tricerolph.com>
Date: Wed, 22 Jul 2026 11:10:07 +0000
Subject: [PATCH] Add name, email and sign out button to sidebar footer

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/components/Layout.tsx | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/Layout.tsx b/frontend/src/components/Layout.tsx
index d067760..4182e71 100644
--- a/frontend/src/components/Layout.tsx
+++ b/frontend/src/components/Layout.tsx
@@ -9,6 +9,11 @@ export default function Layout({ children }: { children: React.ReactNode }) {
   const { user } = useAuth()
   const hasCap = (cap: string) => can(user, cap)
 
+  async function logout() {
+    await fetch('/room-planner/api/auth/logout', { method: 'POST', credentials: 'include' })
+    window.location.reload()
+  }
+
   return (
     <div className="app-shell">
       {/* Desktop sidebar */}
@@ -29,7 +34,18 @@ export default function Layout({ children }: { children: React.ReactNode }) {
             </NavLink>
           )}
         </nav>
-        <div className="sidebar-user">{user.name}</div>
+        <div className="sidebar-user" style={{ whiteSpace: 'normal' }}>
+          <div style={{ fontWeight: 600, color: 'var(--text)', fontSize: '12px', marginBottom: '2px' }}>{user.name}</div>
+          <div style={{ fontSize: '11px', marginBottom: '8px' }}>{user.email}</div>
+          <button onClick={logout} style={{
+            display: 'flex', alignItems: 'center', gap: '6px',
+            background: 'none', border: 'none', color: 'inherit',
+            fontSize: '12px', padding: 0, cursor: 'pointer',
+          }}>
+            <LogOut size={13} strokeWidth={1.75} />
+            Sign out
+          </button>
+        </div>
       </aside>
 
       <main className="page-content">