Shortcuts

Use this library : https://www.npmjs.com/package/hotkeys-js

In the code

Import the package import hotkeys from "hotkeys-js";
Call the function hotkeys with the keys you need


hotkeys("n", function (event, handler) {
  event.preventDefault();
  if (event.type === "keydown") {
    actionToRun();
  }
  hotkeys.unbind("n");
  return false;
});

Put that function in a useEffect with every variable that should be defined before the shortcut use is valid


useEffect(() => {
  if (userEmployeeId && userEmployeeId !== "-1") {
    hotkeys.unbind("n");
    hotkeys("n", function (event, handler) {
      event.preventDefault();
      if (event.type === "keydown") {
        handleSubmit(form.getValues());
      }
      hotkeys.unbind("n");
      return false;
    });
  }
}, [userEmployeeId]);

_ Very important !!! _ If a variable is not set before the hotkeys’s function the variable will never be set so there will be some errors