fix: stabilize minimalShellMode toggling by introducing modified thresholds (supersedes #938) (#942)

* add separate scroll up/down thresholds to prevent rapid state changes

* set `DY_LIMIT_DOWN` to 150

* Use a different scroll dy limit on web/mobile

---------

Co-authored-by: Sehyun Chung <sehyun.chung@icloud.com>

1 files changed, 4 insertions, 6 deletions

diff --git a/src/lib/hooks/useOnMainScroll.ts b/src/lib/hooks/useOnMainScroll.ts
index 12e42aca5..c47da7542 100644
--- a/src/lib/hooks/useOnMainScroll.ts
+++ b/src/lib/hooks/useOnMainScroll.ts
@@ -4,7 +4,8 @@ import {RootStoreModel} from 'state/index'
 import {s} from 'lib/styles'
 import {isDesktopWeb} from 'platform/detection'
 
-const DY_LIMIT = isDesktopWeb ? 30 : 10
+const DY_LIMIT_UP = isDesktopWeb ? 30 : 10
+const DY_LIMIT_DOWN = isDesktopWeb ? 150 : 10
 
 export type OnScrollCb = (
   event: NativeSyntheticEvent<NativeScrollEvent>,
@@ -23,12 +24,9 @@ export function useOnMainScroll(
         const dy = y - (lastY.current || 0)
         lastY.current = y
 
-        if (!store.shell.minimalShellMode && y > 10 && dy > DY_LIMIT) {
+        if (!store.shell.minimalShellMode && dy > DY_LIMIT_DOWN) {
           store.shell.setMinimalShellMode(true)
-        } else if (
-          store.shell.minimalShellMode &&
-          (y <= 10 || dy < DY_LIMIT * -1)
-        ) {
+        } else if (store.shell.minimalShellMode && dy < DY_LIMIT_UP * -1) {
           store.shell.setMinimalShellMode(false)
         }