From e695e15a14c52a1c71c9bf8cc853cfa52d04df58 Mon Sep 17 00:00:00 2001
From: "Red J. Adaya" <red.adaya@gmail.com>
Date: Fri, 15 Dec 2023 22:09:49 +0800
Subject: [PATCH] fix mouse scroll

---
 src/app/workspace/screen/tabs.tsx | 37 +++++++++++++++++++++----------
 1 file changed, 25 insertions(+), 12 deletions(-)

diff --git a/src/app/workspace/screen/tabs.tsx b/src/app/workspace/screen/tabs.tsx
index 6a9033ad6..53b7661e3 100644
--- a/src/app/workspace/screen/tabs.tsx
+++ b/src/app/workspace/screen/tabs.tsx
@@ -31,6 +31,7 @@ class ScreenTabs extends React.Component<{ session: Session }, { showingScreens:
     lastActiveScreenId: string = null;
     dragEndTimeout = null;
     scrollIntoViewTimeout = null;
+    deltaYHistory = [];
 
     constructor(props: any) {
         super(props);
@@ -79,24 +80,36 @@ class ScreenTabs extends React.Component<{ session: Session }, { showingScreens:
         GlobalCommandRunner.switchScreen(screenId);
     }
 
-    // @boundMethod
-    // handleWheel(event: WheelEvent) {
-    //     if (!this.tabsRef.current) return;
+    @boundMethod
+    handleWheel(event: WheelEvent) {
+        if (!this.tabsRef.current) return;
+
+        // Add the current deltaY to the history
+        this.deltaYHistory.push(Math.abs(event.deltaY));
+        if (this.deltaYHistory.length > 5) {
+            this.deltaYHistory.shift(); // Keep only the last 5 entries
+        }
 
-    //     // Prevent the default vertical scrolling
-    //     event.preventDefault();
+        // Check if any of the last 5 deltaY values are greater than a threshold
+        let isMouseWheel = this.deltaYHistory.some((deltaY) => deltaY > 0);
 
-    //     // Scroll horizontally instead
-    //     this.tabsRef.current.scrollLeft += event.deltaY;
-    // }
+        if (isMouseWheel) {
+            // It's likely a mouse wheel event, so handle it for horizontal scrolling
+            this.tabsRef.current.scrollLeft += event.deltaY;
+
+            // Prevent default vertical scroll
+            event.preventDefault();
+        }
+        // For touchpad events, do nothing and let the browser handle it
+    }
 
     componentDidMount(): void {
         this.componentDidUpdate();
 
-        // // Add the wheel event listener to the tabsRef
-        // if (this.tabsRef.current) {
-        //     this.tabsRef.current.addEventListener("wheel", this.handleWheel, { passive: false });
-        // }
+        // Add the wheel event listener to the tabsRef
+        if (this.tabsRef.current) {
+            this.tabsRef.current.addEventListener("wheel", this.handleWheel, { passive: false });
+        }
     }
 
     componentWillUnmount() {