Skip to content
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.

Sign up for GitHub

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

Update infinite query example with page param changes #4827

Merged
merged 3 commits into from
Jan 23, 2025
Merged

Update infinite query example with page param changes #4827

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
fcbcf2d
Bump infinite query example RTK build
markerikson Jan 23, 2025
76cdfad
Fix example page params
markerikson Jan 23, 2025
ae668a3
Tweak RTKQ comparison
markerikson Jan 23, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion docs/rtk-query/comparison.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@ This comparison table strives to be as accurate and as unbiased as possible. If
| **Lagged queries** | yes | yes | no | ? |
| **Auto garbage collection** | yes | yes | no | ? |
| **Normalized caching** | no | no | yes | yes |
| **Infinite scrolling** | TODO | yes | requires manual code | ? |
| **Infinite scrolling** | yes | yes | requires manual code | ? |
| **Prefetching** | yes | yes | yes | yes? |
| **Retrying** | yes | yes | requires manual code | ? |
| **Optimistic updates** | can update cache by hand | can update cache by hand | `optimisticResponse` | ? |
Expand Down
2 changes: 1 addition & 1 deletion docs/rtk-query/usage/infinite-queries.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -198,7 +198,7 @@ const pokemonApi = createApi({
endpoints: (build) => ({
getPokemon: build.infiniteQuery<Pokemon[], string, number>({
infiniteQueryOptions: {
initialPageParam: 0,
initialPageParam: 1,
getNextPageParam: (lastPage, allPages, lastPageParam, allPageParams) =>
lastPageParam + 1,
},
Expand Down
2 changes: 1 addition & 1 deletion examples/query/react/infinite-queries/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
"type-check": "tsc --noEmit"
},
"dependencies": {
"@reduxjs/toolkit": "https://pkg.csb.dev/reduxjs/redux-toolkit/commit/26bae549/@reduxjs/toolkit/_pkg.tgz",
"@reduxjs/toolkit": "https://pkg.csb.dev/reduxjs/redux-toolkit/commit/e18b966e/@reduxjs/toolkit/_pkg.tgz",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-intersection-observer": "^9.13.1",
Expand Down
2 changes: 1 addition & 1 deletion ...t/infinite-queries/src/features/bidirectional-cursor-infinite-scroll/infiniteScrollApi.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ export const apiWithInfiniteScroll = baseApi.injectEndpoints({
QueryParamLimit,
ProjectsInitialPageParam
>({
query: ({ before, after, around, limit }) => {
query: ({ pageParam: { before, after, around, limit } }) => {
const params = new URLSearchParams()
params.append("limit", String(limit))
if (after != null) {
Expand Down
3 changes: 2 additions & 1 deletion examples/query/react/infinite-queries/src/features/infinite-scroll/infiniteScrollApi.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,8 @@ type ProjectsPageCursor = {
export const apiWithInfiniteScroll = baseApi.injectEndpoints({
endpoints: build => ({
getProjectsCursor: build.infiniteQuery<ProjectsPageCursor, string, number>({
query: page => `https://example.com/api/projectsCursor?cursor=${page}`,
query: ({ pageParam }) =>
`https://example.com/api/projectsCursor?cursor=${pageParam}`,
infiniteQueryOptions: {
initialPageParam: 0,
getPreviousPageParam: firstPage => firstPage.previousId,
Expand Down
2 changes: 1 addition & 1 deletion examples/query/react/infinite-queries/src/features/limit-offset/infiniteScrollApi.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ export const apiWithInfiniteScroll = baseApi.injectEndpoints({
}
},
},
query: ({ offset, limit }) => {
query: ({ pageParam: { offset, limit } }) => {
return {
url: `https://example.com/api/projectsLimitOffset?offset=${offset}&limit=${limit}`,
method: "GET",
Expand Down
3 changes: 2 additions & 1 deletion examples/query/react/infinite-queries/src/features/max-pages/infiniteScrollApi.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,8 @@ export const apiWithInfiniteScrollMax = baseApi.injectEndpoints({
string,
number
>({
query: page => `https://example.com/api/projectsCursor?cursor=${page}`,
query: ({ pageParam }) =>
`https://example.com/api/projectsCursor?cursor=${pageParam}`,
infiniteQueryOptions: {
initialPageParam: 0,
maxPages: 3,
Expand Down
2 changes: 1 addition & 1 deletion ...query/react/infinite-queries/src/features/pagination-infinite-scroll/infiniteScrollApi.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ export const apiWithInfiniteScroll = baseApi.injectEndpoints({
}
},
},
query: ({ page, size }) => {
query: ({ pageParam: { page, size } }) => {
return {
url: `https://example.com/api/projectsPaginated?page=${page}&size=${size}`,
method: "GET",
Expand Down
3 changes: 2 additions & 1 deletion examples/query/react/infinite-queries/src/features/pagination/paginationApi.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,8 @@ type ProjectsPage = {
export const apiWithPagination = baseApi.injectEndpoints({
endpoints: build => ({
getProjects: build.infiniteQuery<ProjectsPage, string, number>({
query: page => `https://example.com/api/projects?page=${page}`,
query: ({ pageParam }) =>
`https://example.com/api/projects?page=${pageParam}`,
infiniteQueryOptions: {
initialPageParam: 0,
getNextPageParam: (lastPage, pages, lastPageParam, allPageParams) => {
Expand Down
8 changes: 4 additions & 4 deletions examples/query/react/infinite-queries/yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1743,9 +1743,9 @@ __metadata:
languageName: node
linkType: hard

"@reduxjs/toolkit@https://pkg.csb.dev/reduxjs/redux-toolkit/commit/26bae549/@reduxjs/toolkit/_pkg.tgz":
"@reduxjs/toolkit@https://pkg.csb.dev/reduxjs/redux-toolkit/commit/e18b966e/@reduxjs/toolkit/_pkg.tgz":
version: 2.5.0
resolution: "@reduxjs/toolkit@https://pkg.csb.dev/reduxjs/redux-toolkit/commit/26bae549/@reduxjs/toolkit/_pkg.tgz"
resolution: "@reduxjs/toolkit@https://pkg.csb.dev/reduxjs/redux-toolkit/commit/e18b966e/@reduxjs/toolkit/_pkg.tgz"
dependencies:
immer: "npm:^10.0.3"
redux: "npm:^5.0.1"
Expand All @@ -1759,7 +1759,7 @@ __metadata:
optional: true
react-redux:
optional: true
checksum: 10/c71e738c892ec549c0d242524b3789d306d7b6e320fa6219a2dd4a71adca68fbfccf3ce46a43631fe5076245c465259771e348f23b5ed3fb2e04e2d4e0aabb6b
checksum: 10/9bf78a12a14a745cfb2eef7e8509149652dba734b66012ac42449722c72bf3709b37e8dba1814635ab7baef04c286be003b4df7f7098f17e059ad3e449576f2f
languageName: node
linkType: hard

Expand Down Expand Up @@ -7433,7 +7433,7 @@ __metadata:
version: 0.0.0-use.local
resolution: "vite-template-redux@workspace:."
dependencies:
"@reduxjs/toolkit": "https://pkg.csb.dev/reduxjs/redux-toolkit/commit/26bae549/@reduxjs/toolkit/_pkg.tgz"
"@reduxjs/toolkit": "https://pkg.csb.dev/reduxjs/redux-toolkit/commit/e18b966e/@reduxjs/toolkit/_pkg.tgz"
"@testing-library/dom": "npm:^9.3.4"
"@testing-library/jest-dom": "npm:^6.2.0"
"@testing-library/react": "npm:^14.1.2"
Expand Down
8 changes: 4 additions & 4 deletions yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8042,9 +8042,9 @@ __metadata:
languageName: unknown
linkType: soft

"@reduxjs/toolkit@https://pkg.csb.dev/reduxjs/redux-toolkit/commit/26bae549/@reduxjs/toolkit/_pkg.tgz":
"@reduxjs/toolkit@https://pkg.csb.dev/reduxjs/redux-toolkit/commit/e18b966e/@reduxjs/toolkit/_pkg.tgz":
version: 2.5.0
resolution: "@reduxjs/toolkit@https://pkg.csb.dev/reduxjs/redux-toolkit/commit/26bae549/@reduxjs/toolkit/_pkg.tgz"
resolution: "@reduxjs/toolkit@https://pkg.csb.dev/reduxjs/redux-toolkit/commit/e18b966e/@reduxjs/toolkit/_pkg.tgz"
dependencies:
immer: "npm:^10.0.3"
redux: "npm:^5.0.1"
Expand All @@ -8058,7 +8058,7 @@ __metadata:
optional: true
react-redux:
optional: true
checksum: 10/c71e738c892ec549c0d242524b3789d306d7b6e320fa6219a2dd4a71adca68fbfccf3ce46a43631fe5076245c465259771e348f23b5ed3fb2e04e2d4e0aabb6b
checksum: 10/9bf78a12a14a745cfb2eef7e8509149652dba734b66012ac42449722c72bf3709b37e8dba1814635ab7baef04c286be003b4df7f7098f17e059ad3e449576f2f
languageName: node
linkType: hard

Expand Down Expand Up @@ -34081,7 +34081,7 @@ __metadata:
version: 0.0.0-use.local
resolution: "vite-template-redux@workspace:examples/query/react/infinite-queries"
dependencies:
"@reduxjs/toolkit": "https://pkg.csb.dev/reduxjs/redux-toolkit/commit/26bae549/@reduxjs/toolkit/_pkg.tgz"
"@reduxjs/toolkit": "https://pkg.csb.dev/reduxjs/redux-toolkit/commit/e18b966e/@reduxjs/toolkit/_pkg.tgz"
"@testing-library/dom": "npm:^9.3.4"
"@testing-library/jest-dom": "npm:^6.2.0"
"@testing-library/react": "npm:^14.1.2"
Expand Down
Loading