feat: update frontend UI components and search form - #18
Conversation
Update PackageCard, SearchForm, and related components with improved styling and functionality. Includes test updates and dependency changes.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Standalone output is only needed for Docker self-hosting, but it breaks Vercel deploys: their onBuildComplete step cannot find the .nft.json trace files. Only enable it when not building on Vercel.
There was a problem hiding this comment.
General review — I ran the full verification suite on this branch and it's green:
tsc(type check) passesjestpasses: 4 suites / 25 testseslintpasses with no warnings
The search → SSE streaming → highlighted recommendation flow reads well, and the highlight fallback plus the ###-header parsing is a sensible design. Two minor things:
-
Dead code:
frontend/hooks/useHealthCheck.tsis no longer imported anywhere (only self-references within the file; the health routeapp/api/search/health/route.tsis independent). If the UI doesn't use the health check anymore, this file should be deleted — otherwise it reads like the hook is live when it isn't. -
"Showing top 6 results" footer text hardcodes 6, but the value comes from the backend's result limit. If the limit changes, the copy silently drifts. Consider passing the count from the search response or making it a constant shared with the backend. (Minor — not blocking.)
Overall this is a solid UI PR; the inline comments on the recommendation-highlighting regex are the only functional nits.
- Strip trailing punctuation from `### package-name` headers so `### zod.` still highlights the `zod` card - Match fallback names as whole tokens so `react` does not highlight `preact`/`react-router`/`react-dom` - Delete unused useHealthCheck hook and update stale doc references - Show actual result count instead of hardcoded "top 6"
|
All review feedback addressed in
Verification (independently re-run): |
Summary
Test plan
cd frontend && npx tsc --noEmit)cd frontend && npx jest)