Add React usage

[devbymak]

No description provided.

[sindresorhus]

I think it would be better to make it more reusable, for better readability. Can you double-check that this is correct?

---

import {useState, useEffect} from 'react';
import devtoolsDetect from 'devtools-detect';

export function useDevToolsStatus() {
	const [isDevToolsOpen, setIsDevToolsOpen] = useState(devtoolsDetect.isOpen);

	useEffect(() => {
		const handleChange = event => {
			setIsDevToolsOpen(event.detail.isOpen);
		};

		window.addEventListener('devtoolschange', handleChange);

		return () => {
			window.removeEventListener('devtoolschange', handleChange);
		};
	}, []);

	return isDevToolsOpen;
}

import {useDevToolsStatus} from './useDevToolsStatus.js';

export default function App() {
	const isDevToolsOpen = useDevToolsStatus();
	return isDevToolsOpen ? 'OPEN' : 'CLOSED';
}

[devbymak]

sure you're right, I tried to explain it more simply, actually the better way is to use it as a custom hook.
your custom hook works correctly.