feat: improve i18n (lunaria) status page

[alex-key]

🧭 Context

i18n status page was designed to track multiple files. Since we are using a single file for each location - it could be improved

📚 Description

The following changes were done:

• use processed and optimized jsonStatus object instead of lunaria-generated status object
• removed "Translation status by file" section on the bottom as it's not needed when we use a single file per location
• replaced same file output in each locale ("i18n/locales/en.json") with correct locale filename
• replaced redundant report per file "0 done, 1 outdated,0 missing" with missing keys count
• improved progress bar render based on competion %
• added progress bar color scheme based on completion %
• general visual improvements: paddings, margins, borders, link hover state

Before

After

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
npmx.dev	Ready	Preview, Comment	Mar 14, 2026 10:09am

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
docs.npmx.dev	Ignored	Preview	Mar 14, 2026 10:09am
npmx-lunaria	Ignored		Mar 14, 2026 10:09am

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ All tests successful. No failed tests found.

📢 Thoughts on this report? Let us know!

[coderabbitai]

📝 Walkthrough

Walkthrough

This pull request refactors the Lunaria components to use an I18nStatus type instead of LunariaStatus, removing dependencies on the LunariaInstance parameter from public component signatures. The changes include introducing new helper components (MissingKeysList, ContentDetailsLinks, ProgressBar, Link, TitleParagraph), updating the rendering logic to display locale-specific progress metrics, and deferring HTML dashboard generation to after jsonStatus construction. Stylesheet updates introduce new colour tokens and comprehensive progress-related styling to support the updated UI structure.

Possibly related PRs

• style: fix i18n lunaria style #1737: Both PRs modify the lunaria styles, introducing and adjusting progress bar styling and colour tokens that directly overlap in implementation.

Suggested reviewers

• danielroe
• graphieros

🚥 Pre-merge checks | ✅ 1

✅ Passed checks (1 passed)

Check name	Status	Explanation
Description check	✅ Passed	The PR description clearly relates to the changeset, detailing specific improvements to the i18n status page including using jsonStatus, removing file-based reporting, improving progress bars, and visual enhancements.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

📝 Coding Plan

• Generate coding plan for human review comments

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 3

🧹 Nitpick comments (1)

lunaria/components.ts (1)

260-261: Avoid ! after find().

If localizations does not contain lang, this throws before any fallback status can be rendered. A small guard keeps this exported helper safe if the per-file view is brought back.

Safer fallback

-  const localization = localizations.find(l => l.lang === lang)!
+  const localization = localizations.find(l => l.lang === lang)
+  if (!localization) {
+    return html`<td>${EmojiFileLink(null, 'missing')}</td>`
+  }

As per coding guidelines, "Ensure you write strictly type-safe code, for example by ensuring you always check when accessing an array value by index".

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 8dd22553-934d-4d27-9362-b2a69b3d653e

📥 Commits

Reviewing files that changed from the base of the PR and between a170292 and 326dc61.

📒 Files selected for processing (3)

• lunaria/components.ts
• lunaria/lunaria.ts
• lunaria/styles.ts

[coderabbitai]

⚠️ Potential issue | 🟡 Minor

Render the resolved locale filename here.

The edit/history URLs are already built from the resolved path, but this label is reconstructed from lang. For locales whose primary edit target is a base file, the page will still say i18n/locales/ar-EG.json or i18n/locales/es-ES.json even though the link opens ar.json or es.json. Please carry the resolved file path through I18nStatus and render that instead.