refactor: use useVisibleItems in vulnerability tree

[43081j]

🔗 Linked issue

N/A

🧭 Context

Part of moving to the useVisibleItems composable.

📚 Description

Switches the vulnerability tree to use the new useVisibleItems
composable.

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
npmx.dev	Ready	Preview, Comment	Apr 7, 2026 8:56am

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
docs.npmx.dev	Ignored		Apr 7, 2026 8:56am
npmx-lunaria	Ignored		Apr 7, 2026 8:56am

[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]

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: b09a2065-e73f-4cff-a53e-ab8911a9c9fb

📥 Commits

Reviewing files that changed from the base of the PR and between 15b53bf and fef1f6b.

📒 Files selected for processing (1)

• app/components/Package/VulnerabilityTree.vue

---

📝 Walkthrough

Walkthrough

The VulnerabilityTree.vue component was refactored to replace its local showAllPackages state and manual array slicing with the useVisibleItems composable. The component now uses visiblePackages directly for rendering and controls the "show all packages" button visibility and behaviour through the composable's hasMorePackages and expandPackages properties instead of a boolean toggle mechanism.

Possibly related PRs

• refactor: add new useVisibleItems composable #2395: Introduces the useVisibleItems composable and applies it to the Dependencies.vue component for similar "show more" pagination logic.

Suggested reviewers

• serhalp

🚥 Pre-merge checks | ✅ 1

✅ Passed checks (1 passed)

Check name	Status	Explanation
Description check	✅ Passed	The pull request description accurately describes the changeset, explaining the migration to useVisibleItems composable in the vulnerability tree.

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

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch jg/visible-voolnerabools

---

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.}

[ghostdevv]

@43081j what's an easy way to test this?

[43081j]

https://npmxdev-git-jg-visible-voolnerabools-npmx.vercel.app/package/gulp/v/2.7.0

this one shows it under the vulnerabilities box. you can expand some of them that have many vulnerabilities.