Part 3 - Adding onScroll listener to prepare for the drag feature

Post.js

componentWillUnmount = () => {
  this.removeListeners();
};

addListeners = () => {
  window.addEventListener('scroll', this.onScroll);
};

removeListeners = () => {
  window.removeEventListener('scroll', this.onScroll);
};

onScroll = () => {
  const scrollTop = windowScroll.get('top');
  console.log(scrollTop);
};

onEntered = () => {
  // we add listeners as soon as the transition is complete
  // we don't add them before to avoid them interfering
  // with our post while animating
  this.addListeners();
};

onExit = () => {
  this.removeListeners();

  // we don't want to run this if there is no
  // preview element to transition to.
  if (!this.preview) return;
  
  /* same code */
}

render() {
  /* same code */
  return (
    <CSSTransition
      {...transitionProps}
      onEnter={this.onEnter}
      onEntered={this.onEntered} // add this
      onExit={this.onExit}
      addEndListener={this.onAddEndListener}
      classNames="post"
    >
    /* same code */
  )
}