feat(i18n): page titles and countries leaderboard table headers#749
Conversation
…ders - Add meta.* keys for page title suffixes (countries, addLocation, etc.) - Translate static page titles (Countries, Add Location, Communities, etc.) - Translate dynamic suffixes (Merchant, Country, Community, Supertagger) - Add og:title where missing, use name= for Twitter meta - Translate countries/communities leaderboard table headers (Position, Name, Total Locations, Verified Locations, Grade) via areaLeaderboard.* keys Made-with: Cursor
👷 Deploy request for btcmap pending review.Visit the deploys page to approve it
|
📝 WalkthroughWalkthroughThis PR adds internationalization support to page metadata and leaderboard headers across multiple routes and components. Hard-coded strings in page titles, meta tags, and column headers are replaced with localized key lookups, with corresponding translation entries added to Bulgarian, English, and Portuguese-Brazilian locale files. Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested labels
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 inconclusive)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
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. Comment |
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
src/components/leaderboard/AreaLeaderboard.svelte (1)
374-384: Consider using the same “Locations” keys on mobile sorting headers for consistency.Mobile currently uses
areaLeaderboard.total/areaLeaderboard.verified, while desktop headers usetotalLocations/verifiedLocations.💡 Suggested patch
- label={$_(`areaLeaderboard.total`)} + label={$_(`areaLeaderboard.totalLocations`)} @@ - label={$_(`areaLeaderboard.verified`)} + label={$_(`areaLeaderboard.verifiedLocations`)}🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/components/leaderboard/AreaLeaderboard.svelte` around lines 374 - 384, The mobile sort header labels in the SortHeaderButton components (columns accessed via $table?.getColumn('total') and $table?.getColumn('upToDateElements')) use translation keys $_(`areaLeaderboard.total`) and $_(`areaLeaderboard.verified`) which are inconsistent with desktop; update both the label and ariaLabel usages to use the same desktop keys ($_(`areaLeaderboard.totalLocations`) and $_(`areaLeaderboard.verifiedLocations`)) so mobile and desktop sorting headers are consistent (change both label and ariaLabel for the two SortHeaderButton instances).
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@src/routes/community/`[area]/[section]/+page.svelte:
- Around line 21-24: The social and page title meta tags (the <title>, og:title,
and twitter:title lines using the name variable and $_('meta.community'))
currently render "BTC Map Community"; update those templates so when name is
present they still prepend "name - " and ensure there is a separator before the
translated suffix by inserting " - " between "BTC Map" and $_('meta.community')
(i.e., use the same conditional name ? name + ' - ' : '' prefix and change the
suffix from "BTC Map {$_('meta.community')}" to "BTC Map -
{$_('meta.community')}") so all three tags produce "Name - BTC Map - Community"
or "BTC Map - Community" consistently.
In `@src/routes/country/`[area]/[section]/+page.svelte:
- Around line 38-41: The head metadata currently uses data.name (in the <title>,
og:title and twitter:title) which bypasses the localized display string; update
those three places to use countryDisplayName instead of data.name so the page
title and social meta tags reflect the localized name (replace occurrences of
data.name + ' - ' with countryDisplayName + ' - ' in the title, og:title and
twitter:title).
---
Nitpick comments:
In `@src/components/leaderboard/AreaLeaderboard.svelte`:
- Around line 374-384: The mobile sort header labels in the SortHeaderButton
components (columns accessed via $table?.getColumn('total') and
$table?.getColumn('upToDateElements')) use translation keys
$_(`areaLeaderboard.total`) and $_(`areaLeaderboard.verified`) which are
inconsistent with desktop; update both the label and ariaLabel usages to use the
same desktop keys ($_(`areaLeaderboard.totalLocations`) and
$_(`areaLeaderboard.verifiedLocations`)) so mobile and desktop sorting headers
are consistent (change both label and ariaLabel for the two SortHeaderButton
instances).
ℹ️ Review info
Configuration used: defaults
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (15)
src/components/leaderboard/AreaLeaderboard.sveltesrc/lib/i18n/locales/bg.jsonsrc/lib/i18n/locales/en.jsonsrc/lib/i18n/locales/pt-BR.jsonsrc/routes/add-location/+page.sveltesrc/routes/communities/[section]/+page.sveltesrc/routes/communities/add/+page.sveltesrc/routes/communities/leaderboard/+page.sveltesrc/routes/communities/map/+page.sveltesrc/routes/community/[area]/[section]/+page.sveltesrc/routes/countries/[section]/+page.sveltesrc/routes/countries/leaderboard/+page.sveltesrc/routes/country/[area]/[section]/+page.sveltesrc/routes/merchant/[id]/+page.sveltesrc/routes/tagger/[id]/+page.svelte
…tors, countryDisplayName Made-with: Cursor
…ggerOnboarding Made-with: Cursor
Summary by CodeRabbit