You can use this gift to easily create a toggle system.

app.js

function useToggle(event = 'click') {

	let ref = React.useRef();

	function close() {
		// console.log('call close')
		if(ref.current){
			ref.current.style.display = "none";
		}
		document.removeEventListener(event, close);
	}

	function onClick() {
		ref.current.style.display = "";
		document.addEventListener(event, close);
	}

	React.useLayoutEffect(function () {
		ref.current.style.display = 'none';
	}, []);

	return [ref, onClick];
}

function Component() {

	let [ref, onClick] = useToggle();

	return (
		<div>
			<span onClick={onClick} >toggle</span>
			<div ref={ref} >content</div>
		</div>
	)
}