sanity-plugin-media/src/hooks/useKeyPress.ts

This version of `sanity-plugin-media` is for Sanity Studio V3.

import isHotkey from 'is-hotkey'
import {type RefObject, useCallback, useEffect, useRef} from 'react'

const useKeyPress = (hotkey: string, onPress?: () => void): RefObject<boolean> => {
  const keyPressed = useRef(false)

  // If pressed key is our target key then set to true
  const downHandler = useCallback(
    (e: KeyboardEvent) => {
      if (isHotkey(hotkey, e)) {
        keyPressed.current = true
        if (onPress) {
          onPress()
        }
      }
    },
    [hotkey, onPress]
  )

  // If released key is our target key then set to false
  const upHandler = useCallback(() => {
    keyPressed.current = false
  }, [])

  // Add event listeners
  useEffect(() => {
    window.addEventListener('keydown', downHandler)
    window.addEventListener('keyup', upHandler)
    // Remove event listeners on cleanup
    return () => {
      window.removeEventListener('keydown', downHandler)
      window.removeEventListener('keyup', upHandler)
    }
  }, [downHandler, upHandler])

  return keyPressed
}

export default useKeyPress