twenty_crm/front/src/modules/hotkeys/hooks/useDirectHotkeys.ts

import { useHotkeys } from 'react-hotkeys-hook';
import {
  Hotkey,
  HotkeyCallback,
  OptionsOrDependencyArray,
} from 'react-hotkeys-hook/dist/types';
import { useRecoilState } from 'recoil';

import { pendingHotkeyState } from '../states/pendingHotkeysState';

export function useDirectHotkeys(
  keys: string,
  callback: HotkeyCallback,
  dependencies?: OptionsOrDependencyArray,
) {
  const [pendingHotkey, setPendingHotkey] = useRecoilState(pendingHotkeyState);

  const callbackIfDirectKey = function (
    keyboardEvent: KeyboardEvent,
    hotkeysEvent: Hotkey,
  ) {
    if (!pendingHotkey) {
      callback(keyboardEvent, hotkeysEvent);
      return;
    }
    setPendingHotkey(null);
  };

  useHotkeys(keys, callbackIfDirectKey, dependencies);
}