commit: a5e861cd019eb7770b8524ecdb6237f33fd18d12
parent 96a24ec6259cf2658f5d53939aa75c0bacfb657d
Author: Tusooa Zhu <tusooa@kazv.moe>
Date: Sat, 26 Mar 2022 12:21:34 -0400
Set userLanguage cookie when setting interface language
Diffstat:
7 files changed, 57 insertions(+), 19 deletions(-)
diff --git a/package.json b/package.json
@@ -31,6 +31,7 @@
"cropperjs": "1.5.12",
"diff": "3.5.0",
"escape-html": "1.0.3",
+ "js-cookie": "^3.0.1",
"localforage": "1.10.0",
"parse-link-header": "1.0.1",
"phoenix": "1.6.2",
diff --git a/src/components/interface_language_switcher/interface_language_switcher.vue b/src/components/interface_language_switcher/interface_language_switcher.vue
@@ -6,7 +6,7 @@
{{ ' ' }}
<Select
id="interface-language-switcher"
- v-model="language"
+ v-model="controlledLanguage"
>
<option
v-for="lang in languages"
@@ -20,39 +20,33 @@
</template>
<script>
-import languagesObject from '../../i18n/messages'
import localeService from '../../services/locale/locale.service.js'
-import ISO6391 from 'iso-639-1'
-import _ from 'lodash'
import Select from '../select/select.vue'
export default {
components: {
Select
},
+ props: {
+ language: String,
+ setLanguage: Function
+ },
computed: {
languages () {
- return _.map(languagesObject.languages, (code) => ({ code: code, name: this.getLanguageName(code) })).sort((a, b) => a.name.localeCompare(b.name))
+ return localeService.languages
},
- language: {
- get: function () { return this.$store.getters.mergedConfig.interfaceLanguage },
+ controlledLanguage: {
+ get: function () { return this.language },
set: function (val) {
- this.$store.dispatch('setOption', { name: 'interfaceLanguage', value: val })
+ this.setLanguage(val)
}
}
},
methods: {
getLanguageName (code) {
- const specialLanguageNames = {
- 'ja_easy': 'やさしいにほんご',
- 'zh': '简体中文',
- 'zh_Hant': '繁體中文'
- }
- const languageName = specialLanguageNames[code] || ISO6391.getNativeName(code)
- const browserLocale = localeService.internalToBrowserLocale(code)
- return languageName.charAt(0).toLocaleUpperCase(browserLocale) + languageName.slice(1)
+ return localeService.getLanguageName(code)
}
}
}
diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js
@@ -72,6 +72,12 @@ const GeneralTab = {
!this.$store.state.users.currentUser.background_image
},
instanceShoutboxPresent () { return this.$store.state.instance.shoutAvailable },
+ language: {
+ get: function () { return this.$store.getters.mergedConfig.interfaceLanguage },
+ set: function (val) {
+ this.$store.dispatch('setOption', { name: 'interfaceLanguage', value: val })
+ }
+ },
...SharedComputedObject()
},
methods: {
diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue
@@ -4,7 +4,10 @@
<h2>{{ $t('settings.interface') }}</h2>
<ul class="setting-list">
<li>
- <interface-language-switcher />
+ <interface-language-switcher
+ :language="language"
+ :set-language="val => language = val"
+ />
</li>
<li v-if="instanceSpecificPanelPresent">
<BooleanSetting path="hideISP">
diff --git a/src/modules/config.js b/src/modules/config.js
@@ -1,5 +1,10 @@
+import { set, delete as del } from 'vue'
+import Cookies from 'js-cookie'
import { setPreset, applyTheme } from '../services/style_setter/style_setter.js'
import messages from '../i18n/messages'
+import localeService from '../services/locale/locale.service.js'
+
+const BACKEND_LANGUAGE_COOKIE_NAME = 'userLanguage'
const browserLocale = (window.navigator.language || 'en').split('-')[0]
@@ -162,6 +167,7 @@ const config = {
break
case 'interfaceLanguage':
messages.setLanguage(this.getters.i18n, value)
+ Cookies.set(BACKEND_LANGUAGE_COOKIE_NAME, localeService.internalToBackendLocale(value))
break
}
}
diff --git a/src/services/locale/locale.service.js b/src/services/locale/locale.service.js
@@ -1,12 +1,35 @@
+import languagesObject from '../../i18n/messages'
+import ISO6391 from 'iso-639-1'
+import _ from 'lodash'
+
const specialLanguageCodes = {
'ja_easy': 'ja',
- 'zh_Hant': 'zh-HANT'
+ 'zh_Hant': 'zh-HANT',
+ 'zh': 'zh-Hans'
}
const internalToBrowserLocale = code => specialLanguageCodes[code] || code
+const internalToBackendLocale = code => internalToBrowserLocale(code).replace('_', '-')
+
+const getLanguageName = (code) => {
+ const specialLanguageNames = {
+ 'ja_easy': 'やさしいにほんご',
+ 'zh': '简体中文',
+ 'zh_Hant': '繁體中文'
+ }
+ const languageName = specialLanguageNames[code] || ISO6391.getNativeName(code)
+ const browserLocale = internalToBrowserLocale(code)
+ return languageName.charAt(0).toLocaleUpperCase(browserLocale) + languageName.slice(1)
+}
+
+const languages = _.map(languagesObject.languages, (code) => ({ code: code, name: getLanguageName(code) })).sort((a, b) => a.name.localeCompare(b.name))
+
const localeService = {
- internalToBrowserLocale
+ internalToBrowserLocale,
+ internalToBackendLocale,
+ languages,
+ getLanguageName
}
export default localeService
diff --git a/yarn.lock b/yarn.lock
@@ -5722,6 +5722,11 @@ js-base64@^2.1.9:
version "2.5.0"
resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.5.0.tgz#42255ba183ab67ce59a0dee640afdc00ab5ae93e"
+js-cookie@^3.0.1:
+ version "3.0.1"
+ resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-3.0.1.tgz#9e39b4c6c2f56563708d7d31f6f5f21873a92414"
+ integrity sha512-+0rgsUXZu4ncpPxRL+lNEptWMOWl9etvPHc/koSRp6MPwpRYAhmk0dUG00J4bxVV3r9uUzfo24wW0knS07SKSw==
+
"js-tokens@^3.0.0 || ^4.0.0", js-tokens@^3.0.2:
version "3.0.2"
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
