refactor(i18n): lazy load languages (#8456)

closes AF-1397

packages/frontend/apps/mobile/src/app.tsx

@@ -4,6 +4,7 @@ import { Telemetry } from '@affine/core/components/telemetry';
 import { configureMobileModules } from '@affine/core/mobile/modules';
 import { router } from '@affine/core/mobile/router';
 import { configureCommonModules } from '@affine/core/modules';
+import { I18nProvider } from '@affine/core/modules/i18n';
 import { configureLocalStorageStateStorageImpls } from '@affine/core/modules/storage';
 import { configureIndexedDBUserspaceStorageProvider } from '@affine/core/modules/userspace';
 import { configureBrowserWorkbenchModule } from '@affine/core/modules/workbench';
@@ -11,7 +12,6 @@ import {
   configureBrowserWorkspaceFlavours,
   configureIndexedDBWorkspaceEngineStorageProvider,
 } from '@affine/core/modules/workspace-engine';
-import { createI18n, setUpLanguage } from '@affine/i18n';
 import {
   Framework,
   FrameworkRoot,
@@ -25,15 +25,6 @@ const future = {
   v7_startTransition: true,
 } as const;
 
-async function loadLanguage() {
-  const i18n = createI18n();
-  document.documentElement.lang = i18n.language;
-
-  await setUpLanguage(i18n);
-}
-
-let languageLoadingPromise: Promise<void> | null = null;
-
 const framework = new Framework();
 configureCommonModules(framework);
 configureBrowserWorkbenchModule(framework);
@@ -51,21 +42,19 @@ window.addEventListener('focus', () => {
 frameworkProvider.get(LifecycleService).applicationStart();
 
 export function App() {
-  if (!languageLoadingPromise) {
-    languageLoadingPromise = loadLanguage().catch(console.error);
-  }
-
   return (
     <Suspense>
       <FrameworkRoot framework={frameworkProvider}>
-        <AffineContext store={getCurrentStore()}>
-          <Telemetry />
-          <RouterProvider
-            fallbackElement={<AppFallback />}
-            router={router}
-            future={future}
-          />
-        </AffineContext>
+        <I18nProvider>
+          <AffineContext store={getCurrentStore()}>
+            <Telemetry />
+            <RouterProvider
+              fallbackElement={<AppFallback />}
+              router={router}
+              future={future}
+            />
+          </AffineContext>
+        </I18nProvider>
       </FrameworkRoot>
     </Suspense>
   );