From aca3cb677b861728a3ab1c3a82289dd018a3a0ca Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Sat, 25 Feb 2023 10:50:02 +0800
Subject: [PATCH] Sometimes need exact distance instead ratio

---
 src/pages/status.jsx   |  2 +-
 src/utils/useScroll.js | 26 ++++++++++++++++----------
 2 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/pages/status.jsx b/src/pages/status.jsx
index 8d3a488e..80439378 100644
--- a/src/pages/status.jsx
+++ b/src/pages/status.jsx
@@ -457,7 +457,7 @@ function StatusPage() {
 
   const { nearReachStart } = useScroll({
     scrollableElement: scrollableRef.current,
-    distanceFromStart: 0.2,
+    distanceFromStartPx: 16,
   });
 
   return (
diff --git a/src/utils/useScroll.js b/src/utils/useScroll.js
index af45ece9..dbbe7c76 100644
--- a/src/utils/useScroll.js
+++ b/src/utils/useScroll.js
@@ -7,6 +7,8 @@ export default function useScroll({
   scrollThresholdStart = 10,
   scrollThresholdEnd = 10,
   direction = 'vertical',
+  distanceFromStartPx: _distanceFromStartPx,
+  distanceFromEndPx: _distanceFromEndPx,
 } = {}) {
   const [scrollDirection, setScrollDirection] = useState(null);
   const [reachStart, setReachStart] = useState(false);
@@ -38,16 +40,20 @@ export default function useScroll({
       const scrollDimension = isVertical ? scrollHeight : scrollWidth;
       const clientDimension = isVertical ? clientHeight : clientWidth;
       const scrollDistance = Math.abs(scrollStart - previousScrollStart);
-      const distanceFromStartPx = Math.min(
-        clientDimension * distanceFromStart,
-        scrollDimension,
-        scrollStart,
-      );
-      const distanceFromEndPx = Math.min(
-        clientDimension * distanceFromEnd,
-        scrollDimension,
-        scrollDimension - scrollStart - clientDimension,
-      );
+      const distanceFromStartPx =
+        _distanceFromStartPx ||
+        Math.min(
+          clientDimension * distanceFromStart,
+          scrollDimension,
+          scrollStart,
+        );
+      const distanceFromEndPx =
+        _distanceFromEndPx ||
+        Math.min(
+          clientDimension * distanceFromEnd,
+          scrollDimension,
+          scrollDimension - scrollStart - clientDimension,
+        );
 
       if (
         scrollDistance >=