Create global keyboard shortcut handler (#10145)

src/state/modals/index.tsx

@@ -1,6 +1,7 @@
-import {createContext, useContext, useMemo, useState} from 'react'
+import {createContext, useContext, useEffect, useMemo, useState} from 'react'
 
 import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback'
+import {useHotkeysContext} from '#/lib/hotkeys'
 
 export interface UserAddRemoveListsModal {
   name: 'user-add-remove-lists'
@@ -47,6 +48,15 @@ ModalControlContext.displayName = 'ModalControlContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [activeModals, setActiveModals] = useState<Modal[]>([])
+  const {disableScope, enableScope} = useHotkeysContext()
+
+  useEffect(() => {
+    if (activeModals.length > 0) {
+      disableScope('global')
+    } else {
+      enableScope('global')
+    }
+  }, [activeModals.length, disableScope, enableScope])
 
   const openModal = useNonReactiveCallback((modal: Modal) => {
     setActiveModals(modals => [...modals, modal])