From b7e93739656d225ed0a8854f357746b5291b6857 Mon Sep 17 00:00:00 2001 From: Tusooa Zhu Date: Mon, 25 Jul 2022 15:38:05 -0400 Subject: [PATCH 1/3] Add support for multiple interface languages --- .../interface_language_switcher.vue | 75 +++++++++++++++---- .../settings_modal/tabs/profile_tab.js | 4 +- src/i18n/messages.js | 26 ++++++- src/modules/config.js | 5 +- src/services/locale/locale.service.js | 5 ++ 5 files changed, 92 insertions(+), 23 deletions(-) diff --git a/src/components/interface_language_switcher/interface_language_switcher.vue b/src/components/interface_language_switcher/interface_language_switcher.vue index 6997f149..e18a2a12 100644 --- a/src/components/interface_language_switcher/interface_language_switcher.vue +++ b/src/components/interface_language_switcher/interface_language_switcher.vue @@ -1,21 +1,39 @@ @@ -34,7 +52,7 @@ export default { required: true }, language: { - type: String, + type: [Array, String], required: true }, setLanguage: { @@ -48,7 +66,9 @@ export default { }, controlledLanguage: { - get: function () { return this.language }, + get: function () { + return Array.isArray(this.language) ? this.language : [this.language] + }, set: function (val) { this.setLanguage(val) } @@ -58,7 +78,30 @@ export default { methods: { getLanguageName (code) { return localeService.getLanguageName(code) + }, + addLanguage () { + this.controlledLanguage = [...this.controlledLanguage, ''] + }, + setLanguageAt (index, val) { + const lang = [...this.controlledLanguage] + lang[index] = val + this.controlledLanguage = lang + }, + removeLanguageAt (index) { + const lang = [...this.controlledLanguage] + lang.splice(index, 1) + this.controlledLanguage = lang } } } + + diff --git a/src/components/settings_modal/tabs/profile_tab.js b/src/components/settings_modal/tabs/profile_tab.js index b86faef0..d5977461 100644 --- a/src/components/settings_modal/tabs/profile_tab.js +++ b/src/components/settings_modal/tabs/profile_tab.js @@ -43,7 +43,7 @@ const ProfileTab = { bannerPreview: null, background: null, backgroundPreview: null, - emailLanguage: this.$store.state.users.currentUser.language || '' + emailLanguage: this.$store.state.users.currentUser.language || [''] } }, components: { @@ -130,7 +130,7 @@ const ProfileTab = { } if (this.emailLanguage) { - params.language = localeService.internalToBackendLocale(this.emailLanguage) + params.language = localeService.internalToBackendLocaleMulti(this.emailLanguage) } this.$store.state.api.backendInteractor diff --git a/src/i18n/messages.js b/src/i18n/messages.js index 74a89ca8..849d98fd 100644 --- a/src/i18n/messages.js +++ b/src/i18n/messages.js @@ -7,8 +7,11 @@ // sed -i -e "s/'//gm" -e 's/"/\\"/gm' -re 's/^( +)(.+?): ((.+?))?(,?)(\{?)$/\1"\2": "\4"/gm' -e 's/\"\{\"/{/g' -e 's/,"$/",/g' file.json // There's only problem that apostrophe character ' gets replaced by \\ so you have to fix it manually, sorry. +import { isEqual } from 'lodash' import { languages, langCodeToJsonName } from './languages.js' +const ULTIMATE_FALLBACK_LOCALE = 'en' + const hasLanguageFile = (code) => languages.includes(code) const loadLanguageFile = (code) => { @@ -25,11 +28,26 @@ const messages = { en: require('./en.json').default }, setLanguage: async (i18n, language) => { - if (hasLanguageFile(language)) { - const messages = await loadLanguageFile(language) - i18n.setLocaleMessage(language, messages.default) + const languages = (Array.isArray(language) ? language : [language]).filter(k => k) + + if (!languages.includes(ULTIMATE_FALLBACK_LOCALE)) { + languages.push(ULTIMATE_FALLBACK_LOCALE) } - i18n.locale = language + const [first, ...rest] = languages + + if (first === i18n.locale && isEqual(rest, i18n.fallbackLocale)) { + return + } + + for (const lang of languages) { + if (hasLanguageFile(lang)) { + const messages = await loadLanguageFile(lang) + i18n.setLocaleMessage(lang, messages.default) + } + } + + i18n.fallbackLocale = rest + i18n.locale = first } } diff --git a/src/modules/config.js b/src/modules/config.js index 3cd6888f..1a0e0fc8 100644 --- a/src/modules/config.js +++ b/src/modules/config.js @@ -184,7 +184,10 @@ const config = { case 'interfaceLanguage': messages.setLanguage(this.getters.i18n, value) dispatch('loadUnicodeEmojiData', value) - Cookies.set(BACKEND_LANGUAGE_COOKIE_NAME, localeService.internalToBackendLocale(value)) + Cookies.set( + BACKEND_LANGUAGE_COOKIE_NAME, + localeService.internalToBackendLocaleMulti(value) + ) break case 'thirdColumnMode': dispatch('setLayoutWidth', undefined) diff --git a/src/services/locale/locale.service.js b/src/services/locale/locale.service.js index d3389785..a4af8b90 100644 --- a/src/services/locale/locale.service.js +++ b/src/services/locale/locale.service.js @@ -11,6 +11,10 @@ const specialLanguageCodes = { const internalToBrowserLocale = code => specialLanguageCodes[code] || code const internalToBackendLocale = code => internalToBrowserLocale(code).replace('_', '-') +const internalToBackendLocaleMulti = codes => { + const langs = Array.isArray(codes) ? codes : [codes] + return langs.map(internalToBackendLocale).join(',') +} const getLanguageName = (code) => { const specialLanguageNames = { @@ -28,6 +32,7 @@ const languages = _.map(languagesObject.languages, (code) => ({ code, name: getL const localeService = { internalToBrowserLocale, internalToBackendLocale, + internalToBackendLocaleMulti, languages, getLanguageName } From 52eef2eed1767cd4061d1c3c94475429b2924952 Mon Sep 17 00:00:00 2001 From: Tusooa Zhu Date: Mon, 25 Jul 2022 15:38:31 -0400 Subject: [PATCH 2/3] Add English translations for multiple interface languages --- src/i18n/en.json | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/i18n/en.json b/src/i18n/en.json index 59ee1c17..9abfae67 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -334,6 +334,8 @@ "select_all": "Select all" }, "settings": { + "add_language": "Add another language", + "remove_language": "Remove", "app_name": "App name", "expert_mode": "Show advanced", "save": "Save changes", From 7e2ae2ba9565a58944fe8915f054f8eef812ee54 Mon Sep 17 00:00:00 2001 From: tusooa Date: Fri, 23 Dec 2022 23:02:21 -0500 Subject: [PATCH 3/3] Optimize UI --- .../interface_language_switcher.vue | 37 +++++++++++-------- src/i18n/en.json | 4 +- src/modules/instance.js | 9 ++++- 3 files changed, 31 insertions(+), 19 deletions(-) diff --git a/src/components/interface_language_switcher/interface_language_switcher.vue b/src/components/interface_language_switcher/interface_language_switcher.vue index e18a2a12..c9e7506b 100644 --- a/src/components/interface_language_switcher/interface_language_switcher.vue +++ b/src/components/interface_language_switcher/interface_language_switcher.vue @@ -3,29 +3,34 @@ -
    +
    • - - {{ lang.name }} - - + + + + > + {{ $t('settings.remove_language') }} +
      • -
+ diff --git a/src/i18n/en.json b/src/i18n/en.json index 9abfae67..7df42d92 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -334,8 +334,10 @@ "select_all": "Select all" }, "settings": { - "add_language": "Add another language", + "add_language": "Add fallback language", "remove_language": "Remove", + "primary_language": "Primary language:", + "fallback_language": "Fallback language {index}:", "app_name": "App name", "expert_mode": "Show advanced", "save": "Save changes", diff --git a/src/modules/instance.js b/src/modules/instance.js index 3b15e62e..bff26151 100644 --- a/src/modules/instance.js +++ b/src/modules/instance.js @@ -273,8 +273,13 @@ const instance = { langList .map(async lang => { if (!state.unicodeEmojiAnnotations[lang]) { - const annotations = await loadAnnotations(lang) - commit('setUnicodeEmojiAnnotations', { lang, annotations }) + try { + const annotations = await loadAnnotations(lang) + commit('setUnicodeEmojiAnnotations', { lang, annotations }) + } catch (e) { + console.warn(`Error loading unicode emoji annotations for ${lang}: `, e) + // ignore + } } })) },