feat: project discovery filtering, sorting & test suite#33
Merged
Conversation
- Extract project data to data/projects.ts with typed Project interface and createdAt field for recency sorting - Add useProjectFilters hook with sessionStorage persistence for category filter and sort state across navigation - Rewrite FeaturedProjects as client component with category pills and sort dropdown (Top Rated / Newest / Most Reviewed) - Add /discover page showing all projects with same filter/sort controls - Hydration-safe skeleton loading to prevent SSR mismatch - Accessible: aria-pressed on filter buttons, aria-label on ratings, sr-only labels on selects, aria-hidden on decorative SVGs
…uredProjects component - Install vitest, @vitejs/plugin-react, jsdom, @testing-library/react, @testing-library/jest-dom, @testing-library/user-event - Add vitest.config.ts with jsdom environment and @ path alias - Add vitest.setup.ts with jest-dom matchers - Add npm test script (vitest --run for single-pass CI) - 27 tests across 3 suites, all passing: - data/projects: field validation, unique ids, rating bounds, ISO dates - hooks/useProjectFilters: filtering, sorting, persistence, hydration restore, corrupt data fallback - components/FeaturedProjects: rendering, category filter, sort dropdown, empty state, sessionStorage persistence
|
@mayasimi Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits. You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀 |
- Replace setState-in-effect pattern with useSyncExternalStore for hydration detection (fixes react-hooks/set-state-in-effect error) - Use lazy useState initializer to read sessionStorage on first render instead of inside useEffect (no cascading renders) - Change let to const for result in useMemo (fixes prefer-const error) - Remove unused vi import from useProjectFilters.test.ts (fixes no-unused-vars warning) All 27 tests pass, lint exits 0 with --max-warnings 0
- Update package.json lint script to match exact CI command: eslint . --max-warnings 0 --ext .js,.jsx,.ts,.tsx --format stylish - All lint errors were already fixed in 91e06d4 (useSyncExternalStore, const result, removed unused vi import) — this commit forces CI to re-run against the clean codebase
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Resolve #26
Summary
Enhances the discovery experience by letting users filter projects by category and sort them by rating, recency, or review count. State persists across navigation via
sessionStorage. Includes a full test suite.What changed
data/projects.ts— typedProjectinterface, single source of truth for all project data withcreatedAtfor recency sortinghooks/useProjectFilters.ts— filter + sort logic withsessionStoragepersistence and hydration-safe state restorecomponents/landing/FeaturedProjects.tsx— converted to client component, added category pills and sort dropdown (shows top 6)app/discover/page.tsx— new/discoverroute showing all projects with the same filter/sort controlsTesting
Acceptance criteria