enhance(l10n): localize en-US link title (#11011)

Co-authored-by: Leonid Vinogradov <[email protected]>

build/flaws/broken-links.ts

@@ -11,6 +11,7 @@ import { isValidLocale } from "../../libs/locale-utils/index.js";
 import * as cheerio from "cheerio";
 import { Doc } from "../../libs/types/document.js";
 import { Flaw } from "./index.js";
+import { ONLY_AVAILABLE_IN_ENGLISH } from "../../libs/l10n/l10n.js";
 
 const _safeToHttpsDomains = new Map();
 
@@ -50,12 +51,13 @@ function mutateLink(
   if (isSelfLink) {
     $element.attr("aria-current", "page");
   } else if (enUSFallback) {
+    const locale = $element.attr("href").match(/^\/([^/]+)\//)[1];
     // If we have an English (US) fallback, then we use this first.
     // As we still suggest the translated version even if we only
     // have an English (US) version.
     $element.attr("href", enUSFallback);
     $element.addClass("only-in-en-us");
-    $element.attr("title", "Currently only available in English (US)");
+    $element.attr("title", ONLY_AVAILABLE_IN_ENGLISH(locale));
   } else if (suggestion) {
     $element.attr("href", suggestion);
   } else {

kumascript/src/api/web.ts

@@ -5,10 +5,13 @@ import * as util from "./util.js";
 
 import { CONTENT_ROOT } from "../../../libs/env/index.js";
 import { KumaThis } from "../environment.js";
+import { ONLY_AVAILABLE_IN_ENGLISH } from "../../../libs/l10n/l10n.js";
+import { htmlEscape } from "./util.js";
 
 const DUMMY_BASE_URL = "https://example.com";
 
 const _warned = new Map();
+
 // The purpose of this function is to make sure `console.warn` is only called once
 // per 'macro' per 'href'.
 // There are some macros that use `smartLink` within themselves and these macros
@@ -152,9 +155,11 @@ const web = {
           )}"`;
         }
         content ??= enUSPage.short_title ?? enUSPage.title;
+        const title = ONLY_AVAILABLE_IN_ENGLISH(this.env.locale);
+
         return (
           '<a class="only-in-en-us" ' +
-          'title="Currently only available in English (US)" ' +
+          `title="${htmlEscape(title)}" ` +
           `href="${enUSPage.url}"${flawAttribute}>${content}</a>`
         );
       }

libs/l10n/l10n.ts

@@ -0,0 +1,19 @@
+import { Locale } from "../types/core.js";
+
+type LocaleStringMap = Record<Locale, string>;
+
+function localeString(strings: LocaleStringMap) {
+  return (locale: string) => strings[locale] ?? strings["en-US"];
+}
+
+export const ONLY_AVAILABLE_IN_ENGLISH = localeString({
+  "en-US": "This page is currently only available in English",
+  es: "Esta página está disponible solo en inglés",
+  fr: "Cette page est actuellement disponible uniquement en anglais",
+  ja: "このページは現在、英語のみで利用可能です。",
+  ko: "이 페이지는 현재 영어로만 제공됩니다",
+  "pt-BR": "Esta página está disponível apenas em inglês no momento",
+  ru: "В настоящее время эта страница доступна только на английском языке",
+  "zh-CN": "此页面目前仅提供英文版本",
+  "zh-TW": "此頁面目前僅提供英文版本",
+});

libs/types/core.ts

@@ -0,0 +1,11 @@
+export type Locale =
+  | "en-US"
+  | "es"
+  | "fr"
+  | "ja"
+  | "ko"
+  | "pt-BR"
+  | "ru"
+  | "zh-CN"
+  | "zh-TW";
+export type TranslatedLocale = Exclude<Locale, "en-US">;

testing/tests/index.test.ts

@@ -1633,7 +1633,7 @@ test("translated content broken links can fall back to en-us", () => {
   expect($('article a[href="/en-US/docs/Web/CSS/number"]')).toHaveLength(2);
   expect($("article a.only-in-en-us")).toHaveLength(2);
   expect($("article a.only-in-en-us").attr("title")).toBe(
-    "Currently only available in English (US)"
+    "Cette page est actuellement disponible uniquement en anglais"
   );
 });