import { useEffect } from 'react';

const useClickOutside = (ref, handleClickOutside) => {
  useEffect(() => {
    const handleClick = (event) => {
      if (ref.current && !ref.current.contains(event.target)) {
        handleClickOutside();
      }
    };

    const handleEscape = (event) => {
      if (event.key === 'Escape') {
        handleClickOutside();
      }
    };

    document.addEventListener('click', handleClick);
    document.addEventListener('keydown', handleEscape);

    return () => {
      document.removeEventListener('click', handleClick);
      document.removeEventListener('keydown', handleEscape);
    };
  }, [ref, handleClickOutside]);
};

export default useClickOutside;