An High-ordered component for detect when the user is at the top of the page

Hoc.js

export const withTopDetector = Component => {
  return class extends React.Component {
    state = {
      isAtTop: true
    };

    componentDidMount() {
      window.addEventListener("scroll", this.onScrollListener);
    }

    componentWillUnmount() {
      window.removeEventListener("scroll", this.onScrollListener);
    }

    onScrollListener = () => {
      const winScroll = document.body.scrollTop || document.documentElement.scrollTop;

      const height = document.documentElement.scrollHeight - document.documentElement.clientHeight;

      const scrolled = winScroll / height;

      this.setState({ isAtTop: scrolled === 0 });
    };

    render() {
      const { isAtTop } = this.state;

      return (
        <Component
          isAtTop={isAtTop}
        />
      )
    }
  }
};