diff --git a/examples/next-app/locales/client.ts b/examples/next-app/locales/client.ts index 45bbb32..33b7f62 100644 --- a/examples/next-app/locales/client.ts +++ b/examples/next-app/locales/client.ts @@ -4,14 +4,8 @@ import { createI18nClient } from 'next-international/client'; export const { useI18n, useScopedI18n, I18nProviderClient, useChangeLocale, defineLocale, useCurrentLocale } = createI18nClient( { - en: async () => { - await new Promise(resolve => setTimeout(resolve, 100)); - return import('./en'); - }, - fr: async () => { - await new Promise(resolve => setTimeout(resolve, 100)); - return import('./fr'); - }, + en: () => import('./en'), + fr: () => import('./fr'), }, { // Uncomment to set base path diff --git a/packages/next-international/src/app/client/create-i18n-provider-client.tsx b/packages/next-international/src/app/client/create-i18n-provider-client.tsx index 462fbed..bc6478c 100644 --- a/packages/next-international/src/app/client/create-i18n-provider-client.tsx +++ b/packages/next-international/src/app/client/create-i18n-provider-client.tsx @@ -12,6 +12,8 @@ type I18nProviderWrapperProps = { locale: string; fallback?: ReactNode; children: ReactNode; + + importLocale: Promise>; }; export const localesCache = new Map>(); @@ -21,21 +23,9 @@ export function createI18nProviderClient( locales: ImportedLocales, fallbackLocale?: Record, ) { - function I18nProvider({ locale, children }: I18nProviderProps) { - let clientLocale: any = localesCache.get(locale); - - if (!clientLocale) { - const newLocale = locales[locale as keyof typeof locales]; - - if (!newLocale) { - error(`The locale '${locale}' is not supported. Defined locales are: [${Object.keys(locales).join(', ')}].`); - notFound(); - } - - clientLocale = use(newLocale()).default; - localesCache.set(locale, clientLocale); - } - + function I18nProvider({ locale, importLocale, children }: I18nProviderProps) { + const clientLocale = use(importLocale).default as Record; + localesCache.set(locale, clientLocale); const value = useMemo( () => ({ localeContent: flattenLocale(clientLocale), @@ -49,9 +39,17 @@ export function createI18nProviderClient( } return function I18nProviderWrapper({ locale, fallback, children }: I18nProviderWrapperProps) { + const importFnLocale = locales[locale as keyof typeof locales]; + if (!importFnLocale) { + error(`The locale '${locale}' is not supported. Defined locales are: [${Object.keys(locales).join(', ')}].`); + notFound(); + } + return ( - {children} + + {children} + ); };