The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
worldmonitor	Ready	Preview, Comment	Jun 26, 2026 1:08pm

Greptile Summary

This PR fixes a production bug where the checkout-failure banner displayed "undefined" text after the redirect-mode 3DS return, caused by t() calls resolving before i18next's full translation bundle had loaded. The fix adds defaultValue options to all four t() calls in checkout-failure-banner.ts, matching the en.json strings exactly.

• All four translation keys (message, retry, retrying, dismiss) now have English fallbacks, preventing the raw undefined value from reaching the DOM during the cold-init window when only the shell i18n bundle is loaded.
• The fix is correctly scoped: retry and retrying are called on user interaction (after the bundle will have loaded), so the defaults there are defensive; message and dismiss are emitted into static HTML during initial render where the race is live.

Confidence Score: 4/5

Safe to merge — the change is a minimal, targeted fix for a confirmed production regression with no functional regressions introduced.

All four t() calls now carry defaultValue strings that match en.json exactly, and the i18next defaultValue option is the canonical mechanism for this race. The one thing to be aware of: the message and dismiss strings are baked into static HTML at render time, and the container-scoped wm:i18n:resources-loaded healer does not reach this body-level banner — so non-English users who hit the failure banner during the cold-init window will see permanent English text rather than their locale. This is a pre-existing healer scope limitation and strictly better than the previous undefined output, but it means the PR description's claim that strings still pick up translations once the bundle loads is only true for the button-click paths.

src/components/checkout-failure-banner.ts — straightforward and correct; no changes needed before merging.

Important Files Changed

Sequence Diagram

%%{init: {'theme': 'neutral'}}%%
sequenceDiagram
    participant Browser
    participant App as App.ts (cold init)
    participant i18n as i18n service
    participant Banner as checkout-failure-banner.ts

    Browser->>App: "Full-page redirect back (/dashboard?wm_checkout=return&status=failed)"
    App->>i18n: initI18n() — loads en.shell.json (sync)
    Note over i18n: checkoutFailureBanner keys NOT in shell
    App->>i18n: preloadEnglishTranslation() fire-and-forget
    App->>Banner: showCheckoutFailureBanner(rawStatus)
    Banner->>i18n: "t('...message', {defaultValue: "Payment couldn't be completed..."})"
    Note over Banner: BEFORE fix: t() → undefined → "undefined" in DOM<br/>AFTER fix: t() → defaultValue → correct English text
    Banner->>Browser: Render red banner with English fallback text
    i18n-->>App: wm:i18n:resources-loaded event (full bundle ready)
    App->>App: replaceRawI18nKeyPlaceholders(container) — heals container scope only
    Note over Banner: Banner is body-level (outside container) — not re-healed<br/>retry/retrying text resolved correctly on user click

%%{init: {'theme': 'base', 'themeVariables': {"darkMode": true, "background": "#0d1117", "primaryColor": "#21262d", "primaryTextColor": "#e6edf3", "primaryBorderColor": "#8b949e", "lineColor": "#8b949e", "textColor": "#e6edf3", "edgeLabelBackground": "#161b22", "actorBkg": "#21262d", "actorBorder": "#8b949e", "actorTextColor": "#e6edf3", "actorLineColor": "#8b949e", "signalColor": "#8b949e", "signalTextColor": "#e6edf3", "noteBkgColor": "#373320", "noteBorderColor": "#d4a72c", "noteTextColor": "#f0e6c0", "labelBoxBkgColor": "#21262d", "labelBoxBorderColor": "#8b949e", "labelTextColor": "#e6edf3", "loopTextColor": "#e6edf3", "activationBkgColor": "#30363d", "activationBorderColor": "#8b949e"}}}%%
sequenceDiagram
    participant Browser
    participant App as App.ts (cold init)
    participant i18n as i18n service
    participant Banner as checkout-failure-banner.ts

    Browser->>App: "Full-page redirect back (/dashboard?wm_checkout=return&status=failed)"
    App->>i18n: initI18n() — loads en.shell.json (sync)
    Note over i18n: checkoutFailureBanner keys NOT in shell
    App->>i18n: preloadEnglishTranslation() fire-and-forget
    App->>Banner: showCheckoutFailureBanner(rawStatus)
    Banner->>i18n: "t('...message', {defaultValue: "Payment couldn't be completed..."})"
    Note over Banner: BEFORE fix: t() → undefined → "undefined" in DOM<br/>AFTER fix: t() → defaultValue → correct English text
    Banner->>Browser: Render red banner with English fallback text
    i18n-->>App: wm:i18n:resources-loaded event (full bundle ready)
    App->>App: replaceRawI18nKeyPlaceholders(container) — heals container scope only
    Note over Banner: Banner is body-level (outside container) — not re-healed<br/>retry/retrying text resolved correctly on user click

_{Reviews (1): Last reviewed commit: "fix(checkout): failure banner showed "un..." | Re-trigger Greptile}

Reviewed Greptile's note (verified at head 9512941016). It's valid, and a fair correction to my PR description.

Confirmed: replaceRawI18nKeyPlaceholders is invoked in App.ts scoped to this.state.container; this banner is document.body.appendChild (line 80), outside that scope. And the healer swaps raw key placeholders → my defaultValue renders English text (not a raw key), so it wouldn't be re-translated even if the healer reached it.

Net: for the statically-rendered message/dismiss, a non-English user who hits a payment failure during the cold-init window sees correct English, not their locale. The click-path retry/retrying resolve to locale (rendered after the bundle loads). So my description's "still picks up translations once loaded" is only true for the button paths — correcting that here.

Decision: ship as-is. English-on-a-narrow-cold-init-failure is strictly better than undefined, the intersection (non-English × failure × pre-bundle window) is tiny, and Greptile concurs (4/5, no changes needed).

If we want perfect i18n there later, the clean follow-up is a one-time I18N_RESOURCES_LOADED_EVENT listener on the mounted banner that re-runs t() on its text — happy to file it, but it's not worth blocking this prod-bug fix.