From ad1d1e3b592b106b3cea4703d19bab041a9d48db Mon Sep 17 00:00:00 2001
From: Xiao Yijun <xiaoyijun@silverhand.io>
Date: Mon, 26 Sep 2022 17:54:17 +0800
Subject: [PATCH] Revert "feat(console): auto detect language setting (#1941)"
 (#2004)

This reverts commit 49b430394dc961451a6abca26a95ebba8d22f68c.
---
 .../components/LanguagesForm.tsx              | 56 ++++++++++++-------
 .../components/index.module.scss              |  6 --
 .../src/pages/SignInExperience/types.ts       | 13 ++++-
 .../src/pages/SignInExperience/utilities.ts   | 23 +++++++-
 .../translation/admin-console/sign-in-exp.ts  | 16 +++---
 .../translation/admin-console/sign-in-exp.ts  | 16 +++---
 .../translation/admin-console/sign-in-exp.ts  | 15 ++---
 .../translation/admin-console/sign-in-exp.ts  | 15 ++---
 .../translation/admin-console/sign-in-exp.ts  | 16 +++---
 .../translation/admin-console/sign-in-exp.ts  | 15 ++---
 10 files changed, 108 insertions(+), 83 deletions(-)

diff --git a/packages/console/src/pages/SignInExperience/components/LanguagesForm.tsx b/packages/console/src/pages/SignInExperience/components/LanguagesForm.tsx
index 988f11af0..3f87fc376 100644
--- a/packages/console/src/pages/SignInExperience/components/LanguagesForm.tsx
+++ b/packages/console/src/pages/SignInExperience/components/LanguagesForm.tsx
@@ -3,40 +3,58 @@ import { Controller, useFormContext } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 
 import FormField from '@/components/FormField';
+import RadioGroup, { Radio } from '@/components/RadioGroup';
 import Select from '@/components/Select';
-import Switch from '@/components/Switch';
 
-import { SignInExperienceForm } from '../types';
+import { LanguageMode, SignInExperienceForm } from '../types';
 import * as styles from './index.module.scss';
 
 const LanguagesForm = () => {
   const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
-  const { watch, control, register } = useFormContext<SignInExperienceForm>();
-  const isAutoDetect = watch('languageInfo.autoDetect');
+  const { watch, control } = useFormContext<SignInExperienceForm>();
+  const mode = watch('languageInfo.mode');
 
   return (
     <>
       <div className={styles.title}>{t('sign_in_exp.others.languages.title')}</div>
-      <FormField title="sign_in_exp.others.languages.enable_auto_detect">
-        <Switch
-          {...register('languageInfo.autoDetect')}
-          label={t('sign_in_exp.others.languages.description')}
-        />
-      </FormField>
-      <FormField title="sign_in_exp.others.languages.default_language">
+      <FormField title="sign_in_exp.others.languages.mode">
         <Controller
-          name="languageInfo.fallbackLanguage"
+          name="languageInfo.mode"
           control={control}
-          render={({ field: { value, onChange } }) => (
-            <Select value={value} options={languageOptions} onChange={onChange} />
+          defaultValue={LanguageMode.Auto}
+          render={({ field: { onChange, value, name } }) => (
+            <RadioGroup value={value} name={name} onChange={onChange}>
+              <Radio value={LanguageMode.Auto} title="sign_in_exp.others.languages.auto" />
+              <Radio value={LanguageMode.Fixed} title="sign_in_exp.others.languages.fixed" />
+            </RadioGroup>
           )}
         />
-        <div className={styles.defaultLanguageDescription}>
-          {isAutoDetect
-            ? t('sign_in_exp.others.languages.default_language_description_auto')
-            : t('sign_in_exp.others.languages.default_language_description_fixed')}
-        </div>
       </FormField>
+      {mode === LanguageMode.Auto && (
+        <FormField
+          title="sign_in_exp.others.languages.fallback_language"
+          tooltip="sign_in_exp.others.languages.fallback_language_tip"
+        >
+          <Controller
+            name="languageInfo.fallbackLanguage"
+            control={control}
+            render={({ field: { value, onChange } }) => (
+              <Select value={value} options={languageOptions} onChange={onChange} />
+            )}
+          />
+        </FormField>
+      )}
+      {mode === LanguageMode.Fixed && (
+        <FormField title="sign_in_exp.others.languages.fixed_language">
+          <Controller
+            name="languageInfo.fixedLanguage"
+            control={control}
+            render={({ field: { value, onChange } }) => (
+              <Select value={value} options={languageOptions} onChange={onChange} />
+            )}
+          />
+        </FormField>
+      )}
     </>
   );
 };
diff --git a/packages/console/src/pages/SignInExperience/components/index.module.scss b/packages/console/src/pages/SignInExperience/components/index.module.scss
index 3ae7cd2b6..f99640e6d 100644
--- a/packages/console/src/pages/SignInExperience/components/index.module.scss
+++ b/packages/console/src/pages/SignInExperience/components/index.module.scss
@@ -28,9 +28,3 @@
   font: var(--font-body-medium);
   color: var(--color-caption);
 }
-
-.defaultLanguageDescription {
-  padding-top: _.unit(2);
-  font: var(--font-body-medium);
-  color: var(--color-caption);
-}
diff --git a/packages/console/src/pages/SignInExperience/types.ts b/packages/console/src/pages/SignInExperience/types.ts
index 87ddd9819..660aa00c2 100644
--- a/packages/console/src/pages/SignInExperience/types.ts
+++ b/packages/console/src/pages/SignInExperience/types.ts
@@ -1,6 +1,12 @@
+import { LanguageKey } from '@logto/core-kit';
 import { SignInExperience, SignInMethodKey } from '@logto/schemas';
 
-export type SignInExperienceForm = Omit<SignInExperience, 'signInMethods'> & {
+export enum LanguageMode {
+  Auto = 'Auto',
+  Fixed = 'Fixed',
+}
+
+export type SignInExperienceForm = Omit<SignInExperience, 'signInMethods' | 'languageInfo'> & {
   signInMethods: {
     primary?: SignInMethodKey;
     enableSecondary: boolean;
@@ -9,5 +15,10 @@ export type SignInExperienceForm = Omit<SignInExperience, 'signInMethods'> & {
     email: boolean;
     social: boolean;
   };
+  languageInfo: {
+    mode: LanguageMode;
+    fixedLanguage: LanguageKey;
+    fallbackLanguage: LanguageKey;
+  };
   createAccountEnabled: boolean;
 };
diff --git a/packages/console/src/pages/SignInExperience/utilities.ts b/packages/console/src/pages/SignInExperience/utilities.ts
index a8b530faf..9edb0539e 100644
--- a/packages/console/src/pages/SignInExperience/utilities.ts
+++ b/packages/console/src/pages/SignInExperience/utilities.ts
@@ -7,7 +7,7 @@ import {
 } from '@logto/schemas';
 import { conditional } from '@silverhand/essentials';
 
-import { SignInExperienceForm } from './types';
+import { LanguageMode, SignInExperienceForm } from './types';
 
 const findMethodState = (
   setup: SignInExperienceForm,
@@ -40,7 +40,10 @@ export const signInExperienceParser = {
       (key) => signInExperience.signInMethods[key] === SignInMethodState.Secondary
     );
 
-    const { signInMode } = signInExperience;
+    const {
+      languageInfo: { autoDetect, fallbackLanguage, fixedLanguage },
+      signInMode,
+    } = signInExperience;
 
     return {
       ...signInExperience,
@@ -52,11 +55,20 @@ export const signInExperienceParser = {
         email: secondaryMethods.includes(SignInMethodKey.Email),
         social: secondaryMethods.includes(SignInMethodKey.Social),
       },
+      languageInfo: {
+        mode: autoDetect ? LanguageMode.Auto : LanguageMode.Fixed,
+        fallbackLanguage,
+        fixedLanguage,
+      },
       createAccountEnabled: signInMode !== SignInMode.SignIn,
     };
   },
   toRemoteModel: (setup: SignInExperienceForm): SignInExperience => {
-    const { branding, createAccountEnabled } = setup;
+    const {
+      branding,
+      languageInfo: { mode, fallbackLanguage, fixedLanguage },
+      createAccountEnabled,
+    } = setup;
 
     return {
       ...setup,
@@ -72,6 +84,11 @@ export const signInExperienceParser = {
         email: findMethodState(setup, 'email'),
         social: findMethodState(setup, 'social'),
       },
+      languageInfo: {
+        autoDetect: mode === LanguageMode.Auto,
+        fallbackLanguage,
+        fixedLanguage,
+      },
       signInMode: createAccountEnabled ? SignInMode.SignInAndRegister : SignInMode.SignIn,
     };
   },
diff --git a/packages/phrases/src/locales/en/translation/admin-console/sign-in-exp.ts b/packages/phrases/src/locales/en/translation/admin-console/sign-in-exp.ts
index d2d7b33a3..c74b65daf 100644
--- a/packages/phrases/src/locales/en/translation/admin-console/sign-in-exp.ts
+++ b/packages/phrases/src/locales/en/translation/admin-console/sign-in-exp.ts
@@ -71,15 +71,13 @@ const sign_in_exp = {
     },
     languages: {
       title: 'LANGUAGES',
-      enable_auto_detect: 'Enable auto detect',
-      description:
-        "Your software detects the user's location and switches to the local language. You can add new locales by translating UI from English to another language.",
-      manage_language: 'Manage language',
-      default_language: 'Default language',
-      default_language_description_auto:
-        'The default language will be used when a text segment is missing translation.',
-      default_language_description_fixed:
-        'When auto detect is off, the default language is the only language your software will show. Turn on auto detect for language customization.',
+      mode: 'Language mode',
+      auto: 'Auto',
+      fixed: 'Fixed',
+      fallback_language: 'Fallback language',
+      fallback_language_tip:
+        'Which language to fall back if Logto finds no proper language phrase-set.',
+      fixed_language: 'Fixed language',
     },
     authentication: {
       title: 'AUTHENTICATION',
diff --git a/packages/phrases/src/locales/fr/translation/admin-console/sign-in-exp.ts b/packages/phrases/src/locales/fr/translation/admin-console/sign-in-exp.ts
index 41d4a3a51..7fa72b51b 100644
--- a/packages/phrases/src/locales/fr/translation/admin-console/sign-in-exp.ts
+++ b/packages/phrases/src/locales/fr/translation/admin-console/sign-in-exp.ts
@@ -73,15 +73,13 @@ const sign_in_exp = {
     },
     languages: {
       title: 'LANGAGES',
-      enable_auto_detect: 'Enable auto detect', // UNTRANSLATED
-      description:
-        "Your software detects the user's location and switches to the local language. You can add new locales by translating UI from English to another language.", // UNTRANSLATED
-      manage_language: 'Manage language', // UNTRANSLATED
-      default_language: 'Default language', // UNTRANSLATED
-      default_language_description_auto:
-        'The default language will be used when a text segment is missing translation.', // UNTRANSLATED
-      default_language_description_fixed:
-        'When auto detect is off, the default language is the only language your software will show. Turn on auto detect for language customization.', // UNTRANSLATED
+      mode: 'Mode langue',
+      auto: 'Auto',
+      fixed: 'Fixé',
+      fallback_language: 'Langage par défaut',
+      fallback_language_tip:
+        'La langue de repli si Logto ne trouve pas de jeu de phrases dans la langue appropriée.',
+      fixed_language: 'Langue fixe',
     },
     authentication: {
       title: 'AUTHENTICATION',
diff --git a/packages/phrases/src/locales/ko-kr/translation/admin-console/sign-in-exp.ts b/packages/phrases/src/locales/ko-kr/translation/admin-console/sign-in-exp.ts
index 966b0212c..48620bae7 100644
--- a/packages/phrases/src/locales/ko-kr/translation/admin-console/sign-in-exp.ts
+++ b/packages/phrases/src/locales/ko-kr/translation/admin-console/sign-in-exp.ts
@@ -68,15 +68,12 @@ const sign_in_exp = {
     },
     languages: {
       title: '언어',
-      enable_auto_detect: 'Enable auto detect', // UNTRANSLATED
-      description:
-        "Your software detects the user's location and switches to the local language. You can add new locales by translating UI from English to another language.", // UNTRANSLATED
-      manage_language: 'Manage language', // UNTRANSLATED
-      default_language: 'Default language', // UNTRANSLATED
-      default_language_description_auto:
-        'The default language will be used when a text segment is missing translation.', // UNTRANSLATED
-      default_language_description_fixed:
-        'When auto detect is off, the default language is the only language your software will show. Turn on auto detect for language customization.', // UNTRANSLATED
+      mode: '언어 모드',
+      auto: '자동',
+      fixed: '고정',
+      fallback_language: '백업 언어',
+      fallback_language_tip: '적절한 언어를 찾을 수 없을 때 백업 언어를 사용해요.',
+      fixed_language: '언어 고정',
     },
     authentication: {
       title: 'AUTHENTICATION',
diff --git a/packages/phrases/src/locales/pt-pt/translation/admin-console/sign-in-exp.ts b/packages/phrases/src/locales/pt-pt/translation/admin-console/sign-in-exp.ts
index 8314d6b1d..4495499b0 100644
--- a/packages/phrases/src/locales/pt-pt/translation/admin-console/sign-in-exp.ts
+++ b/packages/phrases/src/locales/pt-pt/translation/admin-console/sign-in-exp.ts
@@ -71,15 +71,12 @@ const sign_in_exp = {
     },
     languages: {
       title: 'LÍNGUAS',
-      enable_auto_detect: 'Enable auto detect', // UNTRANSLATED
-      description:
-        "Your software detects the user's location and switches to the local language. You can add new locales by translating UI from English to another language.", // UNTRANSLATED
-      manage_language: 'Manage language', // UNTRANSLATED
-      default_language: 'Default language', // UNTRANSLATED
-      default_language_description_auto:
-        'The default language will be used when a text segment is missing translation.', // UNTRANSLATED
-      default_language_description_fixed:
-        'When auto detect is off, the default language is the only language your software will show. Turn on auto detect for language customization.', // UNTRANSLATED
+      mode: 'Modo de idioma',
+      auto: 'automático',
+      fixed: 'Fixo',
+      fallback_language: 'Idioma fallback',
+      fallback_language_tip: 'Qual idioma usar se o Logto não encontrar o idioma requisitado.',
+      fixed_language: 'Idioma fixo',
     },
     authentication: {
       title: 'AUTENTICAÇÃO',
diff --git a/packages/phrases/src/locales/tr-tr/translation/admin-console/sign-in-exp.ts b/packages/phrases/src/locales/tr-tr/translation/admin-console/sign-in-exp.ts
index dccd6ff37..eda5fe7c9 100644
--- a/packages/phrases/src/locales/tr-tr/translation/admin-console/sign-in-exp.ts
+++ b/packages/phrases/src/locales/tr-tr/translation/admin-console/sign-in-exp.ts
@@ -72,15 +72,13 @@ const sign_in_exp = {
     },
     languages: {
       title: 'DİLLER',
-      enable_auto_detect: 'Enable auto detect', // UNTRANSLATED
-      description:
-        "Your software detects the user's location and switches to the local language. You can add new locales by translating UI from English to another language.", // UNTRANSLATED
-      manage_language: 'Manage language', // UNTRANSLATED
-      default_language: 'Default language', // UNTRANSLATED
-      default_language_description_auto:
-        'The default language will be used when a text segment is missing translation.', // UNTRANSLATED
-      default_language_description_fixed:
-        'When auto detect is off, the default language is the only language your software will show. Turn on auto detect for language customization.', // UNTRANSLATED
+      mode: 'Dil modu',
+      auto: 'Otomatik',
+      fixed: 'Sabit',
+      fallback_language: 'Yedek dil',
+      fallback_language_tip:
+        'Logto uygun bir dil ifade kümesi bulamazsa hangi dilden vazgeçilecek?',
+      fixed_language: 'Sabitlenmiş dil',
     },
     authentication: {
       title: 'AUTHENTICATION',
diff --git a/packages/phrases/src/locales/zh-cn/translation/admin-console/sign-in-exp.ts b/packages/phrases/src/locales/zh-cn/translation/admin-console/sign-in-exp.ts
index a322f9fc5..aef5319ce 100644
--- a/packages/phrases/src/locales/zh-cn/translation/admin-console/sign-in-exp.ts
+++ b/packages/phrases/src/locales/zh-cn/translation/admin-console/sign-in-exp.ts
@@ -68,15 +68,12 @@ const sign_in_exp = {
     },
     languages: {
       title: '语言',
-      enable_auto_detect: 'Enable auto detect', // UNTRANSLATED
-      description:
-        "Your software detects the user's location and switches to the local language. You can add new locales by translating UI from English to another language.", // UNTRANSLATED
-      manage_language: 'Manage language', // UNTRANSLATED
-      default_language: 'Default language', // UNTRANSLATED
-      default_language_description_auto:
-        'The default language will be used when a text segment is missing translation.', // UNTRANSLATED
-      default_language_description_fixed:
-        'When auto detect is off, the default language is the only language your software will show. Turn on auto detect for language customization.', // UNTRANSLATED
+      mode: '语言模式',
+      auto: '自动',
+      fixed: '固定',
+      fallback_language: '备用语言',
+      fallback_language_tip: '如果 Logto 找不到合适的语言包，将回退至哪种语言。',
+      fixed_language: '固定语言',
     },
     authentication: {
       title: '身份验证',