From 6ea6366e1ca70b695d6fc6d19bba9cf93dd63f6b Mon Sep 17 00:00:00 2001
From: Elias Nahum <nahumhbl@gmail.com>
Date: Thu, 20 May 2021 11:58:53 -0400
Subject: [PATCH] MM-35384 Add country variant localization support (#5397)

---
 app/components/root/root.js      |  9 ++++-----
 app/i18n/index.js                | 11 ++++++++++-
 app/i18n/languages.ts            | 28 ++++++++++++++++++++++++++++
 app/init/global_event_handler.js |  2 +-
 app/reducers/views/i18n.js       |  2 +-
 app/selectors/i18n.js            |  2 +-
 6 files changed, 45 insertions(+), 9 deletions(-)
 create mode 100644 app/i18n/languages.ts

diff --git a/app/components/root/root.js b/app/components/root/root.js
index 22a609fe3..5426051e3 100644
--- a/app/components/root/root.js
+++ b/app/components/root/root.js
@@ -6,13 +6,12 @@ import PropTypes from 'prop-types';
 import {IntlProvider} from 'react-intl';
 import {Platform} from 'react-native';
 
+import {resetToTeams} from '@actions/navigation';
 import {Client4} from '@client/rest';
+import {NavigationTypes} from '@constants';
+import {getTranslations, getLocaleFromLanguage} from '@i18n';
 import EventEmitter from '@mm-redux/utils/event_emitter';
 
-import {resetToTeams} from 'app/actions/navigation';
-import {NavigationTypes} from 'app/constants';
-import {getTranslations} from 'app/i18n';
-
 export default class Root extends PureComponent {
     static propTypes = {
         children: PropTypes.node,
@@ -102,7 +101,7 @@ export default class Root extends PureComponent {
     }
 
     render() {
-        const locale = this.props.locale;
+        const locale = getLocaleFromLanguage(this.props.locale);
 
         return (
             <IntlProvider
diff --git a/app/i18n/index.js b/app/i18n/index.js
index 05489cc94..10f50c76d 100644
--- a/app/i18n/index.js
+++ b/app/i18n/index.js
@@ -8,6 +8,8 @@ import moment from 'moment';
 
 import en from '@assets/i18n/en.json';
 
+import availableLanguages from './languages';
+
 export const DEFAULT_LOCALE = 'en';
 
 addLocaleData(enLocaleData);
@@ -130,6 +132,12 @@ function loadTranslation(locale) {
     }
 }
 
+export function getLocaleFromLanguage(lang) {
+    const languageCode = lang.split('-')[0];
+    const locale = availableLanguages[lang] || languageCode;
+    return locale;
+}
+
 export function resetMomentLocale() {
     moment.locale(DEFAULT_LOCALE);
 }
@@ -138,7 +146,8 @@ export function getTranslations(locale) {
     return loadTranslation(locale);
 }
 
-export function getLocalizedMessage(locale, id) {
+export function getLocalizedMessage(lang, id) {
+    const locale = getLocaleFromLanguage(lang);
     const translations = getTranslations(locale);
 
     return translations[id];
diff --git a/app/i18n/languages.ts b/app/i18n/languages.ts
new file mode 100644
index 000000000..3532be0bd
--- /dev/null
+++ b/app/i18n/languages.ts
@@ -0,0 +1,28 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import keyMirror from '@mm-redux/utils/key_mirror';
+
+const languages: Record<string, string> = keyMirror({
+    bg: null,
+    de: null,
+    en: null,
+    es: null,
+    fr: null,
+    hu: null,
+    it: null,
+    ja: null,
+    ko: null,
+    nl: null,
+    pl: null,
+    'pt-BR': null,
+    ro: null,
+    ru: null,
+    sv: null,
+    tr: null,
+    uk: null,
+    'zh-CN': null,
+    'zh-TW': null,
+});
+
+export default languages;
diff --git a/app/init/global_event_handler.js b/app/init/global_event_handler.js
index a4a2b44ab..30d3b478c 100644
--- a/app/init/global_event_handler.js
+++ b/app/init/global_event_handler.js
@@ -291,7 +291,7 @@ class GlobalEventHandler {
                 },
                 views: {
                     i18n: {
-                        locale: getLocales()[0].languageCode,
+                        locale: getLocales()[0].languageTag,
                     },
                     root: {
                         hydrationComplete: true,
diff --git a/app/reducers/views/i18n.js b/app/reducers/views/i18n.js
index d4a753db5..56111a636 100644
--- a/app/reducers/views/i18n.js
+++ b/app/reducers/views/i18n.js
@@ -6,7 +6,7 @@ import {getLocales} from 'react-native-localize';
 
 import {UserTypes} from '@mm-redux/action_types';
 
-const defaultLocale = getLocales()[0].languageCode;
+const defaultLocale = getLocales()[0].languageTag;
 
 function locale(state = defaultLocale, action) {
     switch (action.type) {
diff --git a/app/selectors/i18n.js b/app/selectors/i18n.js
index c1f5424be..ad129f26c 100644
--- a/app/selectors/i18n.js
+++ b/app/selectors/i18n.js
@@ -8,7 +8,7 @@ import {getCurrentUserLocale} from '@mm-redux/selectors/entities/i18n';
 
 // Not a proper selector since the device locale isn't in the redux store
 export function getCurrentLocale(state) {
-    const deviceLocale = getLocales()[0].languageCode;
+    const deviceLocale = getLocales()[0].languageTag;
     const defaultLocale = deviceLocale || DEFAULT_LOCALE;
 
     return getCurrentUserLocale(state, defaultLocale);