Setting multiple Hotkeys per Component breaks the UI permanently (in that browser window)

[tsteffek]

Describe the bug
I've tried setting multiple hotkey for one component, i.e. <Label value="Val1" hotkey="W,R" />. This works sometimes in the Labeling Interface preview. It stops working once you've edited the interface again, but works again after refreshing. Now the real fun part is: if you try to use such an interface via the data manager it doesn't load. Once you've done that, any task in any project opened thereafter in this browser window will not work. Force refresh/new window solves this issue, but only as long as you don't touch the multi-hotkey interface.

To Reproduce

Example Interface & Dummy Data

<View style="display: flex;">
  <Labels name="label" toName="text">
    <Label value="Val1" hotkey="W,R" />
  </Labels>
  <Text name="text" value="$text" granularity="sentence" />
</View>

[{"text": "I'm a dummy text. Sooo... How are you? Good? Good."}]

1. Open/create a project with e.g. the example interface
2. load some dummy data
3. try to open a task
4. observe
5. open a task in another project with a different interface to see that it is now broken as well.

Expected behavior
Unclear whether multiple hotkeys per component should work, but would be great if they did. If they aren't supposed to, they at least shouldn't break everything.

Screenshots
If applicable, add screenshots to help explain your problem.

Environment (please complete the following information):

• OS: Windows 11 64-bit
• Label Studio Version: v2.4.8dev-16 (app.heartex Enterprise)
• Browser:
  • Opera core: 98.0.4759.50
  • Chromium version:112.0.5615.165
    A colleague verified the behavior on her MacBook I don't have more information about.

All Label Studio versions

{
  "release": "2.4.8dev",
  "label-studio-os-package": {
    "version": "1.7.5dev",
    "short_version": "1.7",
    "latest_version_from_pypi": null,
    "latest_version_upload_time": null,
    "current_version_is_outdated": false
  },

  "label-studio-os-backend": {
    "message": "feat: LSDV-4972: Optimize the requests for presigning urls (#4106)",
    "commit": "6b4bc44ee3058d90c26a3a884f57009ab73bb03c",
    "branch": "develop",
    "date": "2023/05/05 14:32:55"
  },

  "label-studio-frontend": {
    "message": "fix: LSDV-4726: DateTime min/max (#1348)",
    "commit": "05e3adedc62c6785fc09ea9f4d46662492d1f57b",
    "branch": "master",
    "date": "2023/05/11 15:51:35"
  },

  "dm2": {
    "message": "feat: LOPS-127: Update frontend SemanticSearch component to leverage v ...",
    "commit": "3c8517ed1fb553b762cbb46c9585d08e487d1a01",
    "branch": "master",
    "date": "2023/05/09 06:52:14"
  },

  "label-studio-converter": {
    "version": "0.0.53"
  },

  "label-studio-enterprise-backend": {
    "message": "fix: LSDV-3925: Making sure unreviewed submitted annotations appear o\u2026 ...",
    "commit": "fda278995082d55689134fa5f14f84b40d236196",
    "date": "2023/05/11 12:09:21",
    "branch": "develop",
    "version": "2.4.8dev-16"
  },

  "label-studio-enterprise-package": {
    "version": "2.4.8dev-16"
  },

  "label-studio-react-app": {
    "message": "feat: LSDV-4835: Add mask to date time inputs for date time picker (#3 ...",
    "commit": "57de30380b4b9e5252a1f4c55522394bf5e671ff",
    "branch": "master",
    "date": "2023/05/11 09:17:21"
  }
}

Additional context
Motivation was to provide our labelers with an alternate hotkey layout so they could switch to a (presumably better) one without breaking their current workflow.

Stack Trace

caught (in promise) TypeError: e.toUpperCase is not a function
  at s (keymaster.js:33:27)
  at t.key.unbind (keymaster.js:182:13)
  at l (Hotkey.ts:147:11)
  at Object.unbindAll (Hotkey.ts:333:7)
  at Object.setupHotKeys (Annotation.js:771:15)
  at be (mobx.module.js:928:19)
  at r (mobx.module.js:915:16)
  at mobx-state-tree.module.js:2593:35
  at J (mobx-state-tree.module.js:2456:16)
  at Object.r (mobx-state-tree.module.js:2483:16)
  at Object.r (store.js:135:9)
  at be (mobx.module.js:928:19)
  at r (mobx.module.js:915:16)
  at mobx-state-tree.module.js:2593:35
  at J (mobx-state-tree.module.js:2456:16)
  at Object.r (mobx-state-tree.module.js:2483:16)
  at LSFWrapper.setAnnotation (lsf-sdk.js:442:10)
  at LSFWrapper.setLSFTask (lsf-sdk.js:352:10)
  at AppStore.js:228:19
  at Generator.next (<anonymous>)
  at mobx-state-tree.module.js:3631:41
  at executeAction (mobx.module.js:928:1)
  at res (mobx.module.js:915:1)
  at runMiddleWares (mobx-state-tree.module.js:2593:22)
  at runWithActionContext (mobx-state-tree.module.js:2456:1)
  at wrap (mobx-state-tree.module.js:3617:1)
  at onFulfilled (mobx-state-tree.module.js:3631:1)