Modal add Esc shortcut

lama_cleaner/app/src/components/Modal.tsx

@@ -1,6 +1,6 @@
 import { XIcon } from '@heroicons/react/outline'
 import React, { ReactNode, useRef } from 'react'
-import { useClickAway } from 'react-use'
+import { useClickAway, useKey } from 'react-use'
 import Button from './Button'
 
 interface ModalProps {
@@ -17,6 +17,10 @@ export default function Modal(props: ModalProps) {
     onClose?.()
   })
 
+  useKey('Escape', onClose, {
+    event: 'keydown',
+  })
+
   return (
     <div
       className={[

lama_cleaner/app/src/components/ShortcutsModal.tsx

@@ -31,8 +31,8 @@ export default function ShortcutsModal(props: ShortcutsModalProps) {
           <ShortCut content="Enable multi-stroke mask drawing">
             <p>Hold Cmd/Ctrl</p>
           </ShortCut>
-          <ShortCut content="Enable panning">
-            <p>Hold Space</p>
+          <ShortCut content="Pan">
+            <p>Space & Drag</p>
           </ShortCut>
           <ShortCut content="View original image">
             <p>Hold Tab</p>