useEventListener

[FrankChinedu]

import { useRef, useEffect } from 'react'

interface IEventProps { eventType: keyof GlobalEventHandlersEventMap listener: Function, target: Window | Document, options?: boolean | AddEventListenerOptions | undefined }

const useEventListener = ({ eventType = 'scroll', listener = () => null, target = window, options = undefined }: IEventProps) => { const savedListener = useRef<Function>();

useEffect(() => { savedListener.current = listener; }, [listener]);

useEffect(() => { if (!target?.addEventListener) return;

const eventListener = (event: any) => savedListener?.current?.(event);

target?.addEventListener?.(eventType, eventListener, options);

return () => {
  target?.removeEventListener(eventType, eventListener, options);
};

}, [eventType, target, options]); };

export default useEventListener;