From 49d837e0c135438a45a6e22479a23dbdb1b914ff Mon Sep 17 00:00:00 2001
From: Justas Raudonius <10882793+justrau@users.noreply.github.com>
Date: Tue, 6 Jan 2026 18:15:17 +0200
Subject: [PATCH] feat(app): add middle-click to close tabs in review sidebar
 (#7094)

---
 .../app/src/components/session/session-sortable-tab.tsx   | 1 +
 packages/app/src/pages/session.tsx                        | 1 +
 packages/ui/src/components/tabs.tsx                       | 8 ++++++++
 3 files changed, 10 insertions(+)

diff --git a/packages/app/src/components/session/session-sortable-tab.tsx b/packages/app/src/components/session/session-sortable-tab.tsx
index 1e3f83546..595ff9d6f 100644
--- a/packages/app/src/components/session/session-sortable-tab.tsx
+++ b/packages/app/src/components/session/session-sortable-tab.tsx
@@ -39,6 +39,7 @@ export function SortableTab(props: { tab: string; onTabClose: (tab: string) => v
             </Tooltip>
           }
           hideCloseButton
+          onMiddleClick={() => props.onTabClose(props.tab)}
         >
           <Show when={path()}>{(p) => <FileVisual path={p()} />}</Show>
         </Tabs.Trigger>
diff --git a/packages/app/src/pages/session.tsx b/packages/app/src/pages/session.tsx
index a0de9021c..7221ebe86 100644
--- a/packages/app/src/pages/session.tsx
+++ b/packages/app/src/pages/session.tsx
@@ -993,6 +993,7 @@ export default function Page() {
                           </Tooltip>
                         }
                         hideCloseButton
+                        onMiddleClick={() => tabs().close("context")}
                       >
                         <div class="flex items-center gap-2">
                           <SessionContextUsage variant="indicator" />
diff --git a/packages/ui/src/components/tabs.tsx b/packages/ui/src/components/tabs.tsx
index 0a4d5b91a..8c892a6e5 100644
--- a/packages/ui/src/components/tabs.tsx
+++ b/packages/ui/src/components/tabs.tsx
@@ -13,6 +13,7 @@ export interface TabsTriggerProps extends ComponentProps<typeof Kobalte.Trigger>
   }
   hideCloseButton?: boolean
   closeButton?: JSX.Element
+  onMiddleClick?: () => void
 }
 export interface TabsContentProps extends ComponentProps<typeof Kobalte.Content> {}
 
@@ -55,6 +56,7 @@ function TabsTrigger(props: ParentProps<TabsTriggerProps>) {
     "children",
     "closeButton",
     "hideCloseButton",
+    "onMiddleClick",
   ])
   return (
     <div
@@ -63,6 +65,12 @@ function TabsTrigger(props: ParentProps<TabsTriggerProps>) {
         ...(split.classList ?? {}),
         [split.class ?? ""]: !!split.class,
       }}
+      onAuxClick={(e) => {
+        if (e.button === 1 && split.onMiddleClick) {
+          e.preventDefault()
+          split.onMiddleClick()
+        }
+      }}
     >
       <Kobalte.Trigger
         {...rest}