Bug 41369: Improve Firefox language settings for multi-lingual packages

Change the language selector to be sorted by language code, rather than
name, and to display the language code to the user.

Bug 41372: Handle Japanese as a special case in preferences on macOS

Japanese is treated in a special way on macOS. However, seeing the
Japanese language tag could be confusing for users, and moreover the
language name is not localized correctly like other langs.

Bug 41378: Tell users that they can change their language at the first start

With multi-lingual builds, Tor Browser matches the user's system
language, but some users might want to change it.
So, we tell them that it is possible, but only once.

browser/base/content/browser.xhtml

@@ -120,6 +120,7 @@
   Services.scriptloader.loadSubScript("chrome://browser/content/places/places-menupopup.js", this);
   Services.scriptloader.loadSubScript("chrome://browser/content/search/autocomplete-popup.js", this);
   Services.scriptloader.loadSubScript("chrome://browser/content/search/searchbar.js", this);
+  Services.scriptloader.loadSubScript("chrome://browser/content/languageNotification.js", this);
 
   window.onload = gBrowserInit.onLoad.bind(gBrowserInit);
   window.onunload = gBrowserInit.onUnload.bind(gBrowserInit);

browser/base/content/languageNotification.js

+"use strict";
+
+// Show a prompt to suggest to the user that they can change the UI language.
+// Show it only the first time, and then do not show it anymore
+window.addEventListener("load", async () => {
+  const PREF_NAME = "intl.language_notification.shown";
+
+  if (Services.prefs.getBoolPref(PREF_NAME, false)) {
+    return;
+  }
+
+  // Already customized, we do not suggest to change it again...
+  if (Services.prefs.getCharPref("intl.locale.requested", "") !== "") {
+    // ... and we never show the notification, either
+    Services.prefs.setBoolPref(PREF_NAME, true);
+    return;
+  }
+
+  // In sync with our changes on browser/components/preferences/main.js for
+  // tor-browser#41369 and tor-browser#41372.
+  const code =
+    Services.locale.appLocaleAsBCP47 === "ja-JP-macos"
+      ? "ja"
+      : Services.locale.appLocaleAsBCP47;
+  const language = Services.intl
+    .getLocaleDisplayNames(undefined, [code], { preferNative: true })[0]
+    .replace(/\s*\(.+\)$/g, "");
+
+  // We want to determine whether the current locale was chosen based on the
+  // system locales, in which case langauge negotiation returns a match, or
+  // whether it simply defaulted to en-US.
+  const matchingSystem = !!Services.locale.negotiateLanguages(
+    // Since intl.locale.requested is empty, we expect requestedLocales to match
+    // the user's system locales.
+    Services.locale.requestedLocales,
+    Services.locale.availableLocales
+  ).length;
+  const label = await document.l10n.formatValue(
+    matchingSystem
+      ? "language-notification-label-system"
+      : "language-notification-label",
+    { language }
+  );
+
+  const buttons = [
+    {
+      "l10n-id": "language-notification-button",
+      callback() {
+        openPreferences("general-language");
+      },
+    },
+  ];
+
+  gNotificationBox.appendNotification(
+    "language-notification",
+    {
+      label,
+      priority: gNotificationBox.PRIORITY_INFO_HIGH,
+    },
+    buttons
+  );
+
+  // We do not wait for the user to either click on the button or dismiss the
+  // notification: after we have shown it once, we take for granted that the
+  // user has seen it and we never show it again.
+  Services.prefs.setBoolPref(PREF_NAME, true);
+});

browser/base/jar.mn

@@ -104,3 +104,5 @@ browser.jar:
         content/browser/spotlight.html                (content/spotlight.html)
         content/browser/spotlight.js                  (content/spotlight.js)
 *       content/browser/default-bookmarks.html        (content/default-bookmarks.html)
+
+        content/browser/languageNotification.js       (content/languageNotification.js)

browser/components/preferences/main.inc.xhtml

@@ -313,7 +313,7 @@
 </groupbox>
 
 <!-- Languages -->
-<groupbox id="languagesGroup" data-category="paneGeneral" hidden="true">
+<groupbox id="languagesGroup" data-category="paneGeneral" hidden="true" data-subcategory="language">
   <label><html:h2 data-l10n-id="language-header"/></label>
 
   <vbox id="browserLanguagesBox" align="start" hidden="true">

browser/components/preferences/main.js

@@ -1448,8 +1448,28 @@ var gMainPane = {
       available,
       { preferNative: true }
     );
-    let locales = available.map((code, i) => ({ code, name: localeNames[i] }));
-    locales.sort((a, b) => a.name > b.name);
+    let locales = available.map((code, i) => {
+      let name = localeNames[i].replace(/\s*\(.+\)$/g, "");
+      if (code === "ja-JP-macos") {
+        // Mozilla codebases handle Japanese in macOS in different ways,
+        // sometimes they call it ja-JP-mac and sometimes they call it
+        // ja-JP-macos. The former is translated to Japanese when specifying
+        // preferNative to true, the latter is not. Since seeing ja-JP-macos
+        // would be confusing anyway, we treat it as a special case.
+        // See tor-browser#41372 and Bug 1726586.
+        name =
+          Services.intl.getLocaleDisplayNames(undefined, ["ja"], {
+            preferNative: true,
+          })[0] + " (ja)";
+      } else {
+        name += ` (${code})`;
+      }
+      return {
+        code,
+        name,
+      };
+    });
+    locales.sort((a, b) => a.code.localeCompare(b.code));
 
     let fragment = document.createDocumentFragment();
     for (let { code, name } of locales) {