From a8aa635a1e1b119a4f76e0f950311a8263bde1a3 Mon Sep 17 00:00:00 2001
From: Ghenghis <6685932+Ghenghis@users.noreply.github.com>
Date: Fri, 8 May 2026 15:40:33 -0700
Subject: [PATCH] fix(I10): reduce polling lag, fix sidebar overflow, layout
 fixes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- AppShell: remove lg:overflow-hidden on main in dashboard mode to prevent panel cutoff on large viewports (overflow-auto retained throughout)
- Sidebar: wrap AgentChatMirror in min-h-0 shrink container so tall chat panel no longer displaces nav items off-screen
- TopBar: fix stale data — was fetch-on-mount only; add 10 000 ms setInterval refresh for system snapshot, notifications, and proof bundle (non-critical display data)
- globals.css: no changes needed (font-size 13px and dashboard-grid overflow-hidden are intentional)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 03_implementation/ui/src/app/AppShell.tsx     |  2 +-
 .../ui/src/components/layout/Sidebar.tsx      |  4 ++-
 .../ui/src/components/layout/TopBar.tsx       | 27 ++++++++++++-------
 3 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/03_implementation/ui/src/app/AppShell.tsx b/03_implementation/ui/src/app/AppShell.tsx
index 4bc3b5cc..c8448a31 100644
--- a/03_implementation/ui/src/app/AppShell.tsx
+++ b/03_implementation/ui/src/app/AppShell.tsx
@@ -21,7 +21,7 @@ export function AppShell({ children }: { children?: ReactNode }) {
       <Sidebar />
       <div className="flex min-h-0 flex-1 flex-col">
         <TopBar activeLabel={activeTab.label} />
-        <main className={dashboard ? "min-h-0 flex-1 overflow-auto p-2.5 lg:overflow-hidden" : "min-h-0 flex-1 overflow-auto p-2.5"}>
+        <main className={dashboard ? "min-h-0 flex-1 overflow-auto p-2.5" : "min-h-0 flex-1 overflow-auto p-2.5"}>
           {children}
         </main>
       </div>
diff --git a/03_implementation/ui/src/components/layout/Sidebar.tsx b/03_implementation/ui/src/components/layout/Sidebar.tsx
index e011351a..74d9c980 100644
--- a/03_implementation/ui/src/components/layout/Sidebar.tsx
+++ b/03_implementation/ui/src/components/layout/Sidebar.tsx
@@ -32,7 +32,9 @@ export function Sidebar() {
           />
         ))}
       </nav>
-      <AgentChatMirror />
+      <div className="min-h-0 shrink overflow-hidden">
+        <AgentChatMirror />
+      </div>
     </ResizablePane>
   );
 }
diff --git a/03_implementation/ui/src/components/layout/TopBar.tsx b/03_implementation/ui/src/components/layout/TopBar.tsx
index dbe7d4e6..bdc04f64 100644
--- a/03_implementation/ui/src/components/layout/TopBar.tsx
+++ b/03_implementation/ui/src/components/layout/TopBar.tsx
@@ -27,17 +27,26 @@ export function TopBar({ activeLabel }: { activeLabel: string }) {
 
   useEffect(() => {
     let mounted = true;
-    void adapters.getSystemSnapshot().then((snapshot) => {
-      if (mounted) setSys(snapshot);
-    });
-    void adapters.getNotifications().then((items) => {
-      if (mounted) setNotifications(items);
-    });
-    void adapters.getLatestProofBundle().then((bundle) => {
-      if (mounted) setLatestProof(bundle);
-    });
+
+    const fetchAll = () => {
+      void adapters.getSystemSnapshot().then((snapshot) => {
+        if (mounted) setSys(snapshot);
+      });
+      void adapters.getNotifications().then((items) => {
+        if (mounted) setNotifications(items);
+      });
+      void adapters.getLatestProofBundle().then((bundle) => {
+        if (mounted) setLatestProof(bundle);
+      });
+    };
+
+    fetchAll();
+    // Refresh system status every 10 s — non-critical display data; 10 s avoids render churn.
+    const timer = window.setInterval(fetchAll, 10_000);
+
     return () => {
       mounted = false;
+      window.clearInterval(timer);
     };
   }, []);