From 97f0d3431c47bd707b02d0db63dbdf66a5de5484 Mon Sep 17 00:00:00 2001 From: Paul Frazee Date: Sun, 2 Jul 2023 15:03:16 -0500 Subject: [PATCH] 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 --- src/lib/hooks/useOnMainScroll.ts | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/src/lib/hooks/useOnMainScroll.ts b/src/lib/hooks/useOnMainScroll.ts index 12e42aca..c47da754 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, @@ -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) }