From 2192c563a765515904326fe070d820ab2269cc15 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Fri, 10 Mar 2023 14:27:38 +0800
Subject: [PATCH] Do debouncing in scrollWatcher instead of using lodash

---
 .../components/templates/article/Article.tsx  | 19 +------------------
 1 file changed, 1 insertion(+), 18 deletions(-)

diff --git a/packages/web/components/templates/article/Article.tsx b/packages/web/components/templates/article/Article.tsx
index 01dfe3354..fbeb3173f 100644
--- a/packages/web/components/templates/article/Article.tsx
+++ b/packages/web/components/templates/article/Article.tsx
@@ -8,7 +8,6 @@ import { MutableRefObject, useEffect, useMemo, useRef, useState } from 'react'
 import { Tweet } from 'react-twitter-widgets'
 import { render } from 'react-dom'
 import { isDarkTheme } from '../../../lib/themeUpdater'
-import debounce from 'lodash/debounce'
 import { ArticleMutations } from '../../../lib/articleActions'
 
 export type ArticleProps = {
@@ -38,22 +37,6 @@ export function Article(props: ArticleProps): JSX.Element {
 
   useReadingProgressAnchor(articleContentRef, setReadingAnchorIndex)
 
-  const debouncedSetReadingProgress = useMemo(
-    () =>
-      debounce((readingProgress: number) => {
-        setReadingProgress(readingProgress)
-      }, 2000),
-    []
-  )
-
-  // Stop the invocation of the debounced function
-  // after unmounting
-  useEffect(() => {
-    return () => {
-      debouncedSetReadingProgress.cancel()
-    }
-  }, [])
-
   useEffect(() => {
     ;(async () => {
       if (!readingProgress) return
@@ -99,7 +82,7 @@ export function Article(props: ArticleProps): JSX.Element {
         window.scrollY,
         window.document.scrollingElement.scrollHeight
       )
-      debouncedSetReadingProgress(adjustedReadingProgress * 100)
+      setReadingProgress(adjustedReadingProgress * 100)
     }
   }, 2500)