src/boot/after_store.js

@@ -52,17 +52,23 @@ const preloadFetch = async (request) => {
 }
 
 const resolveLanguage = (instanceLanguages) => {
-  // First language in navigator.languages that is listed as an instance language
-  // falls back to first instance language
+  // If the user knows multiple non-English languages, prefer the one
+  // the staff knows. If no overlap, prefer what the user knows.
+  // But if English is the user's primary language, not just added implicitly
+  // by the browser, then skip the non-English check.
   const navigatorLanguages = navigator.languages.map((x) => x.split('-')[0])
+  const instanceNativeLanguages =
+    navigatorLanguages.indexOf('en') === 0
+      ? instanceLanguages
+      : instanceLanguages.filter((x) => x !== 'en')
 
   for (const navLanguage of navigatorLanguages) {
-    if (instanceLanguages.includes(navLanguage)) {
+    if (instanceNativeLanguages.includes(navLanguage)) {
       return navLanguage
     }
   }
 
-  return instanceLanguages[0]
+  return navigatorLanguages[0] || 'en'
 }
 
 const getInstanceConfig = async ({ store }) => {

src/i18n/service_worker_messages.js

@@ -29,7 +29,9 @@ const messages = {
   ru: require('../lib/notification-i18n-loader.js!./ru.json'),
   sk: require('../lib/notification-i18n-loader.js!./sk.json'),
   te: require('../lib/notification-i18n-loader.js!./te.json'),
+  uk: require('../lib/notification-i18n-loader.js!./uk.json'),
   zh: require('../lib/notification-i18n-loader.js!./zh.json'),
+  zh_Hant: require('../lib/notification-i18n-loader.js!./zh_Hant.json'),
   en: require('../lib/notification-i18n-loader.js!./en.json')
 }
 

src/main.js

@@ -33,17 +33,12 @@ import messages from './i18n/messages.js'
 
 import afterStoreSetup from './boot/after_store.js'
 
-const currentLocale = (window.navigator.language || 'en').split('-')[0]
-
 const i18n = createI18n({
-  // By default, use the browser locale, we will update it if neccessary
-  locale: 'en',
+  locale: 'en', // Initialized to en, configured to custom in afterStoreSetup.
   fallbackLocale: 'en',
   messages: messages.default
 })
 
-messages.setLanguage(i18n, currentLocale)
-
 const persistedStateOptions = {
   paths: [
     'config',

src/modules/config.js

@@ -229,7 +229,9 @@ const config = {
           break
         case 'interfaceLanguage':
           messages.setLanguage(this.getters.i18n, value)
-          Cookies.set(BACKEND_LANGUAGE_COOKIE_NAME, localeService.internalToBackendLocale(value))
+          Cookies.set(BACKEND_LANGUAGE_COOKIE_NAME, localeService.internalToBackendLocale(value), {
+            expires: 400 // max cookie days since https://chromestatus.com/feature/4887741241229312
+          })
           dispatch('setInstanceOption', { name: 'interfaceLanguage', value })
           break
         case 'thirdColumnMode':