fix: header stuck on certain threshold (#130)

On some cases if the scroll happens fast and multiples times, it will
get stuck on a threshold and not call the `handleScroll` again, by
cleaning the timeoutId everytime `handleScroll` gets called we ensure
that it will not get stuck if scrolling happens too fast.

Co-authored-by: J M Rossy <jm.rossy@gmail.com>

src/utils/useScrollListener.ts

@@ -11,6 +11,7 @@ export function useScrollThresholdListener(threshold: number, debounce = 300) {
       const handleScroll = () => {
         if (isDebouncing) return;
 
+        timeoutId.current = null;
         if (window.scrollY > threshold && !isAboveThreshold) {
           setIsAbove(true);
           setIsDebouncing(true);
@@ -24,7 +25,6 @@ export function useScrollThresholdListener(threshold: number, debounce = 300) {
         if (!timeoutId.current) {
           timeoutId.current = setTimeout(() => {
             setIsDebouncing(false);
-            timeoutId.current = null;
             handleScroll();
           }, debounce);
         }