mirror of
https://github.com/Tria-plc/emaui.git
synced 2026-08-26 19:12:50 +00:00
31c52c02e0
- Added useLocalized hook to provide a stable function for retrieving bilingual values based on the current language. - Updated various components across the portal and backoffice to utilize the new useLocalized hook for consistent bilingual label rendering. - Refactored localized function in licensing.helpers to handle empty Amharic strings correctly. - Enhanced localization handling in LicenseApplicationPage, ProfilePage, and other components to ensure proper language switching.
28 lines
1.3 KiB
TypeScript
28 lines
1.3 KiB
TypeScript
import { useCallback } from 'react';
|
|
import { useTranslation } from 'react-i18next';
|
|
import { localized } from './licensing.helpers';
|
|
import type { Bilingual } from './licensing.types';
|
|
|
|
/**
|
|
* The component-facing bilingual reader — the twin of `useDateDisplayer()`.
|
|
*
|
|
* A hook rather than a bare `localized` import so the calling component is
|
|
* subscribed to i18next: switching language re-renders it and every
|
|
* backend-configured label flips with the rest of the UI. `useTranslation()`
|
|
* with no instance argument resolves to the app's own <I18nextProvider>
|
|
* (portal router.tsx, backoffice AppProviders.tsx), which is what makes this
|
|
* work across two separate i18n instances.
|
|
*
|
|
* DISPLAY ONLY. Code that *matches* on a label — `.includes('nationality')`,
|
|
* the vessel-picker regex in ConfigDrivenSection, the SUBCITY/WOREDA test in
|
|
* AddressFormContent — must keep reading `value.en`, or the match breaks the
|
|
* moment the user switches language.
|
|
*
|
|
* The returned function is stable per language, so it is safe — and required —
|
|
* as a useMemo/useCallback dependency.
|
|
*/
|
|
export function useLocalized(): (value: Bilingual | undefined) => string {
|
|
const { i18n } = useTranslation();
|
|
return useCallback((value) => localized(value, i18n.language), [i18n.language]);
|
|
}
|