Skip to content

feat: sponsors#2967

Open
alexdln wants to merge 9 commits into
npmx-dev:mainfrom
alexdln:feat/sponsors
Open

feat: sponsors#2967
alexdln wants to merge 9 commits into
npmx-dev:mainfrom
alexdln:feat/sponsors

Conversation

@alexdln

@alexdln alexdln commented Jun 27, 2026

Copy link
Copy Markdown
Member

🧭 Context

A dedicated page for sponsors. This is useful for both current sponsors and those just considering it. It's a public and always-open source of important information

@vercel

vercel Bot commented Jun 27, 2026

Copy link
Copy Markdown
Contributor

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

Project Deployment Actions Updated (UTC)
npmx.dev Ready Ready Preview, Comment Jun 30, 2026 11:33am
2 Skipped Deployments
Project Deployment Actions Updated (UTC)
docs.npmx.dev Ignored Ignored Preview Jun 30, 2026 11:33am
npmx-lunaria Ignored Ignored Jun 30, 2026 11:33am

Request Review

@coderabbitai

coderabbitai Bot commented Jun 27, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

📝 Walkthrough

Summary by CodeRabbit

  • New Features

    • Added a new Sponsors page with pricing tiers, supporting information, and sponsor-focused content.
    • Added a Sponsors link in the footer and a new command palette entry for quick access.
    • Added a Sponsors call-to-action in the About page.
  • Bug Fixes

    • Updated site routing and redirects so the Sponsors page is handled correctly and can be opened reliably.

Walkthrough

A new /sponsors page is added as a statically prerendered Nuxt route. It displays sponsorship tiers (Silver, Gold, Platinum) with pricing, statistics, and logo lists. Supporting changes add i18n translations and schema, a footer link, a command palette entry, an about-page CTA, and a canonical-redirect allowlist entry.

Changes

Sponsors Page

Layer / File(s) Summary
i18n translations and schema
i18n/locales/en.json, i18n/schema.json
Adds footer.sponsors key and a new top-level sponsors_page object to both the English locale file and the i18n schema, covering page metadata, descriptive sections, stat card strings, and tier names (Silver/Gold/Platinum).
sponsors.vue page component
app/pages/sponsors.vue
New Nuxt page defining tier price constants, a USD currency formatter, SEO/OG metadata via useSeoMeta/defineOgImage, a full template with header, AboutLogoList sidebar, translated stat cards, tiers section with formatTierPrice, a community growth footnote, and a CSS module grid layout.
Routing and redirect allowlist
nuxt.config.ts, server/middleware/canonical-redirects.global.ts
Adds '/sponsors' to routeRules with prerender: true and appends it to the canonical-redirects middleware allowlist.
Navigation wiring
app/components/AppFooter.vue, app/composables/useCommandPaletteGlobalCommands.ts, app/pages/about.vue
Inserts a Sponsors FooterLink into the resources section, adds a sponsors global command palette entry with heart icon and route-active state, and adds a translated CTA LinkBase to /sponsors on the about page.

Possibly related PRs

  • npmx-dev/npmx.dev#1986: Modifies AboutLogoList and sponsor logo rendering, which the new /sponsors page directly reuses for its gold and silver logo sidebars.
  • npmx-dev/npmx.dev#2966: Also updates app/components/AppFooter.vue and app/pages/about.vue in the context of sponsors-related UI changes, overlapping with the footer link and about-page CTA added here.

Suggested reviewers

  • ghostdevv

Important

Pre-merge checks failed

Please resolve all errors before merging. Addressing warnings is optional.

❌ Failed checks (1 inconclusive)

Check name Status Explanation Resolution
Title check ❓ Inconclusive The title is relevant, but it is too terse and generic to clearly describe the main change. Use a more specific title, such as 'Add sponsors page and navigation links'.
✅ Passed checks (3 passed)
Check name Status Explanation
Description check ✅ Passed The description clearly matches the changes by explaining the new public sponsors page and its purpose.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

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

Comment @coderabbitai help to get the list of available commands.

@github-actions

github-actions Bot commented Jun 27, 2026

Copy link
Copy Markdown

Lunaria Status Overview

🌕 This pull request will trigger status changes.

Learn more

By default, every PR changing files present in the Lunaria configuration's files property will be considered and trigger status changes accordingly.

You can change this by adding one of the keywords present in the ignoreKeywords property in your Lunaria configuration file in the PR's title (ignoring all files) or by including a tracker directive in the merged commit's description.

Tracked Files

File Note
i18n/locales/en.json Source changed, localizations will be marked as outdated.
Warnings reference
Icon Description
🔄️ The source for this localization has been updated since the creation of this pull request, make sure all changes in the source have been applied.

@codecov

codecov Bot commented Jun 27, 2026

Copy link
Copy Markdown

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!

Comment thread i18n/locales/en.json Outdated
Comment thread i18n/locales/en.json Outdated

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Nitpick comments (1)
app/pages/sponsors.vue (1)

9-17: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Use the page-level $t() convention throughout <script setup>.

