refactor(i18n): language setup (#3484)

This commit is contained in:
Alex Yang
2023-07-31 02:21:12 -07:00
committed by GitHub
parent 9567471e7f
commit 452c780d40
2 changed files with 23 additions and 18 deletions

View File

@@ -5,8 +5,9 @@ import { AffineContext } from '@affine/component/context';
import { WorkspaceFallback } from '@affine/component/workspace'; import { WorkspaceFallback } from '@affine/component/workspace';
import { createI18n, setUpLanguage } from '@affine/i18n'; import { createI18n, setUpLanguage } from '@affine/i18n';
import { CacheProvider } from '@emotion/react'; import { CacheProvider } from '@emotion/react';
import { use } from 'foxact/use';
import type { PropsWithChildren, ReactElement } from 'react'; import type { PropsWithChildren, ReactElement } from 'react';
import { lazy, memo, Suspense, useEffect } from 'react'; import { lazy, memo, Suspense } from 'react';
import { RouterProvider } from 'react-router-dom'; import { RouterProvider } from 'react-router-dom';
import { router } from './router'; import { router } from './router';
@@ -32,14 +33,21 @@ const future = {
v7_startTransition: true, v7_startTransition: true,
} as const; } as const;
export const App = memo(function App() { const languageLoadingPromise = new Promise<void>(resolve => {
useEffect(() => { if (environment.isBrowser) {
document.documentElement.lang = i18n.language; document.documentElement.lang = i18n.language;
// todo(himself65): this is a hack, we should use a better way to set the language setUpLanguage(i18n)
setUpLanguage(i18n)?.catch(error => { .then(() => resolve())
console.error(error); .catch(error => {
}); console.error(error);
}, []); });
} else {
resolve();
}
});
export const App = memo(function App() {
use(languageLoadingPromise);
return ( return (
<CacheProvider value={cache}> <CacheProvider value={cache}>
<AffineContext> <AffineContext>

View File

@@ -92,17 +92,14 @@ export const createI18n = () => {
return i18n; return i18n;
}; };
export function setUpLanguage(i: i18n) { export function setUpLanguage(i: i18n) {
if (typeof window !== 'undefined') { let language;
let language; const localStorageLanguage = localStorage.getItem(STORAGE_KEY);
const localStorageLanguage = localStorage.getItem(STORAGE_KEY); if (localStorageLanguage) {
if (localStorageLanguage) { language = standardizeLocale(localStorageLanguage);
language = standardizeLocale(localStorageLanguage); } else {
} else { language = standardizeLocale(navigator.language);
language = standardizeLocale(navigator.language);
}
return i.changeLanguage(language);
} }
return void 0; return i.changeLanguage(language);
} }
// const I18nProvider = I18nextProvider; // const I18nProvider = I18nextProvider;