Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
2 Skipped Deployments
|
Lunaria Status Overview🌕 This pull request will trigger status changes. Learn moreBy default, every PR changing files present in the Lunaria configuration's You can change this by adding one of the keywords present in the Tracked Files
Warnings reference
|
Codecov Report❌ Patch coverage is
📢 Thoughts on this report? Let us know! |
📝 WalkthroughWalkthroughAdds a translation status feature: a new page at /translation-status (app/pages/translation-status.vue) showing translation progress by locale and by file; adds navigation links in AppFooter, AppHeader (mobile), and Settings; introduces translation_status strings across i18n locale files and schema; updates useI18nStatus to expose a localesMap and change lookup; extends shared I18nStatus.sourceLocale with totalKeys; adds a prerender routeRule for /translation-status; updates canonical-redirects allowlist; adds two npm scripts for serving Lunaria. Possibly related PRs
Suggested reviewers
🚥 Pre-merge checks | ✅ 1 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (1 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches🧪 Generate unit tests (beta)
⚔️ Resolve merge conflicts (beta)
Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
| <button | ||
| type="button" | ||
| class="cursor-pointer inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded focus-visible:outline-accent/70 shrink-0" | ||
| @click="router.back()" | ||
| v-if="canGoBack" | ||
| > | ||
| <span class="i-lucide:arrow-left icon-rtl w-4 h-4" aria-hidden="true" /> | ||
| <span class="sr-only sm:not-sr-only">{{ $t('nav.back') }}</span> | ||
| </button> |
There was a problem hiding this comment.
Avoid per-button focus-visible utilities; rely on the global rule.
focus-visible:outline-accent/70 is applied on button elements here, but the project’s global CSS already defines button focus-visible styling; please remove the per-element utility class to keep the behaviour consistent.
Proposed fix
- class="cursor-pointer inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded focus-visible:outline-accent/70 shrink-0"
+ class="cursor-pointer inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded shrink-0"- class="text-xs text-accent hover:underline rounded focus-visible:outline-accent/70"
+ class="text-xs text-accent hover:underline rounded"Based on learnings: “In the npmx.dev project, ensure that focus-visible styling for button and select elements is implemented globally in app/assets/main.css … Do not apply per-element inline utility classes like focus-visible:outline-accent/70 on these elements in Vue templates or components.”
Also applies to: 259-269
| <div class="flex items-center justify-between mb-2"> | ||
| <p class="text-sm font-medium"> | ||
| {{ $t('translation_status.missing_keys', {}, { locale: localeEntry.lang }) }} | ||
| </p> |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
cat -n app/pages/translation-status.vue | sed -n '240,270p'Repository: npmx-dev/npmx.dev
Length of output: 1618
🏁 Script executed:
rg "localeEntry" app/pages/translation-status.vue -A 3 -B 3Repository: npmx-dev/npmx.dev
Length of output: 5562
🏁 Script executed:
fd -e json -e ts -e js -path "*locales*" | head -20Repository: npmx-dev/npmx.dev
Length of output: 229
🏁 Script executed:
rg "missing_keys" --type jsonRepository: npmx-dev/npmx.dev
Length of output: 6195
🏁 Script executed:
rg '\$t\([^,]+,\s*\{\s*count:' --type vue --type tsRepository: npmx-dev/npmx.dev
Length of output: 88
🏁 Script executed:
wc -l app/pages/translation-status.vueRepository: npmx-dev/npmx.dev
Length of output: 97
🏁 Script executed:
cat package.json | grep -A 5 -B 5 "@nuxtjs/i18n"Repository: npmx-dev/npmx.dev
Length of output: 422
🏁 Script executed:
rg '\$t\([^,]+,\s*{[^}]*count' app/ -A 1 -B 1Repository: npmx-dev/npmx.dev
Length of output: 183
🌐 Web query:
nuxtjs/i18n v10 pluralization count parameter $t function
💡 Result:
In @nuxtjs/i18n v10, pluralization is done via $t / t (because $tc / tc is removed after the Vue I18n upgrade). Use the count as the 2nd argument to $t. [1]
messages
// en.json (or messages object)
{
"apple": "no apples | one apple | {count} apples"
}template / code
{{ $t('apple', count) }} <!-- plural selection; {count} is implicit -->
{{ $t('apple', count, { count }) }} <!-- if you want to pass it explicitly -->So, the “pluralization count parameter” is the 2nd parameter to $t('key', count, ...). [2]
Sources: Nuxt i18n v10 migration (Vue I18n upgrade, $tc removed) [1], Vue I18n pluralization examples showing $t(key, plural) and optional {count} options [2].
🏁 Script executed:
cat i18n/schema.json | grep -A 10 "missing_keys"Repository: npmx-dev/npmx.dev
Length of output: 566
🏁 Script executed:
rg "type FileEntryStatus" app/ -A 15Repository: npmx-dev/npmx.dev
Length of output: 43
🏁 Script executed:
sed -n '1,100p' app/pages/translation-status.vue | tail -50Repository: npmx-dev/npmx.dev
Length of output: 1681
🏁 Script executed:
rg '\$t\([^,]+,\s*[^{][^,]*,\s*\{' app/ --type ts --type vue -B 1 -A 1 | head -40Repository: npmx-dev/npmx.dev
Length of output: 88
🏁 Script executed:
sed -n '1,150p' app/pages/translation-status.vue | grep -A 30 "type FileEntryStatus"Repository: npmx-dev/npmx.dev
Length of output: 43
🌐 Web query:
vue-i18n v10 $t function signature pluralization second parameter
💡 Result:
In vue-i18n v10, $t / t are overloaded. For pluralization, the 2nd parameter can be a number:
-
Plural only:
t(key, plural)- Example:
$t('car', 1),$t('car', 2)(2nd arg is the plural choice number). [1][2]
- Example:
-
Plural + options (recommended/clear):
t(key, plural, options)whereoptionscan includenamed,list, etc.- Example:
$t('apple', 10, { named: { count: 10 } }). [1][2][5]
- Example:
-
Plural + named (alternate overload also supported in v10):
t(key, named, plural)- Example:
$t('apple', { count: 10 }, 10). [3][4]
- Example:
Also, v10 legacy mode uses the same overload signatures as composition mode, so don’t use the old “locale as 2nd argument” signatures anymore. [4]
🏁 Script executed:
rg '\$t\(['\''"][^'\''"]+'\'',\s*[a-zA-Z0-9]+\s*[,\)]' app/ -A 1 -B 1 | head -30Repository: npmx-dev/npmx.dev
Length of output: 43
🏁 Script executed:
sed -n '255,275p' app/pages/translation-status.vueRepository: npmx-dev/npmx.dev
Length of output: 1048
Pass the missing count so plural forms resolve correctly.
The key has plural variants but the count is not provided, preventing correct variant selection. localeEntry.missing is available and should be passed to the $t function.
🛠️ Suggested fix
- {{ $t('translation_status.missing_keys', {}, { locale: localeEntry.lang }) }}
+ {{
+ $t(
+ 'translation_status.missing_keys',
+ { count: localeEntry.missing },
+ { locale: localeEntry.lang },
+ )
+ }}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <div class="flex items-center justify-between mb-2"> | |
| <p class="text-sm font-medium"> | |
| {{ $t('translation_status.missing_keys', {}, { locale: localeEntry.lang }) }} | |
| </p> | |
| <div class="flex items-center justify-between mb-2"> | |
| <p class="text-sm font-medium"> | |
| {{ | |
| $t( | |
| 'translation_status.missing_keys', | |
| { count: localeEntry.missing }, | |
| { locale: localeEntry.lang }, | |
| ) | |
| }} | |
| </p> |
| "missing_keys": "There is no missing translations | Missing translation | Missing translations", | ||
| "progress_label": "Progress status for {locale}", | ||
| "table": { | ||
| "file": "File", | ||
| "status": "Status", | ||
| "error": "Error while loading file list.", | ||
| "loading": "{spinner} Loading translation files...", | ||
| "empty": "No files found", |
There was a problem hiding this comment.
Tighten the loading/missing copy to avoid grammar issues and placeholder leakage.
translation_status.missing_keys reads ungrammatically, and translation_status.table.loading includes a {spinner} placeholder that isn’t populated in the UI.
📝 Suggested copy tweaks
- "missing_keys": "There is no missing translations | Missing translation | Missing translations",
+ "missing_keys": "No missing translations | Missing translation | Missing translations",
- "loading": "{spinner} Loading translation files...",
+ "loading": "Loading translation files...",📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| "missing_keys": "There is no missing translations | Missing translation | Missing translations", | |
| "progress_label": "Progress status for {locale}", | |
| "table": { | |
| "file": "File", | |
| "status": "Status", | |
| "error": "Error while loading file list.", | |
| "loading": "{spinner} Loading translation files...", | |
| "empty": "No files found", | |
| "missing_keys": "No missing translations | Missing translation | Missing translations", | |
| "progress_label": "Progress status for {locale}", | |
| "table": { | |
| "file": "File", | |
| "status": "Status", | |
| "error": "Error while loading file list.", | |
| "loading": "Loading translation files...", | |
| "empty": "No files found", |
| "p1_count": "0 messages | 1 message |{count} messages", | ||
| "p2": "Before starting, please read our {guide} to learn about our translation process and how you can get involved.", | ||
| "guide": "localization (i18n) guide", | ||
| "by_locale": "Translation progress by locale", | ||
| "by_file": "Translation progress by file", | ||
| "locale_summary": "{name} ({id})", | ||
| "complete_text": "This translation is complete, amazing job!", | ||
| "done_text": "done", | ||
| "missing_text": "missing", | ||
| "missing_keys": "There is no missing translations | Missing translation | Missing translations", |
There was a problem hiding this comment.
Fix plural copy and spacing in translation counts.
There’s a missing space before {count} and the first plural form reads awkwardly.
📝 Suggested fix
- "p1_count": "0 messages | 1 message |{count} messages",
+ "p1_count": "0 messages | 1 message | {count} messages",
- "missing_keys": "There is no missing translations | Missing translation | Missing translations",
+ "missing_keys": "There are no missing translations | Missing translation | Missing translations",📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| "p1_count": "0 messages | 1 message |{count} messages", | |
| "p2": "Before starting, please read our {guide} to learn about our translation process and how you can get involved.", | |
| "guide": "localization (i18n) guide", | |
| "by_locale": "Translation progress by locale", | |
| "by_file": "Translation progress by file", | |
| "locale_summary": "{name} ({id})", | |
| "complete_text": "This translation is complete, amazing job!", | |
| "done_text": "done", | |
| "missing_text": "missing", | |
| "missing_keys": "There is no missing translations | Missing translation | Missing translations", | |
| "p1_count": "0 messages | 1 message | {count} messages", | |
| "p2": "Before starting, please read our {guide} to learn about our translation process and how you can get involved.", | |
| "guide": "localization (i18n) guide", | |
| "by_locale": "Translation progress by locale", | |
| "by_file": "Translation progress by file", | |
| "locale_summary": "{name} ({id})", | |
| "complete_text": "This translation is complete, amazing job!", | |
| "done_text": "done", | |
| "missing_text": "missing", | |
| "missing_keys": "There are no missing translations | Missing translation | Missing translations", |
|
will mark as draft while you're working on it 🙏 |
2 participants
This PR adds a new page to replace https://i18n.npmx.dev/ and the
lunaria/components.tsmodule that runs withbuild:lunaria.This PR includes:
lunaria/components.tsmodule but at npmx.devuseI18nStatusto replacearray.findwithmap.getrunandstartlunaria dev server (lunaria/components.tsmodule generates an html):run:lunariaandstart:lunaria=> both scripts andlunaria/components.tsmodule can be removed later.I have no idea where is the logic to extract outdated logic, maybe we move the logic when we add
i18n:check*scripts.DON'T MERGE YET: I need to fix hydration missmatch errors.
Context:
dir="rtl"when required (we can usedir="auto"but thenrtl-flipwon't work, checkRTL SupportatCONTRIBUTING.md).$n(<file|entry>.percentComplete / 100, 'percentage', <file|entry>.lang)to allowIntladd the percentage symbol (some locales using space between the percertange and the%symbol:percentageis defined atnumberFormats(config/i18n.ts)