This file already uses $t() for SEO and OG metadata, and the repo guidance for app/pages/*.vue is to use the Nuxt i18n globals directly instead of destructuring t from useI18n(). Keeping one access pattern here will make follow-up edits cleaner.

Suggested tidy-up
-const { t } = useI18n()
 const currencyFormatter = useNumberFormatter({
   style: 'currency',
   currency: 'USD',
   maximumFractionDigits: 0,
 })
 
 function formatTierPrice(amount: number) {
-  return `${currencyFormatter.value.format(amount)}${t('sponsors_page.tiers.per_month')}`
+  return `${currencyFormatter.value.format(amount)}${$t('sponsors_page.tiers.per_month')}`
 }
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@app/pages/sponsors.vue` around lines 9 - 17, The script setup in the sponsors
page mixes direct page-level i18n usage with a destructured t from useI18n();
update it to follow the app/pages/*.vue convention by removing the useI18n()
destructuring and using the Nuxt global $t() consistently in formatTierPrice and
any other script-side translations, matching the existing SEO/OG metadata style.

Source: Learnings

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@app/pages/sponsors.vue`:
- Around line 91-145: The headline metrics in sponsors.vue are hardcoded
numerals, so they bypass locale formatting and won’t adapt on translated pages.
Update the metric blocks in the sponsors page template to use the existing
number formatting approach already used elsewhere (such as the
`useNumberFormatter`/`$n()` pattern), and keep the `+` suffix separate from the
formatted number. Focus on the static values in the section cards (`250`, `700`,
`200000`, `3400`) and preserve the current labels and layout.

---

Nitpick comments:
In `@app/pages/sponsors.vue`:
- Around line 9-17: The script setup in the sponsors page mixes direct
page-level i18n usage with a destructured t from useI18n(); update it to follow
the app/pages/*.vue convention by removing the useI18n() destructuring and using
the Nuxt global $t() consistently in formatTierPrice and any other script-side
translations, matching the existing SEO/OG metadata style.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 1669dad4-4f5e-4004-918b-9144b0eb1dfa

📥 Commits

Reviewing files that changed from the base of the PR and between d9e016f and 508cbf7.

📒 Files selected for processing (8)
  • app/components/AppFooter.vue
  • app/composables/useCommandPaletteGlobalCommands.ts
  • app/pages/about.vue
  • app/pages/sponsors.vue
  • i18n/locales/en.json
  • i18n/schema.json
  • nuxt.config.ts
  • server/middleware/canonical-redirects.global.ts

Comment thread app/pages/sponsors.vue
Comment on lines +91 to +145
<div class="grid gap-4 sm:grid-cols-12">
<section class="border border-border bg-bg-elevated rounded-lg p-5 sm:col-span-7">
<div class="grid grid-cols-2 gap-4">
<div>
<p class="font-mono text-2xl text-fg uppercase tracking-wider mb-2">250+</p>
<p class="text-fg-muted text-sm leading-relaxed m-0">
{{ $t('sponsors_page.what_this_means_for_you.cards.people.contributors') }}
</p>
</div>
<div>
<p class="font-mono text-2xl text-fg uppercase tracking-wider mb-2">700+</p>
<p class="text-fg-muted text-sm leading-relaxed m-0">
{{ $t('sponsors_page.what_this_means_for_you.cards.people.community_members') }}
</p>
</div>
</div>
</section>
<section class="border border-border rounded-lg p-5 bg-bg-subtle sm:col-span-5">
<p class="font-mono text-2xl text-fg uppercase tracking-wider mb-2">200000+</p>
<p class="text-fg-muted text-sm leading-relaxed m-0">
{{ $t('sponsors_page.what_this_means_for_you.cards.visitors.description') }}
</p>
</section>
<section class="border border-border rounded-lg p-5 bg-bg-subtle sm:col-span-4">
<p class="font-mono text-2xl text-fg uppercase tracking-wider mb-2">3400+</p>
<p class="text-fg-muted text-sm leading-relaxed m-0">
{{ $t('sponsors_page.what_this_means_for_you.cards.stars.title') }}
</p>
</section>
<section class="border border-border rounded-lg p-5 bg-bg-subtle sm:col-span-8">
<p class="font-mono text-2xl text-fg uppercase tracking-wider mb-2">
{{ $t('sponsors_page.what_this_means_for_you.cards.community.title') }}
</p>
<p class="text-fg-muted text-sm leading-relaxed m-0">
{{ $t('sponsors_page.what_this_means_for_you.cards.community.description')
}}<sup>*</sup>
</p>
</section>
<section class="border border-border rounded-lg p-5 bg-bg-subtle sm:col-span-6">
<p class="font-mono text-2xl text-fg uppercase tracking-wider mb-2">
{{ $t('sponsors_page.what_this_means_for_you.cards.adoption.title') }}
</p>
<p class="text-fg-muted text-sm leading-relaxed m-0">
{{ $t('sponsors_page.what_this_means_for_you.cards.adoption.description') }}
</p>
</section>
<section class="border border-border rounded-lg p-5 bg-bg-subtle sm:col-span-6">
<p class="font-mono text-2xl text-fg uppercase tracking-wider mb-2">
{{ $t('sponsors_page.what_this_means_for_you.cards.default_source.title') }}
</p>
<p class="text-fg-muted text-sm leading-relaxed m-0">
{{ $t('sponsors_page.what_this_means_for_you.cards.default_source.description') }}
</p>
</section>
</div>

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Locale-format the headline metrics instead of hardcoding raw numerals.

250+, 700+, 200000+, and 3400+ bypass localisation, so translated pages will still show unformatted English numerals. Since this page already formats currency via useNumberFormatter, these counts should go through $n() or the same formatter and append the + separately.

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@app/pages/sponsors.vue` around lines 91 - 145, The headline metrics in
sponsors.vue are hardcoded numerals, so they bypass locale formatting and won’t
adapt on translated pages. Update the metric blocks in the sponsors page
template to use the existing number formatting approach already used elsewhere
(such as the `useNumberFormatter`/`$n()` pattern), and keep the `+` suffix
separate from the formatted number. Focus on the static values in the section
cards (`250`, `700`, `200000`, `3400`) and preserve the current labels and
layout.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants