From d98df7a246d9638e7aa49674b86cc78e169317eb Mon Sep 17 00:00:00 2001
From: Devin Foley <devin@devinfoley.com>
Date: Mon, 6 Apr 2026 17:23:13 -0700
Subject: [PATCH] Memoize liveRunSlot to prevent defeating React.memo on
 CommentThread

The liveRunSlot JSX was constructed inline on every render, creating a
new object reference that defeated the React.memo wrapper on
CommentThread. Extract it into a top-level useMemo so the memo boundary
works as intended.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
---
 ui/src/pages/IssueDetail.tsx | 24 ++++++++++++++----------
 1 file changed, 14 insertions(+), 10 deletions(-)

diff --git a/ui/src/pages/IssueDetail.tsx b/ui/src/pages/IssueDetail.tsx
index 88a177cb78a..bf00598efeb 100644
--- a/ui/src/pages/IssueDetail.tsx
+++ b/ui/src/pages/IssueDetail.tsx
@@ -588,6 +588,19 @@ export function IssueDetail() {
     [activity],
   );
 
+  const memoizedLiveRunSlot = useMemo(
+    () =>
+      hasLiveRuns ? (
+        <LiveRunWidget
+          issueId={issueId!}
+          companyId={issue?.companyId ?? ""}
+          liveRunsData={liveRuns ?? []}
+          activeRunData={activeRun ?? null}
+        />
+      ) : null,
+    [hasLiveRuns, issueId, issue?.companyId, liveRuns, activeRun],
+  );
+
   const issueCostSummary = useMemo(() => {
     let input = 0;
     let output = 0;
@@ -1595,16 +1608,7 @@ export function IssueDetail() {
             onAdd={handleCommentAdd}
             imageUploadHandler={handleCommentImageUpload}
             onAttachImage={handleCommentAttachImage}
-            liveRunSlot={
-              hasLiveRuns ? (
-                <LiveRunWidget
-                  issueId={issueId!}
-                  companyId={issue.companyId}
-                  liveRunsData={liveRuns ?? []}
-                  activeRunData={activeRun ?? null}
-                />
-              ) : null
-            }
+            liveRunSlot={memoizedLiveRunSlot}
           />
         </TabsContent>