import { useMemo } from 'react'

import find from 'lodash/find'

import { langsList, Languages } from 'config/languages'
import { useToggle } from 'hooks/useToggle'

import { useLexicsStore } from 'features/LexicsStore'

export const useLanguageSelect = () => {
  const { changeLang, lang } = useLexicsStore()
  const {
    close,
    isOpen,
    open,
  } = useToggle()

  const handleLangChange = (locale: Languages) => () => {
    changeLang(locale)
    close()
  }

  const selectedLang = useMemo(() => find(langsList, { locale: lang }), [lang])

  return {
    close,
    handleLangChange,
    isOpen,
    open,
    selectedLang,
  }
}
