From b0cf729fd6a794727aeb234938d197b831b95bb4 Mon Sep 17 00:00:00 2001
From: Keshav Malik <keshavaarav22@gmail.com>
Date: Fri, 14 Aug 2026 15:43:36 +0530
Subject: [PATCH] Fix PR branch selector overflow

---
 ui/src/apps/pr-write/App.tsx | 28 ++++++++++++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

diff --git a/ui/src/apps/pr-write/App.tsx b/ui/src/apps/pr-write/App.tsx
index 6975434bea..6d646a7e28 100644
--- a/ui/src/apps/pr-write/App.tsx
+++ b/ui/src/apps/pr-write/App.tsx
@@ -52,6 +52,22 @@ interface BranchItem {
   protected: boolean;
 }
 
+const branchMenuButtonSx = {
+  width: "100%",
+  minWidth: 0,
+  "& [data-component='buttonContent']": {
+    minWidth: 0,
+    overflow: "hidden",
+    flex: "1 1 auto",
+  },
+  "& [data-component='text']": {
+    minWidth: 0,
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    whiteSpace: "nowrap",
+  },
+} as const;
+
 type ReviewerItem = { kind: "user" | "team"; id: string; text: string; avatar?: string; org?: string };
 
 function reviewerFromValue(value: string): ReviewerItem {
@@ -570,7 +586,11 @@ function CreatePRApp() {
           <Box sx={{ flex: "1 1 120px", minWidth: 0 }}>
             <Text sx={{ fontSize: 0, color: "fg.muted", mb: 1, display: "block" }}>base</Text>
             <ActionMenu>
-              <ActionMenu.Button size="small" leadingVisual={GitBranchIcon} sx={{ width: "100%", "& > span": { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }}>
+              <ActionMenu.Button
+                size="small"
+                leadingVisual={GitBranchIcon}
+                sx={branchMenuButtonSx}
+              >
                 {baseBranch || "Select base"}
               </ActionMenu.Button>
               <ActionMenu.Overlay width="medium">
@@ -611,7 +631,11 @@ function CreatePRApp() {
           <Box sx={{ flex: "1 1 120px", minWidth: 0 }}>
             <Text sx={{ fontSize: 0, color: "fg.muted", mb: 1, display: "block" }}>compare</Text>
             <ActionMenu>
-              <ActionMenu.Button size="small" leadingVisual={GitBranchIcon} sx={{ width: "100%", "& > span": { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }}>
+              <ActionMenu.Button
+                size="small"
+                leadingVisual={GitBranchIcon}
+                sx={branchMenuButtonSx}
+              >
                 {headBranch || "Select head"}
               </ActionMenu.Button>
               <ActionMenu.Overlay width="medium">