From cdeef49ec1cc30b8398d1129b470afe751c77817 Mon Sep 17 00:00:00 2001 From: Red Adaya Date: Sun, 24 Dec 2023 15:31:48 +0800 Subject: [PATCH] fix tabs freeze on touchpad scroll --- src/app/workspace/screen/tabs.tsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/src/app/workspace/screen/tabs.tsx b/src/app/workspace/screen/tabs.tsx index ce37091c8..9fc4e8e19 100644 --- a/src/app/workspace/screen/tabs.tsx +++ b/src/app/workspace/screen/tabs.tsx @@ -17,6 +17,7 @@ import { ReactComponent as ActionsIcon } from "../../assets/icons/tab/actions.sv import { ReactComponent as AddIcon } from "../../assets/icons/add.svg"; import * as constants from "../../appconst"; import { Reorder } from "framer-motion"; +import { debounce } from "throttle-debounce"; import { MagicLayout } from "../../magiclayout"; import "../workspace.less"; @@ -86,11 +87,11 @@ class ScreenTabs extends React.Component<{ session: Session }, { showingScreens: // 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 + if (this.deltaYHistory.length > 2) { + this.deltaYHistory.shift(); // Keep only the last 2 entries } - // Check if any of the last 5 deltaY values are greater than a threshold + // Check if any of the last 2 deltaY values are greater than a threshold let isMouseWheel = this.deltaYHistory.some((deltaY) => deltaY > 0); if (isMouseWheel) { @@ -108,7 +109,8 @@ class ScreenTabs extends React.Component<{ session: Session }, { showingScreens: // Add the wheel event listener to the tabsRef if (this.tabsRef.current) { - this.tabsRef.current.addEventListener("wheel", this.handleWheel, { passive: false }); + let handleWheel = debounce(200, this.handleWheel); + this.tabsRef.current.addEventListener("wheel", handleWheel, { passive: false }); } }