fix: use preferred language for wiki

plugins/src/expo-file-system-syncadaptor/fix-location-info.ts

@@ -16,8 +16,11 @@ function getInfoTiddlerFields(updateInfoTiddlersCallback: (infos: Array<{ text:
   // Basics
   if (!$tw.browser || typeof window === 'undefined') return infoTiddlerFields;
   const isInTidGi = typeof document !== 'undefined';
-  const workspaceID = window.meta?.()?.workspaceID;
+  const { workspaceID, language } = window.meta?.() ?? {};
   infoTiddlerFields.push({ title: '$:/info/tidgi', text: mapBoolean(isInTidGi) }, { title: '$:/info/tidgi-mobile', text: mapBoolean(isInTidGi) });
+  if (language !== undefined) {
+    infoTiddlerFields.push({ title: '$:/info/browser/language', text: language });
+  }
   if (isInTidGi && workspaceID) {
     infoTiddlerFields.push({ title: '$:/info/tidgi/workspaceID', text: workspaceID });
   }

plugins/src/expo-file-system-syncadaptor/monitorLocationChange.ts

@@ -5,8 +5,5 @@ const setup = () => {
   });
 };
 
-// eslint-disable-next-line no-var
-declare var exports: {
-  startup: typeof setup;
-};
+/* eslint-disable @typescript-eslint/no-unsafe-member-access */
 exports.startup = setup;

plugins/src/expo-file-system-syncadaptor/setLanguage.ts

@@ -0,0 +1,24 @@
+const setLanguage = () => {
+  const { language } = window.meta?.() ?? {};
+  let twLanguage = 'en-GB';
+  switch (language) {
+    case 'en': {
+      twLanguage = 'en-GB';
+      break;
+    }
+    case 'zh': {
+      twLanguage = 'zh-CN';
+      break;
+    }
+    default: {
+      break;
+    }
+  }
+  $tw.wiki.addTiddler({
+    title: '$:/language',
+    text: twLanguage,
+  });
+};
+
+/* eslint-disable @typescript-eslint/no-unsafe-member-access */
+exports.startup = setLanguage;

plugins/src/expo-file-system-syncadaptor/setLanguage.ts.meta

@@ -0,0 +1,3 @@
+module-type: startup
+title: $:/plugins/linonetwo/expo-file-system-syncadaptor/setLanguage.js
+type: application/javascript

src/i18n/index.ts

@@ -15,7 +15,6 @@ export const supportedLanguages = [
 ];
 export const detectedLanguage = getLocales()[0].languageCode;
 void i18n.use(initReactI18next).init({
-  lng: useConfigStore.getState().preferredLanguage ?? detectedLanguage ?? defaultLanguage,
   fallbackLng: 'en',
   resources: {
     en: {
@@ -30,6 +29,12 @@ void i18n.use(initReactI18next).init({
     },
   },
   compatibilityJSON: 'v3',
+  // getState() only have value when it is in dev mode hot reload, will return default value on production, use `subscribe` as below to fix this.
+  lng: useConfigStore.getState().preferredLanguage ?? detectedLanguage ?? defaultLanguage,
+});
+// incase store is not loaded from asyncStorage at this time, we need to subscribe to the store to get the latest value
+useConfigStore.subscribe((state) => {
+  void i18n.changeLanguage(state.preferredLanguage ?? detectedLanguage ?? defaultLanguage);
 });
 
 export { default } from 'i18next';

src/pages/Config/Language.tsx

@@ -21,7 +21,6 @@ export function Language(): JSX.Element {
             // when tap again, set to undefined
             const preferredLanguage = currentLanguage === newValue ? undefined : newValue;
             setConfig({ preferredLanguage });
-            await i18n.changeLanguage(preferredLanguage ?? detectedLanguage ?? defaultLanguage);
           }}
           buttons={supportedLanguages}
         />

src/pages/WikiWebView/WikiViewer.tsx

@@ -61,7 +61,7 @@ export const WikiViewer = ({ wikiWorkspace, webviewSideReceiver, quickLoad }: Wi
   useRequestNativePermissions();
 
   const [loaded, setLoaded] = useState(false);
-  const [rememberLastVisitState] = useConfigStore(state => [state.rememberLastVisitState]);
+  const [rememberLastVisitState, preferredLanguage] = useConfigStore(state => [state.rememberLastVisitState, state.preferredLanguage]);
   /**
    * Register service JSB to be `window.service.xxxService`, for plugin in webView to call.
    */
@@ -146,7 +146,9 @@ export const WikiViewer = ({ wikiWorkspace, webviewSideReceiver, quickLoad }: Wi
           userAgent={FAKE_USER_AGENT}
           // add DOCTYPE at load time to prevent Quirks Mode
           source={{
-            html: `<!doctype html><html lang="en"><head><meta charset="UTF-8" /></head><body><div id="tidgi-mobile-webview-before-loaded-place-holder"/></body></html>`,
+            html: `<!doctype html><html lang="${
+              preferredLanguage ?? 'en'
+            }"><head><meta charset="UTF-8" /></head><body><div id="tidgi-mobile-webview-before-loaded-place-holder"/></body></html>`,
             /**
              * Add baseUrl to fix `SecurityError: Failed to read the 'localStorage' property from 'Window': Access is denied for this document.`
              * @url https://github.com/react-native-webview/react-native-webview/issues/1635#issuecomment-1021425071

src/pages/WikiWebView/getWindowMeta.ts

@@ -1,6 +1,8 @@
+import i18n from 'i18next';
 import { IWikiWorkspace } from '../../store/workspace';
 
 export interface WindowMeta {
+  language?: string;
   workspaceID: string;
 }
 
@@ -11,6 +13,7 @@ export function getWindowMeta(workspace: IWikiWorkspace) {
     window.meta = () => (${
     JSON.stringify({
       workspaceID: workspace.id,
+      language: i18n.language,
     })
   });
   `;