import type { KeyboardEvent } from 'react'
import { useCallback } from 'react'

import { useToggle } from 'hooks'
import { useScoreStore } from 'features/ToggleScore'

export const useCard = () => {
  const {
    close,
    isOpen,
    open,
  } = useToggle()
  const { isHidden } = useScoreStore()

  const onKeyPress = useCallback((e: KeyboardEvent<HTMLLIElement>) => {
    if (e.key === 'Enter') {
      open()
    }
  }, [open])

  return {
    close,
    isOpen,
    onKeyPress,
    open,
    showScore: isHidden,
  }
}
