import { useEffect } from 'react'
// eslint-disable-next-line import/no-named-as-default
import i18n from 'i18next'
import dayjs from 'dayjs'
import { dateLocales } from '@/locales'
import { useStoreState } from '@/store'
import { locale } from 'devextreme/localization'

function useLocale() {
  const cultureName = useStoreState((state) => state.locale.currentLang)
  const languageList = useStoreState((state) => state.abpConfig.config?.localization.languages)
  const twoLetterISOLanguageName = languageList?.find(
    (lang) => lang.cultureName === cultureName,
  )?.twoLetterISOLanguageName

  useEffect(() => {
    if (cultureName !== i18n.language) {
      i18n.changeLanguage(cultureName)
      locale(twoLetterISOLanguageName ?? cultureName)
    }
    if (cultureName && twoLetterISOLanguageName && dateLocales[twoLetterISOLanguageName]) {
      dateLocales[twoLetterISOLanguageName]().then(() => {
        dayjs.locale(cultureName)
      })
    }
  }, [cultureName, twoLetterISOLanguageName])

  return cultureName
}

export default useLocale