From cf93aae3ce5cc37a3b3f9f39f800db5530524c3b Mon Sep 17 00:00:00 2001
From: reussio <84527857+reussio@users.noreply.github.com>
Date: Fri, 26 Jun 2026 09:37:01 +0200
Subject: [PATCH] fix: close tabs on middle-click over close overlay

The tab close affordance uses a wider hover overlay than the visible icon. That overlay intercepted middle-click mouseup events before they reach the tab label, so middle-click close sotpped working on the right side of the tab.
---
 .../RequestTab/GradientCloseButton/index.js   | 21 ++++++++++++++++++-
 1 file changed, 20 insertions(+), 1 deletion(-)

diff --git a/packages/bruno-app/src/components/RequestTabs/RequestTab/GradientCloseButton/index.js b/packages/bruno-app/src/components/RequestTabs/RequestTab/GradientCloseButton/index.js
index c5a61b33f5f..6ce4e8a9ba5 100644
--- a/packages/bruno-app/src/components/RequestTabs/RequestTab/GradientCloseButton/index.js
+++ b/packages/bruno-app/src/components/RequestTabs/RequestTab/GradientCloseButton/index.js
@@ -4,8 +4,27 @@ import DraftTabIcon from '../DraftTabIcon';
 import StyledWrapper from './StyledWrapper';
 
 const GradientCloseButton = ({ onClick, hasChanges = false }) => {
+  // Prevent the browser's autoscroll (triggered on middle-button mousedown)
+  const handleMouseDown = (e) => {
+    if (e.button === 1) {
+      e.preventDefault();
+    }
+  };
+
+  const handleMouseUp = (e) => {
+    if (e.button === 1) {
+      e.preventDefault();
+      e.stopPropagation();
+      onClick?.(e);
+    }
+  };
+
   return (
-    <StyledWrapper className={`close-gradient ${hasChanges ? 'has-changes' : ''}`}>
+    <StyledWrapper
+      className={`close-gradient ${hasChanges ? 'has-changes' : ''}`}
+      onMouseDown={handleMouseDown}
+      onMouseUp={handleMouseUp}
+    >
       <div className="close-icon-container" onClick={onClick} data-testid="request-tab-close-icon">
         <span className="draft-icon-wrapper" data-testid="tab-draft-icon">
           <DraftTabIcon />