BlueprintJS Hotkeys hook

useGlobalHotkeys.ts

import { ReactElement, useEffect } from "react";
import {
  HotkeyScope,
  HotkeysEvents,
} from "@blueprintjs/core/lib/esnext/components/hotkeys/hotkeysEvents";
import { IHotkeysProps } from "@blueprintjs/core";

export function useGlobalHotkeys(renderHotkeys: () => ReactElement<IHotkeysProps>) {
  useEffect(() => {
    const e = new HotkeysEvents(HotkeyScope.GLOBAL)
    document.addEventListener("keydown", e.handleKeyDown)
    document.addEventListener("keyup", e.handleKeyUp)
    e.setHotkeys(renderHotkeys().props)


    return () => {
      document.removeEventListener("keydown", e.handleKeyDown)
      document.removeEventListener("keyup", e.handleKeyUp)

      e.clear()
    }
  })
}