(answer-website) branch main updated: fix: match browser default language error (#291)

[shuai]

This is an automated email from the ASF dual-hosted git repository.

shuai pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/answer-website.git


The following commit(s) were added to refs/heads/main by this push:
     new b945c45c4 fix: match browser default language error (#291)
b945c45c4 is described below

commit b945c45c40e4d6e73578aa2c03d4864d8ef10792
Author: Luffy <5...@qq52o.cn>
AuthorDate: Thu Jan 16 15:12:34 2025 +0800

    fix: match browser default language error (#291)
    
    close #290
---
 src/theme/Layout/BrowserLanguage.tsx | 57 +++++++++++++-----------------------
 src/theme/Layout/index.tsx           |  4 +--
 2 files changed, 23 insertions(+), 38 deletions(-)

diff --git a/src/theme/Layout/BrowserLanguage.tsx 
b/src/theme/Layout/BrowserLanguage.tsx
index 631bc987e..6e36c3c3b 100644
--- a/src/theme/Layout/BrowserLanguage.tsx
+++ b/src/theme/Layout/BrowserLanguage.tsx
@@ -1,4 +1,4 @@
-import React, {useEffect} from 'react';
+import { useEffect } from 'react';
 import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 
 const LANGUAGE_PREFERENCE_KEY = '_lang_browser_';
@@ -6,52 +6,37 @@ const LANGUAGE_PREFERENCE_KEY = '_lang_browser_';
 export default function BrowserLanguageRedirect() {
   const {
     siteConfig: {
-      i18n: {defaultLocale, locales},
+      i18n: { defaultLocale },
     },
   } = useDocusaurusContext();
 
   useEffect(() => {
-    window.addEventListener('languagechange', () => {
-      localStorage.setItem(LANGUAGE_PREFERENCE_KEY, navigator.language);
-    })
-
     const currentPath = window.location.pathname;
     const storageLocale = localStorage.getItem('_lang_user_') || 
localStorage.getItem(LANGUAGE_PREFERENCE_KEY);
-    const storageLocaleIsDefault = storageLocale === defaultLocale;
-
-    if (storageLocale) {
-      if (storageLocaleIsDefault) {
-        if (currentPath === '/') return;
-        return;
-      } else {
-        if (currentPath.startsWith(`/${storageLocale}`)) {
-          return;
-        } else {
-          window.location.pathname = `/${storageLocale}${currentPath}`;
-          return;
-        }
+
+    const isZhCN = navigator.language.toLowerCase() === 'zh-cn';
+    const isStoredZhCN = storageLocale === 'zh-CN';
+
+    if ((isZhCN || isStoredZhCN) && !currentPath.startsWith('/zh-CN')) {
+      if (isZhCN) {
+        localStorage.setItem(LANGUAGE_PREFERENCE_KEY, 'zh-CN');
       }
-    } else {
-      const browserLanguage = navigator.language.toLowerCase();
-      const matchedLocale = locales.find(locale =>
-        browserLanguage === locale.toLowerCase() ||
-        browserLanguage.startsWith(locale.toLowerCase() + '-')
-      );
-      if (matchedLocale) {
-        localStorage.setItem(LANGUAGE_PREFERENCE_KEY, matchedLocale);
-        window.location.pathname = `/${matchedLocale}${currentPath}`;
-      } else {
-        window.location.pathname = currentPath;
+      if (isStoredZhCN || storageLocale === null) {
+        window.location.pathname = `/zh-CN${currentPath}`;
       }
     }
 
-    // remove the event listener
+    const handleLanguageChange = () => {
+      if (navigator.language.toLowerCase() === 'zh-cn') {
+        localStorage.setItem(LANGUAGE_PREFERENCE_KEY, 'zh-CN');
+      }
+    };
+    window.addEventListener('languagechange', handleLanguageChange);
+
     return () => {
-      window.removeEventListener('languagechange', () => {
-        localStorage.setItem(LANGUAGE_PREFERENCE_KEY, navigator.language);
-      })
-    }
-  }, []);
+      window.removeEventListener('languagechange', handleLanguageChange);
+    };
+  }, [defaultLocale]);
 
   return null;
 }
diff --git a/src/theme/Layout/index.tsx b/src/theme/Layout/index.tsx
index 927bf0ab5..ad7de5c10 100644
--- a/src/theme/Layout/index.tsx
+++ b/src/theme/Layout/index.tsx
@@ -23,7 +23,7 @@ import LayoutProvider from '@theme/Layout/Provider';
 import ErrorPageContent from '@theme/ErrorPageContent';
 import type {Props} from '@theme/Layout';
 import mixpanel from 'mixpanel-browser';
-// import BrowserLanguage from './BrowserLanguage';
+import BrowserLanguage from './BrowserLanguage';
 
 import styles from './styles.module.css';
 
@@ -58,7 +58,7 @@ export default function Layout(props: Props): JSX.Element {
       <AnnouncementBar />
 
       <Navbar />
-      {/* <BrowserLanguage /> */}
+      <BrowserLanguage />
 
       <div
         id={SkipToContentFallbackId}