fix: always color replaceable packages as orange

[gameroman]

🔗 Linked issue

🧭 Context

Before:

After:

📚 Description

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
npmx.dev	Ready	Preview, Comment	May 14, 2026 9:30pm

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
docs.npmx.dev	Ignored	Preview	May 14, 2026 9:30pm
npmx-lunaria	Ignored		May 14, 2026 9:30pm

[coderabbitai]

📝 Walkthrough

Summary by CodeRabbit

• Bug Fixes
  • Improved the visual display of dependency statuses in the package component. Replacement dependencies now receive appropriate highlighting with corrected priority ordering. This ensures clearer visual distinction when dependencies have multiple conditions applied simultaneously, such as replacements alongside vulnerability or deprecation indicators, enhancing overall interface clarity.

Walkthrough

The PR reorders CSS class selection priority in a single dependency version highlighting function. Replacement status now takes precedence over vulnerable or deprecated status when determining the visual highlight colour.

Changes

Dependency version class priority

Layer / File(s)	Summary
Version class priority reordering app/components/Package/Dependencies.vue	getDepVersionClass checks replacementDeps first to apply the amber replacement highlight, then checks vulnerable or deprecated status; the conditional order was reversed from the previous implementation.

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely describes the main change: ensuring replaceable packages are always displayed in orange, which matches the primary modification to the CSS class selection priority in getDepVersionClass.
Description check	✅ Passed	The description is related to the changeset, providing a visual before/after comparison of the colour change for replaceable packages, though it lacks detailed explanatory text about the technical implementation.
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.

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

✨ 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

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

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

🧹 Nitpick comments (1)

app/components/Package/Dependencies.vue (1)

83-84: ⚡ Quick win

Consider simplifying the redundant conditional.

Both lines 83 and 84 return getVersionClass(undefined), making the conditional check on line 83 functionally redundant. Since vulnerable and deprecated dependencies use the same default styling (represented by icons rather than version text colour), you could simplify this to:

  if (replacementDeps.value[dep]) return 'text-amber-700 dark:text-amber-500'
- if (getVulnerableDepInfo(dep) || getDeprecatedDepInfo(dep)) return getVersionClass(undefined)
  return getVersionClass(undefined)

This removes the unnecessary condition whilst maintaining identical behaviour. If you're planning to differentiate vulnerable/deprecated styling in future, keep the structure; otherwise, the simplification improves readability.

🤖 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/components/Package/Dependencies.vue` around lines 83 - 84, The
conditional in Dependencies.vue is redundant: both branches return
getVersionClass(undefined) when checking getVulnerableDepInfo(dep) ||
getDeprecatedDepInfo(dep); simplify by removing the if-check and directly return
getVersionClass(undefined) (keeping references to getVulnerableDepInfo,
getDeprecatedDepInfo, getVersionClass and the dep parameter in mind) unless you
intentionally plan to add different styling for vulnerable/deprecated deps in
which case preserve the current structure.

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

Nitpick comments:
In `@app/components/Package/Dependencies.vue`:
- Around line 83-84: The conditional in Dependencies.vue is redundant: both
branches return getVersionClass(undefined) when checking
getVulnerableDepInfo(dep) || getDeprecatedDepInfo(dep); simplify by removing the
if-check and directly return getVersionClass(undefined) (keeping references to
getVulnerableDepInfo, getDeprecatedDepInfo, getVersionClass and the dep
parameter in mind) unless you intentionally plan to add different styling for
vulnerable/deprecated deps in which case preserve the current structure.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: aa8f8aab-7a26-4a99-9ccd-305b31b81706

📥 Commits

Reviewing files that changed from the base of the PR and between 500c2e3 and 8c595c9.

📒 Files selected for processing (1)

• app/components/Package/Dependencies.vue

[serhalp]

could we add test coverage for this precedence?