feat: Add useEscapeKeyClose custom hook

This commit introduces a new custom hook, useEscapeKeyClose. The hook registers a document-wide keyboard listener that, for any 'Escape' key event, invokes a callback function passed into the hook. Notably, this provides a standard and reusable solution for closing components or other UI elements in response to a user pressing the 'Escape' key.

src/hooks/useEscapeKeyClose.ts

@@ -0,0 +1,26 @@
+import { useEffect } from 'react';
+
+/**
+ * useEscapeKeyClose
+ *
+ * A custom hook to handle the Escape key press event and trigger a callback.
+ *
+ * @param {() => void} closeCallback - The callback function to execute on Escape key press.
+ */
+const useEscapeKeyClose = (closeCallback: () => void) => {
+    useEffect(() => {
+        const handleKeyDown = (event: KeyboardEvent) => {
+            if (event.key === 'Escape') {
+                closeCallback();
+            }
+        };
+
+        document.addEventListener('keydown', handleKeyDown);
+
+        return () => {
+            document.removeEventListener('keydown', handleKeyDown);
+        };
+    }, [closeCallback]);
+};
+
+export default useEscapeKeyClose;