import { useI18n } from 'domains/i18n/hooks'
import { useMemo } from 'preact/hooks'
import { useSelector } from 'react-redux'
import { selectError, selectHasError } from './selectors'

export function useInterrupt() {
  const { t } = useI18n()
  const error = useSelector(selectError)
  const hasError = useSelector(selectHasError)

  const meta = useMemo(() => {
    if (!error) {
      return {
        title: undefined,
        message: undefined,
        srText: undefined,
        buttonText: undefined,
        originalError: undefined,
        action: undefined,
      }
    }

    const { langKey, action } = error
    const title = t(`${langKey}.title`)
    const message = t(`${langKey}.message`)
    const srText = t(`${langKey}.srText`)
    const buttonText = action ? t(`${langKey}.buttonText`) : null

    return {
      ...(langKey ? { title, message, srText } : {}),
      ...(action ? { action } : {}),
      ...(action && langKey ? { buttonText } : {}),
      originalError: error,
    }
  }, [error, t])

  return { hasError, meta, error }
}