From 1bf8616957cef6185637c66c4458b7340f546be6 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Thu, 29 Feb 2024 21:01:31 +0800
Subject: [PATCH] Auto-scroll to selected author

---
 src/pages/catchup.jsx | 31 +++++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)

diff --git a/src/pages/catchup.jsx b/src/pages/catchup.jsx
index 1175976..ff9df7c 100644
--- a/src/pages/catchup.jsx
+++ b/src/pages/catchup.jsx
@@ -515,6 +515,36 @@ function Catchup() {
     authors,
   ]);
 
+  const prevSelectedAuthorMissing = useRef(false);
+  useEffect(() => {
+    console.log({
+      prevSelectedAuthorMissing,
+      selectedAuthor,
+      authors,
+    });
+    let timer;
+    if (selectedAuthor) {
+      if (authors[selectedAuthor]) {
+        if (prevSelectedAuthorMissing.current) {
+          timer = setTimeout(() => {
+            authorsListParent.current
+              .querySelector(`[data-author="${selectedAuthor}"]`)
+              ?.scrollIntoView({
+                behavior: 'smooth',
+                inline: 'center',
+              });
+          }, 500);
+          prevSelectedAuthorMissing.current = false;
+        }
+      } else {
+        prevSelectedAuthorMissing.current = true;
+      }
+    }
+    return () => {
+      clearTimeout(timer);
+    };
+  }, [selectedAuthor, authors]);
+
   return (
     <div
       ref={scrollableRef}
@@ -907,6 +937,7 @@ function Catchup() {
                   {authorCountsList.map((author) => (
                     <label
                       class="filter-author"
+                      data-author={author}
                       key={`${author}-${authorCounts[author]}`}
                       // Preact messed up the order sometimes, need additional key besides just `author`
                       // https://github.com/preactjs/preact/issues/2849