useTranslation() — ui Function Reference

Architecture documentation for the useTranslation() function in language-selector.tsx from the ui codebase.

Function tsx Internationalization Dictionary calls 1

Entity Profile

Internationalization→ Dictionary→ useTranslation() — ui Function Reference

Dependency Diagram

graph TD
  d523dfc2_11fd_0a87_1b8f_5085366e9971["useTranslation()"]
  0196e53a_5d8c_e12e_d1db_960c6e31ec4a["language-selector.tsx"]
  d523dfc2_11fd_0a87_1b8f_5085366e9971 -->|defined in| 0196e53a_5d8c_e12e_d1db_960c6e31ec4a
  f833e020_a3e8_cda4_8ca5_3ddb92dc3f40["useLanguageContext()"]
  d523dfc2_11fd_0a87_1b8f_5085366e9971 -->|calls| f833e020_a3e8_cda4_8ca5_3ddb92dc3f40
  style d523dfc2_11fd_0a87_1b8f_5085366e9971 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/components/language-selector.tsx lines 66–79

export function useTranslation<T extends Record<string, string>>(
  translations: Translations<T>,
  defaultLanguage: Language = "ar"
) {
  const context = useLanguageContext()
  const [localLanguage, setLocalLanguage] =
    React.useState<Language>(defaultLanguage)

  const language = context?.language ?? localLanguage
  const setLanguage = context?.setLanguage ?? setLocalLanguage

  const { dir, locale, values: t } = translations[language]
  return { language, setLanguage, dir, locale, t }
}