From 35bcaca64318c5fbb616cb84c79c946a20746464 Mon Sep 17 00:00:00 2001
From: Dotta <bippadotta@protonmail.com>
Date: Fri, 19 Jun 2026 04:04:48 +0000
Subject: [PATCH] Fix mobile issue chat bubble width

---
 ui/src/components/IssueChatThread.test.tsx | 2 ++
 ui/src/components/IssueChatThread.tsx      | 5 ++++-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/ui/src/components/IssueChatThread.test.tsx b/ui/src/components/IssueChatThread.test.tsx
index 241a7fae143..87ece4753e6 100644
--- a/ui/src/components/IssueChatThread.test.tsx
+++ b/ui/src/components/IssueChatThread.test.tsx
@@ -1369,6 +1369,8 @@ describe("IssueChatThread", () => {
     );
     expect(bubble).toBeDefined();
     expect(bubble?.textContent).toContain("Here is my agent reply.");
+    expect(bubble?.className).toContain("max-w-[calc(100%-0.5rem)]");
+    expect(bubble?.className).toContain("sm:max-w-[85%]");
     // Neutral, not the human liveness-blue bubble.
     expect(bubble?.className).not.toContain("bg-[#2563EB]");
 
diff --git a/ui/src/components/IssueChatThread.tsx b/ui/src/components/IssueChatThread.tsx
index 8d897730e56..414a79602ec 100644
--- a/ui/src/components/IssueChatThread.tsx
+++ b/ui/src/components/IssueChatThread.tsx
@@ -221,6 +221,8 @@ const IssueChatCtx = createContext<IssueChatMessageContext>({
   successfulRunHandoff: null,
 });
 
+const AGENT_COMMENT_BUBBLE_WIDTH_CLASS = "max-w-[calc(100%-0.5rem)] sm:max-w-[85%]";
+
 export type IssueChatRunFinalizationAction = {
   id: "cancel" | "done";
   label: string;
@@ -1720,7 +1722,8 @@ function IssueChatAssistantMessage({
           {/* Canonical conference-room agent bubble (BoardChat.tsx:712). */}
           <div
             className={cn(
-              "min-w-0 max-w-[85%] break-words px-3 py-2 text-sm overflow-x-auto overflow-y-visible [border-radius:14px_14px_14px_4px]",
+              "min-w-0 break-words px-3 py-2 text-sm overflow-x-auto overflow-y-visible [border-radius:14px_14px_14px_4px]",
+              AGENT_COMMENT_BUBBLE_WIDTH_CLASS,
               deleted
                 ? "border border-border bg-muted/50 text-muted-foreground"
                 : "border border-border bg-card text-foreground",