fix: show 404 page instead of blank on first visit to non-existent package

[2u841r]

Reopened from #2733.

previous one was mistakenly "closed by deleting the head repository 2 days ago"

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
npmx.dev	Ready	Preview, Comment	May 21, 2026 4:25pm

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
docs.npmx.dev	Ignored	Preview	May 21, 2026 4:25pm
npmx-lunaria	Ignored		May 21, 2026 4:25pm

[coderabbitai]

📝 Walkthrough

Walkthrough

The package detail page restructures resolved-version fetching to defer client-side awaiting. useResolvedVersion is wrapped in a reusable promise, awaited only server-side to enable synchronous 404 detection, whilst the client derives status reactively. The template skeleton condition now includes the resolved-status pending state.

Changes

Resolved Version Conditional Awaiting and Loading State

Layer / File(s)	Summary
Resolved version promise handling and skeleton loading condition app/pages/package/[[org]]/[name].vue	useResolvedVersion is wrapped in _resolvedVersionData and awaited only on import.meta.server, allowing the server to throw 404 synchronously whilst the client derives the status reactively without triggering Suspense. The PackageSkeleton visibility condition expands to include resolvedStatus === 'pending', broadening when the skeleton loader renders during resolved-version fetches.

🚥 Pre-merge checks | ✅ 3 | ❌ 1

❌ Failed checks (1 inconclusive)

Check name	Status	Explanation	Resolution
Description check	❓ Inconclusive	The description is related to the PR but only notes that it was reopened from another issue, without describing the actual changes.	Add a brief summary of the fix or affected page behaviour so the description matches the changeset.

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and specifically describes the main fix: preventing a blank page when visiting a non-existent package by showing a 404 page instead, which aligns with the code changes.
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

• X
• Mastodon
• Reddit
• LinkedIn

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

[2u841r]

previous one was mistakenly "closed by deleting the head repository 2 days ago"

[2u841r]

The description on #2733 (which this reopens) said the page stayed "completely blank until you refreshed." That's no longer quite accurate - retesting now, including with a genuinely never-queried, made-up package name, it still shows a blank flash (~200-300ms) before the 404 renders, but it resolves on its own without needing a manual refresh. So it's not just previously-queried names responding fast - even fresh, first-time lookups are quick now.

The root cause described there is still accurate and still present: useResolvedVersion is unconditionally awaited on the client, which suspends the component through Vue's Suspense with no fallback defined, so nothing renders while that fetch (to an external service, npm.antfu.dev) is in flight. I'm not sure why the flash is shorter than when I originally filed #2733 - possibly the upstream service or its network path just got faster - but the underlying bug is unchanged: any latency on that fetch still blocks rendering with no fallback.

Fix itself is unchanged: skip the await on the client, let the server still await so 404 can throw synchronously, rely on the existing watch for the client error case, and show the skeleton while resolvedStatus is pending.