how to hide button after scrolling to top in react

1function FunctionalComponent() {
2const hasWindow = typeof window !== 'undefined'
3const [opacity, setOpacity] = useState(1)
4
5function handleElementsOnScroll() {
6    window.onscroll = () => {
7      let currentScrollPos = window.pageYOffset
8
9      if (currentScrollPos > 600) {
10        setOpacity(1)
11      } else {
12        setOpacity(0)
13      }
14    }
15  }
16
17  useEffect(() => {
18    if (hasWindow) {
19      handleElementsOnScroll()
20    }
21  }, [hasWindow])
22
23    return (
24        <button
25          className="top-scroll"
26          style={{ opacity }}
27        >
28          <i className="fa fa-arrow-up"></i>
29        </button>
30  )
31}