diff --git a/docs/rtk-query/comparison.md b/docs/rtk-query/comparison.md index 55a1d26a6e..8dbdbf2a38 100644 --- a/docs/rtk-query/comparison.md +++ b/docs/rtk-query/comparison.md @@ -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` | ? | diff --git a/docs/rtk-query/usage/infinite-queries.mdx b/docs/rtk-query/usage/infinite-queries.mdx index c009498c3f..fd1cd5fc10 100644 --- a/docs/rtk-query/usage/infinite-queries.mdx +++ b/docs/rtk-query/usage/infinite-queries.mdx @@ -198,7 +198,7 @@ const pokemonApi = createApi({ endpoints: (build) => ({ getPokemon: build.infiniteQuery({ infiniteQueryOptions: { - initialPageParam: 0, + initialPageParam: 1, getNextPageParam: (lastPage, allPages, lastPageParam, allPageParams) => lastPageParam + 1, }, diff --git a/examples/query/react/infinite-queries/package.json b/examples/query/react/infinite-queries/package.json index 9772338e21..8f79449dda 100644 --- a/examples/query/react/infinite-queries/package.json +++ b/examples/query/react/infinite-queries/package.json @@ -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", diff --git a/examples/query/react/infinite-queries/src/features/bidirectional-cursor-infinite-scroll/infiniteScrollApi.ts b/examples/query/react/infinite-queries/src/features/bidirectional-cursor-infinite-scroll/infiniteScrollApi.ts index 2a51d0fe36..ebfbd0fcbd 100644 --- a/examples/query/react/infinite-queries/src/features/bidirectional-cursor-infinite-scroll/infiniteScrollApi.ts +++ b/examples/query/react/infinite-queries/src/features/bidirectional-cursor-infinite-scroll/infiniteScrollApi.ts @@ -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) { diff --git a/examples/query/react/infinite-queries/src/features/infinite-scroll/infiniteScrollApi.ts b/examples/query/react/infinite-queries/src/features/infinite-scroll/infiniteScrollApi.ts index 5ea428aee7..c543d44f1d 100644 --- a/examples/query/react/infinite-queries/src/features/infinite-scroll/infiniteScrollApi.ts +++ b/examples/query/react/infinite-queries/src/features/infinite-scroll/infiniteScrollApi.ts @@ -14,7 +14,8 @@ type ProjectsPageCursor = { export const apiWithInfiniteScroll = baseApi.injectEndpoints({ endpoints: build => ({ getProjectsCursor: build.infiniteQuery({ - 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, diff --git a/examples/query/react/infinite-queries/src/features/limit-offset/infiniteScrollApi.ts b/examples/query/react/infinite-queries/src/features/limit-offset/infiniteScrollApi.ts index 27bd2998a7..e093bdca93 100644 --- a/examples/query/react/infinite-queries/src/features/limit-offset/infiniteScrollApi.ts +++ b/examples/query/react/infinite-queries/src/features/limit-offset/infiniteScrollApi.ts @@ -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", diff --git a/examples/query/react/infinite-queries/src/features/max-pages/infiniteScrollApi.ts b/examples/query/react/infinite-queries/src/features/max-pages/infiniteScrollApi.ts index 48e8194e12..3a6247ea10 100644 --- a/examples/query/react/infinite-queries/src/features/max-pages/infiniteScrollApi.ts +++ b/examples/query/react/infinite-queries/src/features/max-pages/infiniteScrollApi.ts @@ -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, diff --git a/examples/query/react/infinite-queries/src/features/pagination-infinite-scroll/infiniteScrollApi.ts b/examples/query/react/infinite-queries/src/features/pagination-infinite-scroll/infiniteScrollApi.ts index c519dce5bb..d1c6891b5a 100644 --- a/examples/query/react/infinite-queries/src/features/pagination-infinite-scroll/infiniteScrollApi.ts +++ b/examples/query/react/infinite-queries/src/features/pagination-infinite-scroll/infiniteScrollApi.ts @@ -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", diff --git a/examples/query/react/infinite-queries/src/features/pagination/paginationApi.ts b/examples/query/react/infinite-queries/src/features/pagination/paginationApi.ts index 1dd2a197bd..f52291dc17 100644 --- a/examples/query/react/infinite-queries/src/features/pagination/paginationApi.ts +++ b/examples/query/react/infinite-queries/src/features/pagination/paginationApi.ts @@ -13,7 +13,8 @@ type ProjectsPage = { export const apiWithPagination = baseApi.injectEndpoints({ endpoints: build => ({ getProjects: build.infiniteQuery({ - 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) => { diff --git a/examples/query/react/infinite-queries/yarn.lock b/examples/query/react/infinite-queries/yarn.lock index f48a9c747b..6991374198 100644 --- a/examples/query/react/infinite-queries/yarn.lock +++ b/examples/query/react/infinite-queries/yarn.lock @@ -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" @@ -1759,7 +1759,7 @@ __metadata: optional: true react-redux: optional: true - checksum: 10/c71e738c892ec549c0d242524b3789d306d7b6e320fa6219a2dd4a71adca68fbfccf3ce46a43631fe5076245c465259771e348f23b5ed3fb2e04e2d4e0aabb6b + checksum: 10/9bf78a12a14a745cfb2eef7e8509149652dba734b66012ac42449722c72bf3709b37e8dba1814635ab7baef04c286be003b4df7f7098f17e059ad3e449576f2f languageName: node linkType: hard @@ -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" diff --git a/yarn.lock b/yarn.lock index dbb4c5b245..0bc9dc916f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -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" @@ -8058,7 +8058,7 @@ __metadata: optional: true react-redux: optional: true - checksum: 10/c71e738c892ec549c0d242524b3789d306d7b6e320fa6219a2dd4a71adca68fbfccf3ce46a43631fe5076245c465259771e348f23b5ed3fb2e04e2d4e0aabb6b + checksum: 10/9bf78a12a14a745cfb2eef7e8509149652dba734b66012ac42449722c72bf3709b37e8dba1814635ab7baef04c286be003b4df7f7098f17e059ad3e449576f2f languageName: node linkType: hard @@ -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"