Translation Progress Card
Translation progress panel listing each language with a percent complete bar, exact string counts, and a Live, Preview, or Draft status badge.
Translation progress panel listing each language with a percent complete bar, exact string counts, and a Live, Preview, or Draft status badge.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Translation Progress Card shows 8 languages as ruled rows with a thin progress bar, a right-aligned percent and exact string counts, and a status badge. English, Spanish, and German are Live at 480 of 480. French sits at 412 of 480 (85%) and Portuguese, Japanese follow in Preview. Korean at 219 of 480 and Chinese (Simplified) at 298 of 480 are Draft. The header reads 3 of 8 languages live, 480 total strings. The footer draws the policy line: a language goes live only when it reaches 100%, partial translations stay in preview and fall back to English for missing strings.
Languages are one typed array with a LangStatus union, translated and total counts, and percent computed inline. All counts carry tabular-nums. The footer makes the shipping gate explicit so users do not wonder why their 99% language is still in preview.
Reach for this block at the top of the localization settings page as the summary before the per-locale translation tables. Wire translated and total to your translation store so the bars update as strings are completed.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the localization dashboard overview. Other progress card configurations:
Tip: the 100% gate note in the footer prevents the support ticket asking why a mostly complete language is not showing up for users.