feat: add zero dependencies banner on the package page by floatDreamWithSong · Pull Request #2009 · npmx-dev/npmx.dev

floatDreamWithSong · 2026-03-09T15:58:44Z

🔗 Linked issue

Resolves #1900

🧭 Context

add app/components/Package/ZeroDirectDependencies.vue as a banner, and correspond a11y test statement in test/nuxt/a11y.spec.ts

📚 Description

highlight packages with 0 direct dependencies.
The intent is to show "this package will not balloon up the size of your node_modules", and also that 0 deps means reducing the risk of upcoming security issues.

vercel · 2026-03-09T15:58:49Z

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

Project	Deployment	Actions	Updated (UTC)
npmx.dev (canary)	Ready	Preview, Comment	Mar 10, 2026 6:03am

2 Skipped Deployments

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

github-actions · 2026-03-09T15:59:32Z

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.
i18n/locales/zh-CN.json	Localization changed, will be marked as complete.

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 · 2026-03-09T16:01:38Z

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 · 2026-03-09T16:06:49Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 893747ce-ae2a-46f8-a506-c2307c7440a0

📥 Commits

Reviewing files that changed from the base of the PR and between f526ea5 and 61b7a3b.

📒 Files selected for processing (6)

app/components/Package/ZeroDependencies.vue
app/pages/package/[[org]]/[name].vue
i18n/locales/en.json
i18n/locales/zh-CN.json
i18n/schema.json
test/nuxt/a11y.spec.ts

🚧 Files skipped from review as they are similar to previous changes (3)

test/nuxt/a11y.spec.ts
i18n/locales/en.json
app/pages/package/[[org]]/[name].vue

📝 Walkthrough

Walkthrough

This pull request implements a feature to highlight packages with zero direct dependencies. It adds a new computed property to detect when a package lacks both dependencies and optional dependencies, rendering a new PackageZeroDependencies UI component in those cases. Supporting changes include translation keys for English and Chinese locales, schema updates to the i18n definitions, and accessibility testing for the new component.

Possibly related PRs

fix(i18n): add zh-CN translations to entries that lack translations #1406: Modifies the Chinese locale file by expanding translation keys under package dependencies, sharing similar i18n structure changes.
fix(ui): reduce cls to 0 on package page #1304: Modifies the package page component rendering logic and dependency display behaviour, affecting the same presentation layer.

Suggested labels

front, a11y

Suggested reviewers

danielroe
9romise

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description check	✅ Passed	The pull request description is directly related to the changeset, clearly explaining the addition of a zero dependencies banner component and corresponding tests.
Linked Issues check	✅ Passed	The pull request successfully implements all objectives from issue `#1900`: adds a visual highlight for packages with zero direct dependencies with a green banner aesthetic, communicates benefits (smaller node_modules and reduced security risk), and integrates accessibility testing.
Out of Scope Changes check	✅ Passed	All changes are directly scoped to the linked issue `#1900`. The additions include the zero dependencies component, i18n translations in English and Chinese, schema updates, accessibility tests, and related Vue component implementations.

_{✏️ 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

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 and usage tips.}

coderabbitai

Actionable comments posted: 3

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: e2f4d65b-92fe-4fc1-a91c-285b03ab325b

📥 Commits

Reviewing files that changed from the base of the PR and between 04f3ab9 and 220a136.

📒 Files selected for processing (6)

app/components/Package/ZeroDirectDependencies.vue
app/pages/package/[[org]]/[name].vue
i18n/locales/en.json
i18n/locales/zh-CN.json
i18n/schema.json
test/nuxt/a11y.spec.ts

app/components/Package/ZeroDependencies.vue

i18n/locales/en.json

coderabbitai

Actionable comments posted: 1

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 7c6c96c9-b8f9-407a-8c7a-27b367234cc9

📥 Commits

Reviewing files that changed from the base of the PR and between 220a136 and fea7666.

📒 Files selected for processing (4)

app/components/Package/ZeroDirectDependencies.vue
app/pages/package/[[org]]/[name].vue
i18n/locales/en.json
i18n/locales/zh-CN.json

🚧 Files skipped from review as they are similar to previous changes (3)

i18n/locales/zh-CN.json
app/components/Package/ZeroDirectDependencies.vue
i18n/locales/en.json

app/pages/package/[[org]]/[name].vue

ghostdevv · 2026-03-10T06:01:55Z

i18n/locales/en.json

+      "has_replacement": "This dependency has suggested replacements",
+      "zero_dependencies": {
+        "title": "0 dependencies",
+        "description": "This package can help keep node_modules smaller and reduce the risk of upcoming security issues."


We want to make sure we get the wording right, so will share in the Discord to get some feedback 👀

feat: add zero direct dependencies banner for package detail page

220a136

vercel bot deployed to canary – npmx.dev March 9, 2026 16:01 View deployment

coderabbitai bot reviewed Mar 9, 2026

View reviewed changes

app/components/Package/ZeroDependencies.vue Show resolved Hide resolved

i18n/locales/en.json Outdated Show resolved Hide resolved

fix: improve zero direct dependencies messaging for clarity

fea7666

vercel bot deployed to canary – npmx.dev March 10, 2026 01:44 View deployment

coderabbitai bot reviewed Mar 10, 2026

View reviewed changes

app/pages/package/[[org]]/[name].vue Show resolved Hide resolved

fix: include optional dependencies check for zero direct dependencies

f526ea5

vercel bot deployed to canary – npmx.dev March 10, 2026 05:50 View deployment

ghostdevv changed the title ~~feat: add zero direct dependencies banner for package detail page~~ feat: add zero dependencies banner on the package page Mar 10, 2026

refactor: rename component and translation keys

61b7a3b

ghostdevv requested changes Mar 10, 2026

View reviewed changes

vercel bot deployed to canary – npmx.dev March 10, 2026 06:03 View deployment

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat: add zero dependencies banner on the package page#2009

feat: add zero dependencies banner on the package page#2009
floatDreamWithSong wants to merge 4 commits intonpmx-dev:mainfrom
floatDreamWithSong:main

floatDreamWithSong commented Mar 9, 2026 •

edited by ghostdevv

Loading

Uh oh!

vercel bot commented Mar 9, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Mar 9, 2026 •

edited

Loading

Uh oh!

codecov bot commented Mar 9, 2026

Uh oh!

coderabbitai bot commented Mar 9, 2026 •

edited

Loading

Walkthrough

Possibly related PRs

Suggested labels

Suggested reviewers

Uh oh!

coderabbitai bot left a comment

Uh oh!

Uh oh!

Uh oh!

coderabbitai bot left a comment

Uh oh!

Uh oh!

ghostdevv Mar 10, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

floatDreamWithSong commented Mar 9, 2026 • edited by ghostdevv Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🔗 Linked issue

🧭 Context

📚 Description

Uh oh!

vercel bot commented Mar 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Mar 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Lunaria Status Overview

Tracked Files

Uh oh!

codecov bot commented Mar 9, 2026

Codecov Report

Uh oh!

coderabbitai bot commented Mar 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Possibly related PRs

Suggested labels

Suggested reviewers

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

ghostdevv Mar 10, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

floatDreamWithSong commented Mar 9, 2026 •

edited by ghostdevv

Loading

vercel bot commented Mar 9, 2026 •

edited

Loading

github-actions bot commented Mar 9, 2026 •

edited

Loading

coderabbitai bot commented Mar 9, 2026 •

edited

Loading