feat(app): support locale plural rules (#40370)

Co-authored-by: Luke Parker <10430890+Hona@users.noreply.github.com>

packages/app/src/app.tsx

@@ -233,7 +233,7 @@ function ResolvedDraftRoute(props: { draft: DraftTab }) {
 
 function UiI18nBridge(props: ParentProps) {
   const language = useLanguage()
-  return <I18nProvider value={{ locale: language.intl, t: language.t }}>{props.children}</I18nProvider>
+  return <I18nProvider value={{ locale: language.intl, t: language.t, plural: language.plural }}>{props.children}</I18nProvider>
 }
 
 function LayoutCompatibility(props: ParentProps) {

packages/app/src/context/language.tsx

@@ -1,7 +1,7 @@
 import * as i18n from "@solid-primitives/i18n"
 import { createEffect, createMemo, createResource } from "solid-js"
 import { createStore } from "solid-js/store"
-import { createSimpleContext } from "@opencode-ai/ui/context"
+import { createSimpleContext, pluralCategory, type UiI18nPluralKey } from "@opencode-ai/ui/context"
 import { Persist, persisted } from "@/utils/persist"
 import { dict as en } from "@/i18n/en"
 import { dict as uiEn } from "@opencode-ai/ui/i18n/en"
@@ -38,6 +38,11 @@ export type Locale =
 
 type RawDictionary = typeof en & typeof uiEn
 type Dictionary = i18n.Flatten<RawDictionary>
+type PluralKey =
+  | UiI18nPluralKey
+  | "session.question.pending"
+  | "session.followupDock.summary"
+  | "session.revertDock.summary"
 type Source = { dict: Record<string, string> }
 
 function cookie(locale: Locale) {
@@ -294,6 +299,14 @@ export const { use: useLanguage, provider: LanguageProvider } = createSimpleCont
       params?: Record<string, string | number | boolean>,
     ) => string
 
+    const plural = (key: PluralKey, count: number, params?: Record<string, string | number | boolean>) => {
+      const category = pluralCategory(intl(), count)
+      const current = (dict.loading ? base : (dict() ?? base)) as Record<string, string>
+      const candidate = `${key}.${category}`
+      const fallback = `${key}.other`
+      return i18n.resolveTemplate(current[candidate] ?? current[fallback] ?? fallback, { ...params, count })
+    }
+
     const label = (value: Locale) => {
       const key = LABEL_KEY[value]
       if (key) return t(key)
@@ -313,6 +326,7 @@ export const { use: useLanguage, provider: LanguageProvider } = createSimpleCont
       locales: LOCALES,
       label,
       t,
+      plural,
       setLocale(next: Locale) {
         setStore("locale", normalizeLocale(next))
       },

packages/app/src/i18n/ar.ts

@@ -593,14 +593,26 @@ export const dict = {
   "session.question.minimize": "تصغير السؤال",
   "session.question.restore": "استعادة السؤال",
   "session.question.pending.one": "{{count}} سؤال معلق",
+  "session.question.pending.zero": "عدد الأسئلة المعلقة: {{count}}",
+  "session.question.pending.two": "عدد الأسئلة المعلقة: {{count}}",
+  "session.question.pending.few": "{{count}} أسئلة معلقة",
+  "session.question.pending.many": "{{count}} سؤالًا معلقًا",
   "session.question.pending.other": "الأسئلة المعلقة: {{count}}",
   "session.followupDock.summary.one": "{{count}} رسالة في قائمة الانتظار",
+  "session.followupDock.summary.zero": "عدد الرسائل في قائمة الانتظار: {{count}}",
+  "session.followupDock.summary.two": "عدد الرسائل في قائمة الانتظار: {{count}}",
+  "session.followupDock.summary.few": "{{count}} رسائل في قائمة الانتظار",
+  "session.followupDock.summary.many": "{{count}} رسالةً في قائمة الانتظار",
   "session.followupDock.summary.other": "{{count}} رسائل في قائمة الانتظار",
   "session.followupDock.sendNow": "إرسال الآن",
   "session.followupDock.edit": "تحرير",
   "session.followupDock.collapse": "طي الرسائل المنتظرة",
   "session.followupDock.expand": "توسيع الرسائل المنتظرة",
   "session.revertDock.summary.one": "{{count}} رسالة تم التراجع عنها",
+  "session.revertDock.summary.zero": "عدد الرسائل التي تم التراجع عنها: {{count}}",
+  "session.revertDock.summary.two": "عدد الرسائل التي تم التراجع عنها: {{count}}",
+  "session.revertDock.summary.few": "{{count}} رسائل تم التراجع عنها",
+  "session.revertDock.summary.many": "{{count}} رسالةً تم التراجع عنها",
   "session.revertDock.summary.other": "{{count}} رسائل تم التراجع عنها",
   "session.revertDock.collapse": "طي الرسائل التي تم التراجع عنها",
   "session.revertDock.expand": "توسيع الرسائل التي تم التراجع عنها",

packages/app/src/i18n/br.ts

@@ -599,14 +599,17 @@ export const dict = {
   "session.question.minimize": "Minimizar pergunta",
   "session.question.restore": "Restaurar pergunta",
   "session.question.pending.one": "{{count}} pergunta pendente",
+  "session.question.pending.many": "{{count}} de perguntas pendentes",
   "session.question.pending.other": "{{count}} perguntas pendentes",
   "session.followupDock.summary.one": "{{count}} mensagem na fila",
+  "session.followupDock.summary.many": "{{count}} de mensagens na fila",
   "session.followupDock.summary.other": "{{count}} mensagens na fila",
   "session.followupDock.sendNow": "Enviar agora",
   "session.followupDock.edit": "Editar",
   "session.followupDock.collapse": "Recolher mensagens na fila",
   "session.followupDock.expand": "Expandir mensagens na fila",
   "session.revertDock.summary.one": "{{count}} mensagem revertida",
+  "session.revertDock.summary.many": "{{count}} de mensagens revertidas",
   "session.revertDock.summary.other": "{{count}} mensagens revertidas",
   "session.revertDock.collapse": "Recolher mensagens revertidas",
   "session.revertDock.expand": "Expandir mensagens revertidas",

packages/app/src/i18n/bs.ts

@@ -654,14 +654,17 @@ export const dict = {
   "session.question.minimize": "Minimiziraj pitanje",
   "session.question.restore": "Vrati pitanje",
   "session.question.pending.one": "{{count}} pitanje na čekanju",
+  "session.question.pending.few": "{{count}} pitanja na čekanju",
   "session.question.pending.other": "{{count}} pitanja na čekanju",
   "session.followupDock.summary.one": "{{count}} poruka na čekanju",
+  "session.followupDock.summary.few": "{{count}} poruke na čekanju",
   "session.followupDock.summary.other": "{{count}} poruka na čekanju",
   "session.followupDock.sendNow": "Pošalji sada",
   "session.followupDock.edit": "Uredi",
   "session.followupDock.collapse": "Sažmi poruke na čekanju",
   "session.followupDock.expand": "Proširi poruke na čekanju",
   "session.revertDock.summary.one": "{{count}} vraćena poruka",
+  "session.revertDock.summary.few": "{{count}} vraćene poruke",
   "session.revertDock.summary.other": "{{count}} vraćenih poruka",
   "session.revertDock.collapse": "Sažmi vraćene poruke",
   "session.revertDock.expand": "Proširi vraćene poruke",

packages/app/src/i18n/es.ts

@@ -657,14 +657,17 @@ export const dict = {
   "session.question.minimize": "Minimizar pregunta",
   "session.question.restore": "Restaurar pregunta",
   "session.question.pending.one": "{{count}} pregunta pendiente",
+  "session.question.pending.many": "{{count}} de preguntas pendientes",
   "session.question.pending.other": "{{count}} preguntas pendientes",
   "session.followupDock.summary.one": "{{count}} mensaje en cola",
+  "session.followupDock.summary.many": "{{count}} de mensajes en cola",
   "session.followupDock.summary.other": "{{count}} mensajes en cola",
   "session.followupDock.sendNow": "Enviar ahora",
   "session.followupDock.edit": "Editar",
   "session.followupDock.collapse": "Contraer mensajes en cola",
   "session.followupDock.expand": "Expandir mensajes en cola",
   "session.revertDock.summary.one": "{{count}} mensaje revertido",
+  "session.revertDock.summary.many": "{{count}} de mensajes revertidos",
   "session.revertDock.summary.other": "{{count}} mensajes revertidos",
   "session.revertDock.collapse": "Contraer mensajes revertidos",
   "session.revertDock.expand": "Expandir mensajes revertidos",

packages/app/src/i18n/fr.ts

@@ -608,14 +608,17 @@ export const dict = {
   "session.question.minimize": "Réduire la question",
   "session.question.restore": "Restaurer la question",
   "session.question.pending.one": "{{count}} question en attente",
+  "session.question.pending.many": "{{count}} de questions en attente",
   "session.question.pending.other": "{{count}} questions en attente",
   "session.followupDock.summary.one": "{{count}} message en file d'attente",
+  "session.followupDock.summary.many": "{{count}} de messages en file d'attente",
   "session.followupDock.summary.other": "{{count}} messages en file d'attente",
   "session.followupDock.sendNow": "Envoyer maintenant",
   "session.followupDock.edit": "Modifier",
   "session.followupDock.collapse": "Réduire les messages en file d'attente",
   "session.followupDock.expand": "Développer les messages en file d'attente",
   "session.revertDock.summary.one": "{{count}} message annulé",
+  "session.revertDock.summary.many": "{{count}} de messages annulés",
   "session.revertDock.summary.other": "{{count}} messages annulés",
   "session.revertDock.collapse": "Réduire les messages annulés",
   "session.revertDock.expand": "Développer les messages annulés",

packages/app/src/i18n/it.ts

@@ -627,14 +627,17 @@ export const dict = {
   "session.question.minimize": "Riduci la domanda",
   "session.question.restore": "Ripristina la domanda",
   "session.question.pending.one": "{{count}} domanda in sospeso",
+  "session.question.pending.many": "{{count}} di domande in sospeso",
   "session.question.pending.other": "{{count}} domande in sospeso",
   "session.followupDock.summary.one": "{{count}} messaggio in coda",
+  "session.followupDock.summary.many": "{{count}} di messaggi in coda",
   "session.followupDock.summary.other": "{{count}} messaggi in coda",
   "session.followupDock.sendNow": "Invia ora",
   "session.followupDock.edit": "Modifica",
   "session.followupDock.collapse": "Comprimi i messaggi in coda",
   "session.followupDock.expand": "Espandi i messaggi in coda",
   "session.revertDock.summary.one": "{{count}} messaggio annullato",
+  "session.revertDock.summary.many": "{{count}} di messaggi annullati",
   "session.revertDock.summary.other": "{{count}} messaggi annullati",
   "session.revertDock.collapse": "Comprimi i messaggi annullati",
   "session.revertDock.expand": "Espandi i messaggi annullati",

packages/app/src/i18n/parity.test.ts

@@ -30,6 +30,17 @@ const appLocales = [
   "sv",
 ] as const
 const desktopLocales = appLocales
+const pluralCategories: Partial<Record<(typeof appLocales)[number], readonly string[]>> = {
+  ar: ["zero", "two", "few", "many"],
+  br: ["many"],
+  bs: ["few"],
+  es: ["many"],
+  fr: ["many"],
+  it: ["many"],
+  pl: ["few", "many"],
+  ru: ["few", "many"],
+  uk: ["few", "many"],
+}
 
 const domains = [
   {
@@ -53,18 +64,23 @@ const domains = [
 ] as const
 
 describe.skipIf(!!process.env.CI)("i18n parity", () => {
-  test("non-English locales have every English key", async () => {
+  test("non-English locales have every English key and required plural variants", async () => {
     for (const domain of domains) {
       const source = await dictionary(domain.source)
       for (const locale of domain.locales) {
         const target = await dictionary(domain.target(locale))
         const missing = Object.keys(source).filter((key) => !Object.hasOwn(target, key))
-        const extra = Object.keys(target).filter((key) => !Object.hasOwn(source, key))
+        const extra = Object.keys(target)
+          .filter((key) => !Object.hasOwn(source, key))
+          .sort()
+        const expected = pluralFamilies(source)
+          .flatMap((key) => (pluralCategories[locale] ?? []).map((category) => `${key}.${category}`))
+          .sort()
         expect({ domain: domain.name, locale, missing, extra }).toEqual({
           domain: domain.name,
           locale,
           missing: [],
-          extra: [],
+          extra: expected,
         })
       }
     }
@@ -78,7 +94,17 @@ describe.skipIf(!!process.env.CI)("i18n parity", () => {
         const mismatched = Object.keys(source).filter(
           (key) => Object.hasOwn(target, key) && placeholders(source[key]).join() !== placeholders(target[key]).join(),
         )
-        expect({ domain: domain.name, locale, mismatched }).toEqual({ domain: domain.name, locale, mismatched: [] })
+        const pluralMismatched = pluralFamilies(source).flatMap((key) =>
+          (pluralCategories[locale] ?? [])
+            .map((category) => `${key}.${category}`)
+            .filter((variant) => placeholders(source[`${key}.other`]).join() !== placeholders(target[variant]).join()),
+        )
+        expect({ domain: domain.name, locale, mismatched, pluralMismatched }).toEqual({
+          domain: domain.name,
+          locale,
+          mismatched: [],
+          pluralMismatched: [],
+        })
       }
     }
   })
@@ -110,6 +136,38 @@ describe.skipIf(!!process.env.CI)("i18n parity", () => {
   })
 })
 
+describe("i18n plural parity", () => {
+  test("locale-specific categories exist and preserve count placeholders", async () => {
+    for (const domain of domains.slice(0, 2)) {
+      const source = await dictionary(domain.source)
+      const families = pluralFamilies(source)
+      for (const locale of domain.locales) {
+        const target = await dictionary(domain.target(locale))
+        const missing = families.flatMap((key) =>
+          (pluralCategories[locale] ?? [])
+            .map((category) => `${key}.${category}`)
+            .filter((variant) => !Object.hasOwn(target, variant)),
+        )
+        const mismatched = families.flatMap((key) =>
+          (pluralCategories[locale] ?? [])
+            .map((category) => `${key}.${category}`)
+            .filter(
+              (variant) =>
+                Object.hasOwn(target, variant) &&
+                placeholders(source[`${key}.other`]).join() !== placeholders(target[variant]).join(),
+            ),
+        )
+        expect({ domain: domain.name, locale, missing, mismatched }).toEqual({
+          domain: domain.name,
+          locale,
+          missing: [],
+          mismatched: [],
+        })
+      }
+    }
+  })
+})
+
 async function dictionary(file: string) {
   const module: unknown = await import(file)
   if (typeof module !== "object" || module === null || !("dict" in module) || !isDictionary(module.dict)) {
@@ -126,3 +184,14 @@ function isDictionary(value: unknown): value is Record<string, string> {
 function placeholders(value: string) {
   return Array.from(value.matchAll(/{{\s*([^}]+?)\s*}}/g), (match) => match[1]).sort()
 }
+
+function pluralFamilies(dictionary: Record<string, string>) {
+  return Object.keys(dictionary)
+    .filter(
+      (key) =>
+        key.endsWith(".one") &&
+        dictionary[key].includes("{{count}}") &&
+        dictionary[`${key.slice(0, -4)}.other`]?.includes("{{count}}"),
+    )
+    .map((key) => key.slice(0, -4))
+}

packages/app/src/i18n/pl.ts

@@ -599,14 +599,20 @@ export const dict = {
   "session.question.minimize": "Zminimalizuj pytanie",
   "session.question.restore": "Przywróć pytanie",
   "session.question.pending.one": "{{count}} oczekujące pytanie",
+  "session.question.pending.few": "{{count}} oczekujące pytania",
+  "session.question.pending.many": "{{count}} oczekujących pytań",
   "session.question.pending.other": "Pytania oczekujące: {{count}}",
   "session.followupDock.summary.one": "{{count}} wiadomość w kolejce",
+  "session.followupDock.summary.few": "{{count}} wiadomości w kolejce",
+  "session.followupDock.summary.many": "{{count}} wiadomości w kolejce",
   "session.followupDock.summary.other": "{{count}} wiadomości w kolejce",
   "session.followupDock.sendNow": "Wyślij teraz",
   "session.followupDock.edit": "Edytuj",
   "session.followupDock.collapse": "Zwiń wiadomości w kolejce",
   "session.followupDock.expand": "Rozwiń wiadomości w kolejce",
   "session.revertDock.summary.one": "{{count}} cofnięta wiadomość",
+  "session.revertDock.summary.few": "{{count}} cofnięte wiadomości",
+  "session.revertDock.summary.many": "{{count}} cofniętych wiadomości",
   "session.revertDock.summary.other": "{{count}} cofnięte wiadomości",
   "session.revertDock.collapse": "Zwiń cofnięte wiadomości",
   "session.revertDock.expand": "Rozwiń cofnięte wiadomości",

packages/app/src/i18n/ru.ts

@@ -652,14 +652,20 @@ export const dict = {
   "session.question.minimize": "Свернуть вопрос",
   "session.question.restore": "Восстановить вопрос",
   "session.question.pending.one": "{{count}} вопрос без ответа",
+  "session.question.pending.few": "{{count}} вопроса без ответа",
+  "session.question.pending.many": "{{count}} вопросов без ответа",
   "session.question.pending.other": "Вопросы без ответа: {{count}}",
   "session.followupDock.summary.one": "{{count}} сообщение в очереди",
+  "session.followupDock.summary.few": "{{count}} сообщения в очереди",
+  "session.followupDock.summary.many": "{{count}} сообщений в очереди",
   "session.followupDock.summary.other": "Сообщений в очереди: {{count}}",
   "session.followupDock.sendNow": "Отправить сейчас",
   "session.followupDock.edit": "Редактировать",
   "session.followupDock.collapse": "Свернуть сообщения в очереди",
   "session.followupDock.expand": "Развернуть сообщения в очереди",
   "session.revertDock.summary.one": "{{count}} сообщение возвращено",
+  "session.revertDock.summary.few": "{{count}} сообщения возвращены",
+  "session.revertDock.summary.many": "{{count}} сообщений возвращено",
   "session.revertDock.summary.other": "Возвращено сообщений: {{count}}",
   "session.revertDock.collapse": "Свернуть возвращённые сообщения",
   "session.revertDock.expand": "Развернуть возвращённые сообщения",

packages/app/src/i18n/uk.ts

@@ -682,14 +682,20 @@ export const dict = {
   "session.question.minimize": "Згорнути запитання",
   "session.question.restore": "Відновити запитання",
   "session.question.pending.one": "{{count}} запитання очікує відповіді",
+  "session.question.pending.few": "{{count}} запитання очікують відповіді",
+  "session.question.pending.many": "{{count}} запитань очікують відповіді",
   "session.question.pending.other": "Запитання, що очікують відповіді: {{count}}",
   "session.followupDock.summary.one": "{{count}} повідомлення в черзі",
+  "session.followupDock.summary.few": "{{count}} повідомлення в черзі",
+  "session.followupDock.summary.many": "{{count}} повідомлень у черзі",
   "session.followupDock.summary.other": "{{count}} повідомлень у черзі",
   "session.followupDock.sendNow": "Надіслати зараз",
   "session.followupDock.edit": "Редагувати",
   "session.followupDock.collapse": "Згорнути повідомлення в черзі",
   "session.followupDock.expand": "Розгорнути повідомлення в черзі",
   "session.revertDock.summary.one": "{{count}} скасоване повідомлення",
+  "session.revertDock.summary.few": "{{count}} скасовані повідомлення",
+  "session.revertDock.summary.many": "{{count}} скасованих повідомлень",
   "session.revertDock.summary.other": "{{count}} скасованих повідомлень",
   "session.revertDock.collapse": "Згорнути скасовані повідомлення",
   "session.revertDock.expand": "Розгорнути скасовані повідомлення",

packages/app/src/pages/session/composer/session-followup-dock.tsx

@@ -18,11 +18,7 @@ export function SessionFollowupDock(props: {
 
   const toggle = () => setStore("collapsed", (value) => !value)
   const total = createMemo(() => props.items.length)
-  const label = createMemo(() =>
-    language.t(total() === 1 ? "session.followupDock.summary.one" : "session.followupDock.summary.other", {
-      count: total(),
-    }),
-  )
+  const label = createMemo(() => language.plural("session.followupDock.summary", total()))
   const preview = createMemo(() => props.items[0]?.text ?? "")
 
   return (

packages/app/src/pages/session/composer/session-revert-dock.tsx

@@ -29,11 +29,7 @@ export function SessionRevertDock(props: {
 
   const toggle = () => setStore("collapsed", (value) => !value)
   const total = createMemo(() => props.items.length)
-  const label = createMemo(() =>
-    language.t(total() === 1 ? "session.revertDock.summary.one" : "session.revertDock.summary.other", {
-      count: total(),
-    }),
-  )
+  const label = createMemo(() => language.plural("session.revertDock.summary", total()))
   const preview = createMemo(() => props.items[0]?.text ?? "")
 
   const onHeaderKeyDown = (event: KeyboardEvent) => {

packages/app/src/pages/session/timeline/message-timeline.tsx

@@ -161,10 +161,7 @@ function TimelineDiffSummaryRow(props: { diffs: SummaryDiff[] }) {
     >
       <div data-slot="session-turn-diffs-header">
         <span data-slot="session-turn-diffs-label">
-          {language.t(
-            props.diffs.length === 1 ? "ui.sessionTurn.diffs.changed.one" : "ui.sessionTurn.diffs.changed.other",
-            { count: String(props.diffs.length) },
-          )}
+          {language.plural("ui.sessionTurn.diffs.changed", props.diffs.length)}
         </span>
         <DiffChanges changes={props.diffs} />
         <Show when={overflow() > 0}>