Global i18n at Scale

// Lazy load locale namespace
const messages = await import(
  `@/locales/${locale}/checkout.json`
);
i18n.addResourceBundle(locale, "checkout", messages.default);

// Fallback chain with a single network round trip per namespace.
const CHAIN: Record<string, string[]> = {
  "es-MX": ["es-MX", "es", "en"],
  "pt-BR": ["pt-BR", "pt", "en"],
};

export async function loadNamespace(locale: string, ns: string) {
  for (const candidate of CHAIN[locale] ?? [locale, "en"]) {
    const res = await fetch(`/i18n/${candidate}/${ns}.${HASH}.json`, {
      cache: "force-cache",           // hashed URL => immutable, 1y max-age
    });
    if (res.ok) return { locale: candidate, messages: await res.json() };
  }
  throw new Error(`missing_namespace:${ns}`);
}

// Missing key must degrade, never crash: render the English string and report once.
export function t(key: string, vars?: Record<string, unknown>): string {
  const msg = store.get(key) ?? source.get(key);
  if (!store.has(key)) reportOnce("i18n_missing_key", { key, locale: store.locale });
  return msg ? format(msg, vars) : key;
}

/* Direction-aware without duplicating a whole stylesheet. */
.drawer {
  inset-inline-start: 0;          /* left in LTR, right in RTL */
  padding-inline: 16px 24px;      /* start 16, end 24 */
  border-inline-start: 2px solid var(--accent);
}

/* Mirror only glyphs that encode direction. */
[dir="rtl"] .icon-chevron-forward { transform: scaleX(-1); }
[dir="rtl"] .brand-logo,
[dir="rtl"] .icon-play { transform: none; }  /* media controls never mirror */

/* Numerals, phone numbers, and code stay LTR inside RTL paragraphs. */
.code-inline, .phone { direction: ltr; unicode-bidi: isolate; }

// Edge middleware: resolve once, redirect, then cache per locale.
export function middleware(req: Request): Response | undefined {
  const url = new URL(req.url);
  if (LOCALE_PATH.test(url.pathname)) return;              // already localized

  const explicit = readCookie(req, "locale");              // user override wins
  const geo = req.headers.get("x-vercel-ip-country");      // hint, never a lock
  const accepted = pickBestLocale(req.headers.get("accept-language"), SUPPORTED);
  const locale = explicit ?? accepted ?? DEFAULT_BY_COUNTRY[geo ?? ""] ?? "en";

  url.pathname = `/${locale}${url.pathname}`;
  return Response.redirect(url, 307);                      // 307 keeps method + body
}

// Vary correctly or the CDN will serve Spanish HTML to English users.
// Cache-Control: public, s-maxage=600, stale-while-revalidate=86400
// Vary: Accept-Language, Cookie

{count, plural,
  =0 {No items}
  one {# item}
  other {# items}
}

// Real message: plural + select + inline formatting + BiDi-safe interpolation.
// en.json
"cart.summary": "{name} has {count, plural,
    =0 {no items}
    one {# item}
    other {# items}
  } totalling {total, number, ::currency/USD} — {gender, select,
    female {she}
    male {he}
    other {they}
  } saved {saved, number, ::percent}."

// ar.json — six plural categories, and the name is isolated so BiDi cannot flip it.
"cart.summary": "\u2068{name}\u2069 {count, plural,
    zero {لا عناصر} one {عنصر واحد} two {عنصران}
    few {# عناصر} many {# عنصرًا} other {# عنصر}
  } ..."

// Runtime
import { IntlMessageFormat } from "intl-messageformat";
const cache = new Map<string, IntlMessageFormat>();

export function formatMessage(locale: string, id: string, values: object): string {
  const key = `${locale}:${id}`;
  let mf = cache.get(key);                 // parsing ICU is the expensive part
  if (!mf) cache.set(key, (mf = new IntlMessageFormat(catalog[id], locale)));
  return mf.format(values) as string;
}

// Constructing Intl formatters is ~0.2–1ms each. In a 500-row table that is a frame budget.
const numberFmt = new Map<string, Intl.NumberFormat>();

export function currency(locale: string, code: string, value: number): string {
  const key = `${locale}:${code}`;
  let fmt = numberFmt.get(key);
  if (!fmt) numberFmt.set(key, (fmt = new Intl.NumberFormat(locale, {
    style: "currency", currency: code,
  })));
  return fmt.format(value);
}

// Pseudo-locale generator: accents prove the string went through t(),
// brackets prove nothing is clipped, padding simulates German/Finnish length.
const MAP: Record<string, string> = { a: "á", e: "é", i: "í", o: "ó", u: "ú" };

export function pseudo(msg: string): string {
  const body = msg.replace(/\{[^}]+\}/g, (m) => m)      // never touch ICU args
    .replace(/[aeiou]/g, (c) => MAP[c] ?? c);
  const pad = "~".repeat(Math.ceil(body.length * 0.35)); // +35% length
  return `⟦${body}${pad}⟧`;
}

// CI gate: coverage per shipped locale, not a global pass/fail.
const missing = Object.keys(en).filter((k) => !catalog[locale][k]);
const coverage = 1 - missing.length / Object.keys(en).length;
const threshold = LAUNCH_MARKETS.includes(locale) ? 0.98 : 0.9;
if (coverage < threshold) {
  fail(`${locale} coverage ${(coverage * 100).toFixed(1)}% — missing ${missing.length} keys`);
}