From bf4298a0481de4ef42bbfc39d7c7bf7603f13cf6 Mon Sep 17 00:00:00 2001
From: brennanb2025 <brennankbenson@gmail.com>
Date: Fri, 1 May 2026 12:38:37 -0700
Subject: [PATCH] fix(tabs): drop doubled border on leftmost split pane
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The TabGroupSplitLayout wrapper paints a full-height `border-l` at the
sidebar seam, and every split pane paints its own `border-l`. On the
leftmost pane those stacked at the same x, reading as a ~2px bar just
below the drag strip where the wrapper's 1px line continues alone above.

Mirror the right-edge handling: skip the pane's `border-l` when it
touches the left edge, leaving the single wrapper border to draw the
seam — same visual weight as the right edge.

Co-authored-by: Orca <help@stably.ai>
---
 .../src/components/tab-group/TabGroupPanel.tsx | 18 ++++++++++--------
 .../tab-group/TabGroupSplitLayout.tsx          |  1 +
 2 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/renderer/src/components/tab-group/TabGroupPanel.tsx b/src/renderer/src/components/tab-group/TabGroupPanel.tsx
index 18c4d0ab814..436acb4ed8e 100644
--- a/src/renderer/src/components/tab-group/TabGroupPanel.tsx
+++ b/src/renderer/src/components/tab-group/TabGroupPanel.tsx
@@ -29,6 +29,7 @@ export default function TabGroupPanel({
   isFocused,
   hasSplitGroups,
   touchesRightEdge,
+  touchesLeftEdge,
   reserveClosedExplorerToggleSpace,
   reserveCollapsedSidebarHeaderSpace,
   isTabDragActive = false,
@@ -41,6 +42,7 @@ export default function TabGroupPanel({
   isFocused: boolean
   hasSplitGroups: boolean
   touchesRightEdge: boolean
+  touchesLeftEdge: boolean
   reserveClosedExplorerToggleSpace: boolean
   reserveCollapsedSidebarHeaderSpace: boolean
   isTabDragActive?: boolean
@@ -197,14 +199,14 @@ export default function TabGroupPanel({
       // because a lone group has nothing to contrast against.
       className={`group/tab-group flex flex-col flex-1 min-w-0 min-h-0 overflow-hidden${
         hasSplitGroups
-          ? // Why: drop only the RIGHT border on the rightmost group. The right
-            // sidebar paints its own `borderLeft` that already extends full
-            // height, so painting our own border-r in that spot stacks a
-            // second 1px line next to it — reading as a 2px-thick bar below
-            // the 8px drag strip (where the sidebar border continues alone
-            // above). The left edge has no such double-up, so the left
-            // border is always kept.
-            ` border-l ${touchesRightEdge ? '' : 'border-r'} border-border border-b ${isFocused ? 'border-b-accent' : 'opacity-95'}`
+          ? // Why: drop the outer borders on the edge-touching groups. The
+            // TabGroupSplitLayout wrapper already paints a full-height
+            // `border-l` at the sidebar seam, and the right sidebar paints
+            // its own `borderLeft` at the right seam — painting our own
+            // border-l/border-r in those spots stacks a second 1px line
+            // next to it, reading as a ~2px bar below the drag strip
+            // (where the sibling border continues alone above).
+            ` ${touchesLeftEdge ? '' : 'border-l'} ${touchesRightEdge ? '' : 'border-r'} border-border border-b ${isFocused ? 'border-b-accent' : 'opacity-95'}`
           : ''
       }`}
       onPointerDown={commands.focusGroup}
diff --git a/src/renderer/src/components/tab-group/TabGroupSplitLayout.tsx b/src/renderer/src/components/tab-group/TabGroupSplitLayout.tsx
index 52f2ca7ea88..15db1fd2810 100644
--- a/src/renderer/src/components/tab-group/TabGroupSplitLayout.tsx
+++ b/src/renderer/src/components/tab-group/TabGroupSplitLayout.tsx
@@ -126,6 +126,7 @@ function SplitNode({
         isFocused={isWorktreeActive && node.groupId === focusedGroupId}
         hasSplitGroups={hasSplitGroups}
         touchesRightEdge={touchesRightEdge}
+        touchesLeftEdge={touchesLeftEdge}
         reserveClosedExplorerToggleSpace={touchesTopEdge && touchesRightEdge}
         reserveCollapsedSidebarHeaderSpace={touchesTopEdge && touchesLeftEdge}
         isTabDragActive={isTabDragActive}