SafeLine/website/en/components/scroll-to-top-button.js

import { useEffect, useState } from "react";

export default function ScrollToButtonButton() {

    const [hasScrollToTopButton, setHasScrollToTopButton] = useState(false);

    function toggleScrollTopButton() {
        setHasScrollToTopButton(
            document.body.scrollTop > 50 || document.documentElement.scrollTop > 50
        )
    }

    useEffect(() => {
        window.addEventListener('scroll', toggleScrollTopButton);

        return () => {
            window.removeEventListener('scroll', toggleScrollTopButton);

        }
    }, [])

    return (
        <>
            {hasScrollToTopButton && (
                <a href="#" className="scroll-top btn-hover">
                    <i className="lni lni-chevron-up"></i>
                </a>
            )}
        </>
    )
}