title: useEffect to make event handler for own defined event
body: <p>So I am trying to make an event handler hook for a specific event a part of the application is throwing.</p>
  <p>I figured like this</p>
  <pre><code>export const useMyEvent = () =&gt; {
    const myEvent = useRef&lt;SyntheticEvent | null&gt;();
  
    useEffect(
      () =&gt; {
        if (!window || !window.addEventListener || myEvent) return;
        const eventListener = (event: SyntheticEvent) =&gt; myEvent.current(event);
        window.addEventListener('myEvent', eventListener);
  
        return () =&gt; {
          window.removeEventListener('myEvent', eventListener);
        };
      },
      [] // Re-run if eventName or element changes
    );
  }
  
  export default useMyEvent;
  </code></pre>
  <p>However I get an error &quot;Argument of type '&quot;myEvent&quot;' is not assignable to parameter of type 'keyof WindowEventMap'.&quot;</p>
  <p>I guess I have probably made an elementary conceptual mistake here as to how to connect the event to a ref.</p>