i18n: use zh-Hant for Chinese (Traditional)

src/ui/localePicker.js

@@ -20,6 +20,11 @@ export const LOCALE_SEARCH_THRESHOLD = 8;
 /** Type-ahead keystrokes closer together than this extend one prefix. */
 export const TYPEAHEAD_RESET_MS = 500;
 
+const CHINESE_LABELS = {
+  'zh-CN': 'Chinese (Simplified)',
+  'zh-Hant': 'Chinese (Traditional)',
+};
+
 /**
  * Text folded for search: no diacritics, lower case. 'Español' → 'espanol',
  * 'Ёжик' → 'ежик'.
@@ -464,12 +469,13 @@ export function mountLocalePicker({
     item.dataset.locale = option.code;
     const name = element(documentRef, 'span', 'locale-picker-native');
     name.textContent = option.nativeName;
-    // Every row reads the same: the language named in itself, then its code.
-    // The interface-language name only helps the search find it.
+    // Chinese variants are distinguished by script rather than region.
     const meta = element(documentRef, 'span', 'locale-picker-meta');
     const codeLabel = element(documentRef, 'span', 'locale-picker-option-code');
     codeLabel.setAttribute('translate', 'no');
-    codeLabel.textContent = option.code.toUpperCase();
+    codeLabel.textContent =
+      CHINESE_LABELS[option.code] || option.code.toUpperCase();
+    if (CHINESE_LABELS[option.code]) codeLabel.lang = 'en';
     meta.append(codeLabel);
     const text = element(documentRef, 'span', 'locale-picker-text');
     text.append(name, meta);

src/ui/localePicker.test.mjs

@@ -40,7 +40,7 @@ test('the current language comes first, the rest by their own names', () => {
         nativeNames: LOCALE_NAMES,
       }),
     ),
-    ['ru', 'en', 'es', 'zh-CN', 'zh-TW'],
+    ['ru', 'en', 'es', 'zh-CN', 'zh-Hant'],
   );
   assert.deepEqual(
     codes(
@@ -50,7 +50,7 @@ test('the current language comes first, the rest by their own names', () => {
         nativeNames: LOCALE_NAMES,
       }),
     ),
-    ['es', 'en', 'ru', 'zh-CN', 'zh-TW'],
+    ['es', 'en', 'ru', 'zh-CN', 'zh-Hant'],
   );
   assert.deepEqual(
     codes(
@@ -60,7 +60,7 @@ test('the current language comes first, the rest by their own names', () => {
         nativeNames: LOCALE_NAMES,
       }),
     ),
-    ['en', 'es', 'ru', 'zh-CN', 'zh-TW'],
+    ['en', 'es', 'ru', 'zh-CN', 'zh-Hant'],
   );
   const rows = buildLocaleOptions({
     locales: MANY,
@@ -263,7 +263,7 @@ test('keyboard model: open on the current language, move, choose, close', () =>
   assert.deepEqual(model.keydown({ key: 'ArrowDown' }), { handled: true });
   assert.equal(model.activeOption.code, 'en');
   model.keydown({ key: 'End' });
-  assert.equal(model.activeOption.code, 'zh-TW');
+  assert.equal(model.activeOption.code, 'zh-Hant');
   model.keydown({ key: 'Home' });
   assert.equal(model.activeOption.code, 'ru');
   model.keydown({ key: 'ArrowUp' });