Default language will be given according to the browse setting and also can be configured #801 (#823)

### What problem does this PR solve?

Default language will be given according to the browse setting and also
can be configured #801
### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/locales/config.ts

@@ -1,4 +1,5 @@
 import i18n from 'i18next';
+import LanguageDetector from 'i18next-browser-languagedetector';
 import { initReactI18next } from 'react-i18next';
 
 import translation_en from './en';
@@ -11,13 +12,19 @@ const resources = {
   'zh-TRADITIONAL': translation_zh_traditional,
 };
 
-i18n.use(initReactI18next).init({
-  resources,
-  lng: 'en',
-  fallbackLng: 'en',
-  interpolation: {
-    escapeValue: false,
-  },
-});
+i18n
+  .use(initReactI18next)
+  .use(LanguageDetector)
+  .init({
+    detection: {
+      lookupLocalStorage: 'lng',
+    },
+    supportedLngs: ['en', 'zh', 'zh-TRADITIONAL'],
+    resources,
+    fallbackLng: 'en',
+    interpolation: {
+      escapeValue: false,
+    },
+  });
 
 export default i18n;