From 4c2db3bbb1b003427307582d38eb17ae00f44865 Mon Sep 17 00:00:00 2001
From: ciregenz <ciregenz@berkeley.edu>
Date: Tue, 18 Aug 2026 19:12:36 -0700
Subject: [PATCH] [eric] chat: docked mini cards are inert previews; drag from
 anywhere on the body, clicks stop leaking into the live page, wheel scrolls
 the transcript (ENG-348)

---
 .../app/pages/Dashboard/cards/BrowserCard.tsx   | 17 +++++++++++++++++
 .../pages/Dashboard/cards/DashboardViewCard.tsx | 17 +++++++++++++++++
 2 files changed, 34 insertions(+)

diff --git a/frontend/src/app/pages/Dashboard/cards/BrowserCard.tsx b/frontend/src/app/pages/Dashboard/cards/BrowserCard.tsx
index 8bde7d02..18cba498 100644
--- a/frontend/src/app/pages/Dashboard/cards/BrowserCard.tsx
+++ b/frontend/src/app/pages/Dashboard/cards/BrowserCard.tsx
@@ -1612,6 +1612,23 @@ const BrowserCard: React.FC<Props> = ({
         {findOpen && !suspendedSnap && (
           <BrowserFindBar browserId={browserId} focusSignal={findFocusSignal} onClose={() => setFindOpen(false)} />
         )}
+        {/* Docked in chat = inert preview (ENG-348): body clicks can't reach the page, drag works from anywhere, wheel scrolls the transcript. Header (z16) keeps its controls. */}
+        {dockActive && (
+          <Box
+            onPointerDown={handleDragPointerDown}
+            onPointerMove={handleDragPointerMove}
+            onPointerUp={handleDragPointerUp}
+            onPointerCancel={abortDrag}
+            onLostPointerCapture={abortDrag}
+            onWheel={(e) => {
+              e.stopPropagation();
+              let el = document.querySelector(`[data-browser-slot="${dockedTo}"]`) as HTMLElement | null;
+              while (el && el.scrollHeight <= el.clientHeight + 1) el = el.parentElement;
+              if (el) el.scrollTop += e.deltaY;
+            }}
+            sx={{ position: 'absolute', inset: 0, zIndex: 15, cursor: 'grab', '&:active': { cursor: 'grabbing' } }}
+          />
+        )}
         {isElementSelectMode && (
           <Box sx={{ position: 'absolute', inset: 0, zIndex: 10, pointerEvents: 'none' }} />
         )}
diff --git a/frontend/src/app/pages/Dashboard/cards/DashboardViewCard.tsx b/frontend/src/app/pages/Dashboard/cards/DashboardViewCard.tsx
index f172695c..4d3193c2 100644
--- a/frontend/src/app/pages/Dashboard/cards/DashboardViewCard.tsx
+++ b/frontend/src/app/pages/Dashboard/cards/DashboardViewCard.tsx
@@ -875,6 +875,23 @@ const DashboardViewCard: React.FC<Props> = ({
         {cmdHeld && !isSelected && (
           <Box sx={{ position: 'absolute', inset: 0, zIndex: 12 }} />
         )}
+        {/* Docked in chat = inert preview (ENG-348): body clicks can't reach the app, drag works from anywhere, wheel scrolls the transcript. */}
+        {dockActive && (
+          <Box
+            onPointerDown={handleDragPointerDown}
+            onPointerMove={handleDragPointerMove}
+            onPointerUp={handleDragPointerUp}
+            onPointerCancel={abortDrag}
+            onLostPointerCapture={abortDrag}
+            onWheel={(e) => {
+              e.stopPropagation();
+              let el = document.querySelector(`[data-browser-slot="${dockedTo}"]`) as HTMLElement | null;
+              while (el && el.scrollHeight <= el.clientHeight + 1) el = el.parentElement;
+              if (el) el.scrollTop += e.deltaY;
+            }}
+            sx={{ position: 'absolute', inset: 0, zIndex: 14, cursor: 'grab', '&:active': { cursor: 'grabbing' } }}
+          />
+        )}
         <DashboardOutputPreview
           previewRef={previewRef}
           output={output}