From ac29aba32419931da4650a8557102e9a31b4f81a Mon Sep 17 00:00:00 2001
From: Sui Sin <103026762+suisin-deriv@users.noreply.github.com>
Date: Thu, 7 Sep 2023 11:34:16 +0800
Subject: [PATCH] chore: fix language not correct when redirect from deriv-com
 (#9632)

* chore: fix language not correct when redirect from deriv-com

* chore: fix language redirection from deriv-com

* chore: add optional chaining

* chore: update code base on comments
---
 packages/core/src/Stores/client-store.js     | 13 +++++++------
 packages/translations/src/i18next/i18next.ts |  6 ++++++
 2 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/packages/core/src/Stores/client-store.js b/packages/core/src/Stores/client-store.js
index f662ca739bb2..5a6ead2db315 100644
--- a/packages/core/src/Stores/client-store.js
+++ b/packages/core/src/Stores/client-store.js
@@ -28,7 +28,7 @@ import { RudderStack } from '@deriv/analytics';
 import { WS, requestLogout } from 'Services';
 import { action, computed, makeObservable, observable, reaction, runInAction, toJS, when } from 'mobx';
 import { getAccountTitle, getClientAccountType, getAvailableAccount } from './Helpers/client';
-import { getLanguage, localize } from '@deriv/translations';
+import { getLanguage, localize, getRedirectionLanguage } from '@deriv/translations';
 import { getRegion, isEuCountry, isMultipliersOnly, isOptionsBlocked } from '_common/utility';
 
 import BaseStore from './base-store';
@@ -40,7 +40,6 @@ import moment from 'moment';
 import { setDeviceDataCookie } from './Helpers/device';
 
 const LANGUAGE_KEY = 'i18n_language';
-const DEFAULT_LANGUAGE = 'EN';
 const storage_key = 'client.accounts';
 const store_name = 'client_store';
 const eu_shortcode_regex = new RegExp('^(maltainvest|malta|iom)$');
@@ -430,9 +429,11 @@ export default class ClientStore extends BaseStore {
         reaction(
             () => [this.account_settings],
             () => {
-                const lang_from_url = new URLSearchParams(window.location.search).get('lang') || DEFAULT_LANGUAGE;
-                this.setPreferredLanguage(lang_from_url);
-                LocalStore.set(LANGUAGE_KEY, lang_from_url);
+                const language = getRedirectionLanguage(this.account_settings?.preferred_language);
+                window.history.replaceState({}, document.title, urlForLanguage(language));
+
+                this.setPreferredLanguage(language);
+                LocalStore.set(LANGUAGE_KEY, language);
             }
         );
 
@@ -1688,7 +1689,7 @@ export default class ClientStore extends BaseStore {
             runInAction(() => {
                 this.is_populating_account_list = false;
             });
-            const language = authorize_response.authorize.preferred_language;
+            const language = getRedirectionLanguage(authorize_response.authorize.preferred_language);
             const stored_language = LocalStore.get(LANGUAGE_KEY);
             if (language !== 'EN' && stored_language && language !== stored_language) {
                 window.history.replaceState({}, document.title, urlForLanguage(language));
diff --git a/packages/translations/src/i18next/i18next.ts b/packages/translations/src/i18next/i18next.ts
index 47ff49cf5536..f6813b87f80e 100644
--- a/packages/translations/src/i18next/i18next.ts
+++ b/packages/translations/src/i18next/i18next.ts
@@ -64,6 +64,12 @@ const isLanguageAvailable = (lang: string) => {
     return Object.keys(getAllowedLanguages()).includes(selected_language);
 };
 
+export const getRedirectionLanguage = (preferred_language: string) => {
+    const language_query = new URLSearchParams(window.location.search).get('lang');
+    const is_language_query_valid = language_query && isLanguageAvailable(language_query);
+    return is_language_query_valid ? language_query : preferred_language ?? DEFAULT_LANGUAGE;
+};
+
 export const getAllLanguages = () => ALL_LANGUAGES;
 
 export const getInitialLanguage = () => {