Merge branch 'main' into fix/invalidate-query-immediately

Author: Mini-ghost

.all-contributorsrc

@@ -23,7 +23,7 @@ Most core web frameworks **do not** come with an opinionated way of fetching or
 
 While most traditional state management libraries are great for working with client state, they are **not so great at working with async or server state**. This is because **server state is totally different**. For starters, server state:
 
-- Is persisted remotely in a location you do not control or own
+- Is persisted remotely in a location you may not control or own
 - Requires asynchronous APIs for fetching and updating
 - Implies shared ownership and can be changed by other people without your knowledge
 - Can potentially become "out of date" in your applications if you're not careful
@@ -58,7 +58,7 @@ On a more technical note, Angular Query will likely:
 
 In the example below, you can see Angular Query in its most basic and simple form being used to fetch the GitHub stats for the TanStack Query GitHub project itself:
 
-[Open in CodeSandbox](https://codesandbox.io/s/github/tanstack/query/tree/main/examples/angular/simple)
+[Open in StackBlitz](https://stackblitz.com/github/TanStack/query/tree/main/examples/angular/simple)
 
 ```angular-ts
 import { AngularQueryDevtools } from '@tanstack/angular-query-devtools-experimental'
@@ -114,4 +114,4 @@ type Response = {
 
 ## You talked me into it, so what now?
 
-- Learn Angular Query at your own pace with our amazingly thorough [Walkthrough Guide](../installation) and [API Reference](../reference/injectQuery)
+- Learn Angular Query at your own pace with our amazingly thorough [Walkthrough Guide](../installation) and [API Reference](../reference/functions/injectquery)

docs/framework/angular/overview.md

@@ -187,3 +187,7 @@ return (
 ```
 
 [//]: # 'Example7'
+
+## Limitations
+
+Cancelation does not work when working with `Suspense` hooks: `useSuspenseQuery`, `useSuspenseQueries` and `useSuspenseInfiniteQuery`.

docs/framework/react/guides/query-cancellation.md

@@ -24,3 +24,7 @@ Same object as [useInfiniteQuery](../useInfiniteQuery), except that:
 - `isPlaceholderData` is missing
 - `status` is always `success`
   - the derived flags are set accordingly.
+
+**Caveat**
+
+[Cancelation](../guides/query-cancellation.md) does not work.

docs/framework/react/reference/useSuspenseInfiniteQuery.md

@@ -25,6 +25,8 @@ Same structure as [useQueries](../useQueries), except that for each `query`:
 - `status` is always `success`
   - the derived flags are set accordingly.
 
-**Caveat**
+**Caveats**
 
 Keep in mind that the component will only re-mount after **all queries** have finished loading. Hence, if a query has gone stale in the time it took for all the queries to complete, it will be fetched again at re-mount. To avoid this, make sure to set a high enough `staleTime`.
+
+[Cancelation](../guides/query-cancellation.md) does not work.

docs/framework/react/reference/useSuspenseQueries.md

@@ -23,3 +23,7 @@ Same object as [useQuery](../useQuery), except that:
 - `isPlaceholderData` is missing
 - `status` is always `success`
   - the derived flags are set accordingly.
+
+**Caveat**
+
+[Cancelation](../guides/query-cancellation.md) does not work.

docs/framework/react/reference/useSuspenseQuery.md

@@ -36,8 +36,8 @@ export default [
           },
         },
       ],
-      '@typescript-eslint/ban-types': 'off',
       '@typescript-eslint/no-empty-function': 'off',
+      '@typescript-eslint/no-unsafe-function-type': 'off',
       'no-case-declarations': 'off',
     },
   },

eslint.config.js

@@ -14,7 +14,7 @@
     "@angular/core": "^17.3.12",
     "@angular/platform-browser": "^17.3.12",
     "@angular/platform-browser-dynamic": "^17.3.12",
-    "@tanstack/angular-query-experimental": "^5.52.0",
+    "@tanstack/angular-query-experimental": "^5.53.1",
     "rxjs": "^7.8.1",
     "tslib": "^2.6.3",
     "zone.js": "^0.14.8"
