From 4a749f103b16bd70799eb05af7f3710dfd8f8a95 Mon Sep 17 00:00:00 2001
From: Bohan Jiang <52446949+Bohan-J@users.noreply.github.com>
Date: Wed, 6 May 2026 18:06:31 +0800
Subject: [PATCH] docs(views): explain min-h-[60vh] mobile fallback in agent
 overview pane (#2061)

The 60vh value is the magic number that keeps the tab content area
usably tall when the parent stacks inspector + overview on mobile and
delegates scroll to the page. Add a short note next to the className
so future maintainers know what the constraint is for and why `md:`
overrides it.
---
 packages/views/agents/components/agent-overview-pane.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/views/agents/components/agent-overview-pane.tsx b/packages/views/agents/components/agent-overview-pane.tsx
index 508acb7d49..e765832cb6 100644
--- a/packages/views/agents/components/agent-overview-pane.tsx
+++ b/packages/views/agents/components/agent-overview-pane.tsx
@@ -117,6 +117,10 @@ export function AgentOverviewPane({
   };
 
   return (
+    // On mobile the parent stacks the inspector and overview and scrolls the
+    // page itself, so this pane has no inherited height. `min-h-[60vh]` keeps
+    // the tab content area usably tall when content is short; `md:` restores
+    // the grid-driven full-height behavior on tablet and up.
     <div className="flex min-h-[60vh] flex-col overflow-hidden rounded-lg border bg-background md:h-full md:min-h-0">
       <div className="flex shrink-0 items-center gap-0 overflow-x-auto border-b px-2 md:px-4">
         {detailTabs.map((tab) => (