Use scroll hook

src/pages/Root.js

@@ -4,6 +4,7 @@ import { Link } from "react-router-dom";
 import { NoteCreator } from "../element/NoteCreator";
 import Timeline from "../element/Timeline";
 import { useState } from "react";
+import useScroll from "../useScroll";
 
 const RootTab = {
     Follows: 0,
@@ -13,6 +14,7 @@ const RootTab = {
 export default function RootPage() {
     const [loggedOut, pubKey, follows] = useSelector(s => [s.login.loggedOut, s.login.publicKey, s.login.follows]);
     const [tab, setTab] = useState(RootTab.Follows);
+    const [eop] = useScroll();
 
     function followHints() {
         if (follows?.length === 0 && pubKey) {

src/useScroll.js

@@ -0,0 +1,26 @@
+import { useEffect, useState } from "react";
+
+export default function useScroll() {
+    const [eop, setEop] = useState(false);
+
+    function handleScroll(e) {
+        let target = e.path[1];
+        let y = target.scrollY + target.innerHeight;
+        let h = e.target.scrollingElement.offsetHeight;
+        let padding = 10;
+        let atEnd = y + padding >= h;
+        setEop((s) => {
+            if (s !== atEnd) {
+                return atEnd;
+            }
+            return s;
+        });
+    }
+
+    useEffect(() => {
+        window.addEventListener("scroll", handleScroll, { passive: true });
+        return () => window.removeEventListener("scroll", handleScroll);
+    }, []);
+
+    return [eop];
+}