Replace react-hotkeys-hook with react-hotkeys

ui/src/audioplayer/PlayerToolbar.js

@@ -1,8 +1,8 @@
-import React from 'react'
+import React, { useCallback } from 'react'
 import { useLocation } from 'react-router-dom'
 import { useGetOne } from 'react-admin'
+import { GlobalHotKeys } from 'react-hotkeys'
 import { StarButton, useToggleStar } from '../common'
-import { useHotkeys } from 'react-hotkeys-hook'
 
 const Placeholder = () => <StarButton disabled={true} resource={'song'} />
 
@@ -12,21 +12,20 @@ const Toolbar = ({ id }) => {
   const { data, loading } = useGetOne(resource, id)
   const [toggleStar, toggling] = useToggleStar(resource, data)
 
-  useHotkeys(
-    's',
-    () => {
-      toggleStar()
-    },
-    {},
-    [toggleStar]
-  )
+  const keyMap = { TOGGLE_STAR: 's' }
+  const handlers = {
+    TOGGLE_STAR: useCallback(() => toggleStar(), [toggleStar]),
+  }
 
   return (
-    <StarButton
-      record={data}
-      resource={resource}
-      disabled={loading || toggling}
-    />
+    <>
+      <GlobalHotKeys keyMap={keyMap} handlers={handlers} allowChanges />
+      <StarButton
+        record={data}
+        resource={resource}
+        disabled={loading || toggling}
+      />
+    </>
   )
 }