first commit

components/_App/GoTop.js

@@ -0,0 +1,44 @@
+import React from 'react';
+
+const GoTop = ({scrollStepInPx, delayInMs}) => {
+
+    const [thePosition, setThePosition] = React.useState(false);
+    const timeoutRef = React.useRef(null);
+
+    React.useEffect(() => {
+        document.addEventListener("scroll", () => {
+            if (window.scrollY > 170) {
+                setThePosition(true)
+            } else {
+                setThePosition(false);
+            }
+        });
+    }, [])
+    
+    const onScrollStep = () => {
+        if (window.pageYOffset === 0){
+            clearInterval(timeoutRef.current);
+        }
+        window.scroll(0, window.pageYOffset - scrollStepInPx);
+    }
+
+    const scrollToTop = () => {
+        timeoutRef.current = setInterval(onScrollStep, delayInMs);
+    }
+
+    const renderGoTopIcon = () => {
+        return (
+            <div className={`go-top ${thePosition ? 'active' : ''}`} onClick={scrollToTop}>
+                <i className='icofont-hand-drawn-up'></i>
+            </div>
+        )
+    }
+
+    return (
+        <>
+            {renderGoTopIcon()}
+        </>
+    )
+}
+
+export default GoTop;