@@ -23,7 +23,7 @@
     "@angular-devkit/build-angular": "^17.3.8",
     "@angular/cli": "^17.3.8",
     "@angular/compiler-cli": "^17.3.12",
-    "@tanstack/angular-query-devtools-experimental": "^5.52.0",
+    "@tanstack/angular-query-devtools-experimental": "^5.53.1",
     "typescript": "5.3.3"
   }
 }

examples/angular/basic/package.json

@@ -14,7 +14,7 @@
     "@angular/core": "^17.3.12",
     "@angular/platform-browser": "^17.3.12",
     "@angular/platform-browser-dynamic": "^17.3.12",
-    "@tanstack/angular-query-experimental": "^5.52.0",
+    "@tanstack/angular-query-experimental": "^5.53.1",
     "rxjs": "^7.8.1",
     "tslib": "^2.6.3",
     "zone.js": "^0.14.8"
@@ -23,7 +23,7 @@
     "@angular-devkit/build-angular": "^17.3.8",
     "@angular/cli": "^17.3.8",
     "@angular/compiler-cli": "^17.3.12",
-    "@tanstack/angular-query-devtools-experimental": "^5.52.0",
+    "@tanstack/angular-query-devtools-experimental": "^5.53.1",
     "typescript": "5.3.3"
   }
 }

examples/angular/infinite-query-with-max-pages/package.json

@@ -15,7 +15,7 @@
     "@angular/platform-browser": "^17.3.12",
     "@angular/platform-browser-dynamic": "^17.3.12",
     "@angular/router": "^17.3.12",
-    "@tanstack/angular-query-experimental": "^5.52.0",
+    "@tanstack/angular-query-experimental": "^5.53.1",
     "rxjs": "^7.8.1",
     "tslib": "^2.6.3",
     "zone.js": "^0.14.8"
@@ -24,7 +24,7 @@
     "@angular-devkit/build-angular": "^17.3.8",
     "@angular/cli": "^17.3.8",
     "@angular/compiler-cli": "^17.3.12",
-    "@tanstack/angular-query-devtools-experimental": "^5.52.0",
+    "@tanstack/angular-query-devtools-experimental": "^5.53.1",
     "typescript": "5.3.3"
   }
 }

examples/angular/router/package.json

@@ -6,10 +6,7 @@ import {
   numberAttribute,
 } from '@angular/core'
 import { RouterLink } from '@angular/router'
-import {
-  injectQuery,
-  injectQueryClient,
-} from '@tanstack/angular-query-experimental'
+import { injectQuery } from '@tanstack/angular-query-experimental'
 import { lastValueFrom } from 'rxjs'
 import { PostsService } from '../services/posts-service'
 
@@ -22,7 +19,6 @@ import { PostsService } from '../services/posts-service'
 })
 export default class PostComponent {
   #postsService = inject(PostsService)
-  queryClient = injectQueryClient()
 
   postId = input.required({
     transform: numberAttribute,

examples/angular/router/src/app/components/post.component.ts

@@ -15,7 +15,7 @@
     "@angular/platform-browser": "^17.3.12",
     "@angular/platform-browser-dynamic": "^17.3.12",
     "@angular/router": "^17.3.12",
-    "@tanstack/angular-query-experimental": "^5.52.0",
+    "@tanstack/angular-query-experimental": "^5.53.1",
     "rxjs": "^7.8.1",
     "tslib": "^2.6.3",
     "zone.js": "^0.14.8"
@@ -24,7 +24,7 @@
     "@angular-devkit/build-angular": "^17.3.8",
     "@angular/cli": "^17.3.8",
     "@angular/compiler-cli": "^17.3.12",
-    "@tanstack/angular-query-devtools-experimental": "^5.52.0",
+    "@tanstack/angular-query-devtools-experimental": "^5.53.1",
     "typescript": "5.3.3"
   }
 }