diff --git a/src/common/hooks/useLoadI18nMessages.ts b/src/common/hooks/useLoadI18nMessages.ts index 6522d615..6c83944d 100644 --- a/src/common/hooks/useLoadI18nMessages.ts +++ b/src/common/hooks/useLoadI18nMessages.ts @@ -1,6 +1,6 @@ import { loadI18nMessages } from '@common/helpers/locales.helper'; -export const useLoadI18nMessages = (cachedMessages: I18nMessages) => { +export const useLoadI18nMessages = (cachedMessages: I18nMessages, defaultLocale = 'en') => { const getMessages = (locale: string) => { if (cachedMessages?.[locale]) { return cachedMessages?.[locale]; @@ -13,7 +13,7 @@ export const useLoadI18nMessages = (cachedMessages: I18nMessages) => { const messages = await loadI18nMessages(locale); if (messages) { - cachedMessages[locale] = messages; + cachedMessages[locale] = {...cachedMessages[defaultLocale], messages}; } }; diff --git a/src/providers/AsyncIntlProvider.tsx b/src/providers/AsyncIntlProvider.tsx index 283fdb09..4bf76f1b 100644 --- a/src/providers/AsyncIntlProvider.tsx +++ b/src/providers/AsyncIntlProvider.tsx @@ -9,14 +9,16 @@ type AsyncIntlProviderProps = { children: React.ReactNode; }; +const DEFAULT_LOCALE = 'en'; + export const AsyncIntlProvider: FC = ({ cachedMessages, children }) => { const locale = useRecoilValue(state.config.locale); - const { getMessages } = useLoadI18nMessages(cachedMessages); + const { getMessages } = useLoadI18nMessages(cachedMessages, DEFAULT_LOCALE); const i18nMessages = getMessages(locale); return ( - + {children} );