event handler outside element

useOutsideAlerter.js

function useOutsideAlerter(ref, eventType, callback, childSelector) {
    useEffect(() => {
        function handler(event) {
            if (!ref.current) return;

            const clickedOutside = childSelector
                ? !Array.from(ref.current.querySelectorAll(childSelector)).some(
                      (node) => node.contains(event.target),
                  )
                : !ref.current.contains(event.target);

            if (clickedOutside) {
                console.log(ref.current);
                console.log("clicked outside");
                callback(event);
            }
        }

        if (Array.isArray(eventType)) {
            eventType.forEach((type) => {
                document.addEventListener(type, handler);
            });
        } else {
            document.addEventListener(eventType, handler);
        }

        return () => {
            if (Array.isArray(eventType)) {
                eventType.forEach((type) => {
                    document.removeEventListener(type, handler);
                });
            } else {
                document.removeEventListener(eventType, handler);
            }
        };
    }, [ref]);
}