import { useCallback } from 'react'
import { useLocation, useNavigate, useParams } from 'react-router-dom'

import { isVerticalPreviewPath, localiseTo, resolveViewingLocale } from '@/lib/locales'

import type { NavigateFunction, NavigateOptions, To } from 'react-router-dom'

import type { LocaleCode } from '@/lib/locales'


export const useLocale = (): LocaleCode => {
  const { locale } = useParams ()
  const location = useLocation ()
  return resolveViewingLocale (location.pathname, locale)
}


export const useLocaleNavigate = (): NavigateFunction => {
  const navigate = useNavigate ()
  const locale = useLocale ()
  const { pathname } = useLocation ()
  return useCallback ((to: To | number, options?: NavigateOptions) => {
    if (typeof to === 'number')
      navigate (to)
    else
      navigate (localiseTo (to, locale, pathname), options)
  }, [locale, navigate, pathname])
}


export const useVerticalPreview = (): boolean =>
    isVerticalPreviewPath (useLocation ().pathname)