Use an event listener on a specific element with React Hooks

useEventListener.js

import { useEffect, useRef } from "react";

export default function useEventListener(event, callback) {
  const element = useRef(null);

  useEffect(() => {
    element.current.addEventListener(event, callback);
    return () => element.current.removeEventListener(event, callback);
  }, []);

  return element;
}