-
Notifications
You must be signed in to change notification settings - Fork 4
feat: add reusable usePagination hook #921
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull request overview
This PR introduces a reusable usePagination hook to centralize pagination logic across list components, improving code maintainability and consistency. The hook manages page navigation (first, previous, next, last) and items-per-page changes while extracting pagination metadata from HTTP response headers.
Key changes:
- New
usePaginationhook with page navigation handlers and state management extractPaginationMetautility for parsingx-total-pagesandx-total-countheaders with null-safe defaults- Comprehensive test suite with 15 tests covering state management, edge cases, and header extraction
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 5 comments.
| File | Description |
|---|---|
| src/hooks/usePagination/usePagination.ts | Core hook implementation with navigation handlers and metadata extraction |
| src/hooks/usePagination/usePagination.test.ts | Complete test coverage for hook behavior and edge cases |
| src/hooks/usePagination/index.ts | Public API export for hook and utility function |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
761adba to
8b566cc
Compare
|
Left feedback here around potentially moving state to inside the hook rather than passing it in |
8b566cc to
833fd6c
Compare
- Extract pagination logic into reusable hook - Add null-safety for undefined httpMeta - Include comprehensive unit tests
- Add parseHeaderInt helper with parseInt and NaN validation - Replace non-null assertions with optional chaining in tests - Add tests for invalid header values (NaN handling)
833fd6c to
634db48
Compare
Updated |
Summary
Adds a new reusable
usePaginationhook that extracts pagination logic for use across list components.Changes
usePaginationhook with handlers for first/previous/next/last page navigationextractPaginationMetautility for parsing pagination headersTesting
npm run test -- --run src/hooks/usePagination/Follow-up PRs
This is PR 1 of 3 for the pagination improvements: