Merge pull request #44 from lifeomic/react-query@v5

feat!: upgrade to use @tanstack/react-query@v5

README.md

@@ -210,7 +210,7 @@ const query = useQuery('GET /messages', { filter: 'some-filter' });
 
 query.data; // Message[] | undefined
 
-if (query.isLoading) {
+if (query.isPending) {
   return null;
 }
 if (query.isError) {
@@ -315,7 +315,7 @@ if (query.isError) {
 }
 
 // This means _at least one_ query is in the "loading" state.
-if (query.isLoading) {
+if (query.isPending) {
   return;
 }
 
@@ -337,9 +337,9 @@ Indicates whether _at least one_ query is in the "fetching" state.
 
 Indicates whether _at least one_ query is in the "refetching" state.
 
-#### `isLoading`
+#### `isPending`
 
-Indicates whether _at least one_ query is in the "loading state.
+Indicates whether _at least one_ query is in the "pending state.
 
 #### `isError`
 

UPGRADING.md

@@ -0,0 +1,56 @@
+This document provides instructions for upgrading between major
+versions of `@lifeomic/one-query`
+
+### 3.x -> 4.x
+
+- Replace your installation of `@tanstack/[email protected]` with `@tanstack/[email protected]`
+
+- See `react-query`'s [migration guide](https://tanstack.com/query/v5/docs/framework/react/guides/migrating-to-v5) for an idea. The largest changes will be outlined below - however since `one-query` is mostly a typed wrapper around `react-query` most, if not all, things mentioned apply
+
+- The `loading` status has been renamed to `pending`, and similarly the derived `isLoading` flag has been renamed to `isPending`
+
+```diff
+- query.status === 'loading'
++ query.status === 'pending'
+
+- if (query.isLoading)
++ if (query.isPending)
+```
+
+- `useInfiniteAPIQuery` now requires `initialPageParam` and `getNextPageParam` options. Passing page param through `fetchNextPage` and `fetchPreviousPage` is no longer supported.
+
+```diff
+-  const query = useInfiniteAPIQuery('GET /list', {
+-   filter: 'some-filter',
+-   after: undefined,
+- });
+- await void query.fetchNextPage({ pageParam: {...} });
++ const query = useInfiniteAPIQuery(
++   'GET /list',
++   {
++     filter: 'some-filter',
++     after: undefined,
++   },
++   {
++     initialPageParam: {},
++     getNextPageParam: (lastPage) => ({
++       after: lastPage.next,
++     }),
++   },
++ );
++ await void query.fetchNextPage();
+```
+
+- The minimum required TypeScript version is now 4.7
+
+- TypeScript: `Error` is now the default type for errors instead of `unknown`
+
+- Callbacks on `useQuery` have been removed (e.g., `onSuccess`, `onError` and `onSettled`)
+
+- Removed `keepPreviousData` in favor of `placeholderData` identity function
+
+- Rename `cacheTime` to `gcTime`
+
+- Removed `refetchPage` in favor of `maxPages`
+
+- The experimental `suspense: boolean` flag on the query hooks has been removed - new hooks for suspense have been added

package.json

@@ -15,13 +15,13 @@
     "build": "node build.js"
   },
   "peerDependencies": {
-    "@tanstack/react-query": "*",
+    "@tanstack/react-query": ">=5.0.0",
     "axios": "*"
   },
   "devDependencies": {
     "@lifeomic/eslint-config-standards": "^3.0.1",
     "@lifeomic/typescript-config": "^2.0.0",
-    "@tanstack/react-query": "^4.12.0",
+    "@tanstack/react-query": "^5.20.1",
     "@testing-library/react": "^13.4.0",
     "@types/jest": "^29.2.0",
     "@types/lodash": "^4.14.186",

src/combination.ts

@@ -18,7 +18,7 @@ export type CombinedQueriesDefinedResult<
   Queries extends QueryObserverResult[],
 > = {
   status: 'success';
-  isLoading: false;
+  isPending: false;
   isError: false;
   data: {
     [Index in keyof Queries]: DataOfQuery<Queries[Index]>;
@@ -34,7 +34,7 @@ export type CombinedQueriesLoadingResult<
   Queries extends QueryObserverResult[],
 > = {
   status: 'loading';
-  isLoading: true;
+  isPending: true;
   isError: false;
   data: undefined;
   queries: Queries;
@@ -43,7 +43,7 @@ export type CombinedQueriesLoadingResult<
 export type CombinedQueriesErrorResult<Queries extends QueryObserverResult[]> =
   {
     status: 'error';
-    isLoading: false;
+    isPending: false;
     isError: true;
     data: undefined;
     queries: Queries;
@@ -74,18 +74,18 @@ export const combineQueries = <Queries extends QueryObserverResult[]>(
     return {
       ...base,
       status: 'error',
-      isLoading: false,
+      isPending: false,
       data: undefined,
       isError: true,
       queries,
     };
   }
 
-  if (queries.some((query) => query.status === 'loading')) {
+  if (queries.some((query) => query.status === 'pending')) {
     return {
       ...base,
       status: 'loading',
-      isLoading: true,
+      isPending: true,
       data: undefined,
       isError: false,
       queries,
@@ -95,7 +95,7 @@ export const combineQueries = <Queries extends QueryObserverResult[]>(
   return {
     ...base,
     status: 'success',
-    isLoading: false,
+    isPending: false,
     data: queries.map((query) => query.data) as any,
     isError: false,
     queries: queries as any,