From cf788f1302a11c8be644fbcc67e9ca72b01faade Mon Sep 17 00:00:00 2001
From: brennanb2025 <brennankbenson@gmail.com>
Date: Fri, 24 Apr 2026 18:58:40 -0700
Subject: [PATCH] fix(tabs): restore visible right-sidebar divider

Move the terminal/right-sidebar seam from the right sidebar's own
`borderLeft` (which was rendering too subtly against the center column)
back to the rightmost split pane's `border-r`, and extend it up through
the drag strip so the line reaches y=0. Symmetric with the left side.
---
 .../src/components/right-sidebar/index.tsx       |  7 +------
 .../src/components/tab-group/TabGroupPanel.tsx   | 11 +----------
 .../components/tab-group/TabGroupSplitLayout.tsx | 16 ++++++++--------
 3 files changed, 10 insertions(+), 24 deletions(-)

diff --git a/src/renderer/src/components/right-sidebar/index.tsx b/src/renderer/src/components/right-sidebar/index.tsx
index 314baedb938..a14aa22b820 100644
--- a/src/renderer/src/components/right-sidebar/index.tsx
+++ b/src/renderer/src/components/right-sidebar/index.tsx
@@ -197,12 +197,7 @@ function RightSidebarInner(): React.JSX.Element {
       )}
     >
       {/* Panel content area */}
-      <div
-        className="flex flex-col flex-1 min-w-0 bg-sidebar overflow-hidden"
-        style={{
-          borderLeft: rightSidebarOpen ? '1px solid var(--sidebar-border)' : 'none'
-        }}
-      >
+      <div className="flex flex-col flex-1 min-w-0 bg-sidebar overflow-hidden">
         {activityBarPosition === 'top' ? (
           /* ── Top activity bar: horizontal icon row ── */
           <ContextMenu>
diff --git a/src/renderer/src/components/tab-group/TabGroupPanel.tsx b/src/renderer/src/components/tab-group/TabGroupPanel.tsx
index d8888e1603c..36febd753c6 100644
--- a/src/renderer/src/components/tab-group/TabGroupPanel.tsx
+++ b/src/renderer/src/components/tab-group/TabGroupPanel.tsx
@@ -28,7 +28,6 @@ export default function TabGroupPanel({
   isWorktreeActive,
   isFocused,
   hasSplitGroups,
-  touchesRightEdge,
   reserveClosedExplorerToggleSpace,
   reserveCollapsedSidebarHeaderSpace,
   isTabDragActive = false,
@@ -40,7 +39,6 @@ export default function TabGroupPanel({
   isWorktreeActive: boolean
   isFocused: boolean
   hasSplitGroups: boolean
-  touchesRightEdge: boolean
   reserveClosedExplorerToggleSpace: boolean
   reserveCollapsedSidebarHeaderSpace: boolean
   isTabDragActive?: boolean
@@ -190,14 +188,7 @@ 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'}`
+          ? ` border-x 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 3277b689fd2..79319e5dc25 100644
--- a/src/renderer/src/components/tab-group/TabGroupSplitLayout.tsx
+++ b/src/renderer/src/components/tab-group/TabGroupSplitLayout.tsx
@@ -125,7 +125,6 @@ function SplitNode({
         // "focused", Cmd/Ctrl+W and split shortcuts can hit the wrong worktree.
         isFocused={isWorktreeActive && node.groupId === focusedGroupId}
         hasSplitGroups={hasSplitGroups}
-        touchesRightEdge={touchesRightEdge}
         reserveClosedExplorerToggleSpace={touchesTopEdge && touchesRightEdge}
         reserveCollapsedSidebarHeaderSpace={touchesTopEdge && touchesLeftEdge}
         isTabDragActive={isTabDragActive}
@@ -222,15 +221,16 @@ export default function TabGroupSplitLayout({
           window-drag region at the top. Only the split layout's own panes
           own the resize handles, while this strip keeps the whole top of the
           center column draggable regardless of how the splits are arranged.
-          Why conditional `border-l`: when splits exist, the leftmost pane
-          paints its own `border-l` starting at y=8. Mirroring that border
-          on the drag strip extends the seam up to y=0 so the left-sidebar /
-          center-column line reaches the top of the window, matching the
-          full-height right-sidebar seam. Without splits the pane has no
-          `border-l`, so we skip it here too to avoid a dangling 8px stub. */}
+          Why conditional `border-x`: when splits exist, the outer panes
+          paint their own vertical borders starting at y=8 (see
+          TabGroupPanel). Mirroring those borders on the drag strip extends
+          both seams up to y=0 so the lines between the terminal area and
+          the left/right sidebars reach the top of the window. Without
+          splits the panes have no vertical borders, so we skip them here
+          too to avoid dangling 8px stubs. */}
       <div className="flex flex-col flex-1 min-w-0 min-h-0 overflow-hidden">
         <div
-          className={`h-2 shrink-0 bg-card${hasSplits ? ' border-l border-border' : ''}`}
+          className={`h-2 shrink-0 bg-card${hasSplits ? ' border-x border-border' : ''}`}
           style={{ WebkitAppRegion: 'drag' } as React.CSSProperties}
         />
         <div className="flex flex-1 min-w-0 min-h-0 overflow-hidden">