From d44531c19ab6e7da013de56b5da6dccf312a5b26 Mon Sep 17 00:00:00 2001
From: spencrmartin <spencermartin@squareup.com>
Date: Sun, 23 Nov 2025 09:14:01 -0500
Subject: [PATCH] Preserve comment gutter space when sidecar is open

- Add pr-16 (64px) right padding to messages in condensed mode
- Position badge at right-2 instead of right-0 -mr-12
- Badge stays within message bounds, visible in gutter
- Prevents text from extending into comment gutter area
- Maintains consistent spacing with/without sidecars
---
 ui/desktop/src/components/GooseMessage.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/ui/desktop/src/components/GooseMessage.tsx b/ui/desktop/src/components/GooseMessage.tsx
index bd7e45e226..394c2a1331 100644
--- a/ui/desktop/src/components/GooseMessage.tsx
+++ b/ui/desktop/src/components/GooseMessage.tsx
@@ -267,7 +267,14 @@ export default function GooseMessage({
   const isFromCollaborator = message.sender && (message as any).metadata?.isFromCollaborator;
 
   return (
-    <div ref={messageContainerRef} className="goose-message flex w-full justify-start min-w-0 gap-3 relative">
+    <div 
+      ref={messageContainerRef} 
+      className={cn(
+        "goose-message flex w-full justify-start min-w-0 gap-3 relative",
+        // Add right padding in condensed mode to make room for comment gutter
+        displayMode === 'condensed' && 'pr-16'
+      )}
+    >
       {/* Goose Avatar on the left side with optional user badge */}
       <div className="flex-shrink-0 relative" style={{ marginTop: '0.25rem' }}>
         {/* Main Goose dot avatar */}
@@ -404,7 +411,7 @@ export default function GooseMessage({
       {((comments && comments.length > 0) || (isCreatingComment && activeMessageId === uniqueMessageId)) && (
         <div className={cn(
           'absolute top-0 z-10',
-          displayMode === 'full' ? 'left-full ml-4 w-80' : 'right-0 -mr-12'
+          displayMode === 'full' ? 'left-full ml-4 w-80' : 'right-2'
         )}>
           <MessageComments
             messageId={uniqueMessageId}