feat(core,antd,mui): add cursor-based pagination support#7238
Open
jtomaszewski wants to merge 8 commits intorefinedev:mainfrom
Open
feat(core,antd,mui): add cursor-based pagination support#7238jtomaszewski wants to merge 8 commits intorefinedev:mainfrom
jtomaszewski wants to merge 8 commits intorefinedev:mainfrom
Conversation
- Add 'cursor' mode to Pagination.mode type - Add CursorPagination interface for type safety - Implement cursor state management with navigation history - Add goToNextPage() and goToPreviousPage() navigation functions - Add hasNextPage and hasPreviousPage computed properties - Disable URL sync for cursor pagination mode (with warning) - Pass cursor via meta.cursor.current to data provider - Extract cursor from response (cursor.next, cursor.prev) - Add comprehensive tests for cursor pagination Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Update useDataGrid to expose cursor pagination helpers from core - Simplify example to use pagination.mode: "cursor" instead of manual state - Data provider now returns cursor in response (proper pattern) - Add custom prev/next buttons since DataGrid doesn't support cursor natively Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add cursor param to URL via syncWithLocation
- Support bidirectional APIs (prefer API's prev cursor) with fallback to client history
- Auto-inject cursor pagination UI in MUI DataGrid via slots
- Auto-inject cursor pagination UI in AntD Table via itemRender
- Simplify MUI example to demonstrate automatic pagination
Users now just set `pagination: { mode: "cursor" }` and get automatic
prev/next buttons without manual component mounting.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Use ?after=X or ?before=X instead of ?cursor=X for cursor pagination - Add direction field to cursor state and meta for data providers - Enable "go to first page" when landing on URL with cursor but no history - Data providers receive meta.cursor.direction to know which API param to use Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
When going back to the first page by clearing the cursor, explicitly set after=undefined and before=undefined to remove them from the URL. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
…ender Add table-antd-cursor-pagination example demonstrating cursor-based pagination with AntD Table. Uses custom GitHub API data provider and syncWithLocation for URL persistence. Fix AntD cursor pagination buttons not updating when hasNextPage/ hasPreviousPage change by using useMemo with proper dependencies and rendering pagination controls in table footer instead of itemRender. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
🦋 Changeset detectedLatest commit: ae9c18a The changes in this PR will be included in the next version bump. This PR includes changesets to release 3 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
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
1 participant
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.
Summary
useTablehook in core packageuseDataGrid(MUI) anduseTable(AntD) hooks?after=<cursor>and?before=<cursor>paramsChanges
Core (
@refinedev/core)useTableto supportpagination.mode: "cursor"cursor,hasNextPage,hasPreviousPage,goToNextPage,goToPreviousPagereturn valuessyncWithLocationoptioncursor: { next, prev }fromgetListMUI (
@refinedev/mui)useDataGridwith cursor pagination footer componentuseMemowith proper dependencies for re-renderingAntD (
@refinedev/antd)useTablewith cursor pagination via table footerhasNextPage/hasPreviousPagechangedExamples
table-material-ui-cursor-pagination: MUI DataGrid with GitHub commits APItable-antd-cursor-pagination: AntD Table with GitHub commits APITest plan
?after=<cursor>) persists across page reloads