fix: cleanup

Author: boschni

docs/src/pages/guides/migrating-to-react-query-3.md

@@ -356,7 +356,7 @@ function Overview() {
 }
 ```
 
-## Retry/offline mutations
+#### Retry/offline mutations
 
 By default React Query will not retry a mutation on error, but it is possible with the `retry` option:
 
@@ -381,6 +381,24 @@ const unsubscribe = observer.subscribe(result => {
 })
 ```
 
+#### InfiniteQueryObserver
+
+A `InfiniteQueryObserver` can be used to create and/or watch an infinite query:
+
+```js
+const observer = new InfiniteQueryObserver(queryClient, {
+  queryKey: 'posts',
+  queryFn: fetchPosts,
+  getNextPageParam: (lastPage, allPages) => lastPage.nextCursor,
+  getPreviousPageParam: (firstPage, allPages) => firstPage.prevCursor,
+})
+
+const unsubscribe = observer.subscribe(result => {
+  console.log(result)
+  unsubscribe()
+})
+```
+
 #### QueriesObserver
 
 A `QueriesObserver` can be used to create and/or watch multiple queries:
@@ -397,7 +415,7 @@ const unsubscribe = observer.subscribe(result => {
 })
 ```
 
-## `queryClient.setQueryDefaults`
+#### Set default options for specific queries
 
 The `queryClient.setQueryDefaults()` method can be used to set default options for specific queries:
 
@@ -409,7 +427,7 @@ function Component() {
 }
 ```
 
-## `queryClient.setMutationDefaults`
+#### Set default options for specific mutations
 
 The `queryClient.setMutationDefaults()` method can be used to set default options for specific mutations:
 

src/core/index.ts

@@ -9,10 +9,11 @@ export { setLogger } from './logger'
 export { notifyManager } from './notifyManager'
 export { focusManager } from './focusManager'
 export { onlineManager } from './onlineManager'
-export { hashQueryKey, isCancelledError, isError } from './utils'
+export { hashQueryKey, isError } from './utils'
+export { isCancelledError } from './retryer'
 
 // Types
 export * from './types'
-export type { CancelledError } from './utils'
+export type { CancelledError } from './retryer'
 export type { Query } from './query'
 export type { Logger } from './logger'

src/core/query.ts

@@ -1,9 +1,7 @@
 import {
-  CancelOptions,
   Updater,
   ensureArray,
   functionalUpdate,
-  isCancelledError,
   isValidTimeout,
   noop,
   replaceEqualDeep,
@@ -20,7 +18,7 @@ import type { QueryCache } from './queryCache'
 import type { QueryObserver } from './queryObserver'
 import { notifyManager } from './notifyManager'
 import { getLogger } from './logger'
-import { Retryer } from './retryer'
+import { Retryer, CancelOptions, isCancelledError } from './retryer'
 
 // TYPES
 
@@ -162,34 +160,16 @@ export class Query<TData = unknown, TError = unknown, TQueryFnData = TData> {
     this.defaultOptions = options
   }
 
-  private dispatch(action: Action<TData, TError>): void {
-    this.state = this.reducer(this.state, action)
-
-    notifyManager.batch(() => {
-      this.observers.forEach(observer => {
-        observer.onQueryUpdate(action)
-      })
-
-      this.cache.notify(this)
-    })
-  }
-
   private scheduleGc(): void {
     this.clearGcTimeout()
 
     if (!this.observers.length && isValidTimeout(this.cacheTime)) {
       this.gcTimeout = setTimeout(() => {
-        this.remove()
+        this.cache.remove(this)
       }, this.cacheTime)
     }
   }
 
-  cancel(options?: CancelOptions): Promise<void> {
-    const promise = this.promise
-    this.retryer?.cancel(options)
-    return promise ? promise.then(noop).catch(noop) : Promise.resolve()
-  }
-
   private clearGcTimeout() {
     clearTimeout(this.gcTimeout)
     this.gcTimeout = undefined
@@ -228,8 +208,10 @@ export class Query<TData = unknown, TError = unknown, TQueryFnData = TData> {
     this.dispatch({ type: 'setState', state })
   }
 
-  remove(): void {
-    this.cache.remove(this)
+  cancel(options?: CancelOptions): Promise<void> {
+    const promise = this.promise
+    this.retryer?.cancel(options)
+    return promise ? promise.then(noop).catch(noop) : Promise.resolve()
   }
 
   destroy(): void {
@@ -433,6 +415,18 @@ export class Query<TData = unknown, TError = unknown, TQueryFnData = TData> {
     return this.promise
   }
 
+  private dispatch(action: Action<TData, TError>): void {
+    this.state = this.reducer(this.state, action)
+
+    notifyManager.batch(() => {
+      this.observers.forEach(observer => {
+        observer.onQueryUpdate(action)
+      })
+
+      this.cache.notify(this)
+    })
+  }
+
   protected getDefaultState(
     options: QueryOptions<TData, TError, TQueryFnData>
   ): QueryState<TData, TError> {

src/core/queryClient.ts

@@ -1,5 +1,4 @@
 import {
-  CancelOptions,
   QueryFilters,
   Updater,
   noop,
@@ -26,6 +25,7 @@ import { MutationCache } from './mutationCache'
 import { focusManager } from './focusManager'
 import { onlineManager } from './onlineManager'
 import { notifyManager } from './notifyManager'
+import { CancelOptions } from './retryer'
 
 // TYPES
 

src/core/queryObserver.ts

@@ -165,17 +165,6 @@ export class QueryObserver<
     return this.currentResult
   }
 
-  getCurrentOrNextResult(
-    options?: ResultOptions
-  ): Promise<QueryObserverResult<TData, TError>> {
-    if (this.currentQuery.isFetching()) {
-      return this.getNextResult(options)
-    } else if (this.currentResult.isError && options?.throwOnError) {
-      return Promise.reject(this.currentResult.error)
-    }
-    return Promise.resolve(this.currentResult)
-  }
-
   getNextResult(
     options?: ResultOptions
   ): Promise<QueryObserverResult<TData, TError>> {
@@ -198,7 +187,7 @@ export class QueryObserver<
   }
 
   remove(): void {
-    this.currentQuery.remove()
+    this.client.getQueryCache().remove(this.currentQuery)
   }
 
   refetch(
@@ -418,7 +407,7 @@ export class QueryObserver<
 
     this.updateResult(willFetch)
 
-    if (!this.listeners.length) {
+    if (!this.hasListeners()) {
       return
     }
 

src/core/retryer.ts

@@ -1,12 +1,6 @@
 import { focusManager } from './focusManager'
 import { onlineManager } from './onlineManager'
-import {
-  CancelOptions,
-  CancelledError,
-  functionalUpdate,
-  isCancelable,
-  sleep,
-} from './utils'
+import { functionalUpdate, sleep } from './utils'
 
 // TYPES
 
@@ -34,6 +28,32 @@ function defaultRetryDelay(failureCount: number) {
   return Math.min(1000 * 2 ** failureCount, 30000)
 }
 
+interface Cancelable {
+  cancel(): void
+}
+
+function isCancelable(value: any): value is Cancelable {
+  return typeof value?.cancel === 'function'
+}
+
+export interface CancelOptions {
+  revert?: boolean
+  silent?: boolean
+}
+
+export class CancelledError {
+  revert?: boolean
+  silent?: boolean
+  constructor(options?: CancelOptions) {
+    this.revert = options?.revert
+    this.silent = options?.silent
+  }
+}
+
+export function isCancelledError(value: any): value is CancelledError {
+  return value instanceof CancelledError
+}
+
 // CLASS
 
 export class Retryer<TData = unknown, TError = unknown> {

src/core/tests/queryCache.test.tsx

@@ -6,8 +6,13 @@ import {
   mockNavigatorOnLine,
   expectType,
 } from '../../react/tests/utils'
-import { QueryCache, QueryClient, QueryObserver } from '../..'
-import { isCancelledError, isError } from '../utils'
+import {
+  QueryCache,
+  QueryClient,
+  QueryObserver,
+  isCancelledError,
+  isError,
+} from '../..'
 import { QueryObserverResult } from '../types'
 import { QueriesObserver } from '../queriesObserver'
 

src/core/utils.ts

@@ -49,24 +49,6 @@ export type Updater<TInput, TOutput> =
   | TOutput
   | DataUpdateFunction<TInput, TOutput>
 
-interface Cancelable {
-  cancel(): void
-}
-
-export interface CancelOptions {
-  revert?: boolean
-  silent?: boolean
-}
-
-export class CancelledError {
-  revert?: boolean
-  silent?: boolean
-  constructor(options?: CancelOptions) {
-    this.revert = options?.revert
-    this.silent = options?.silent
-  }
-}
-
 // UTILS
 
 export const isServer = typeof window === 'undefined'
@@ -353,18 +335,10 @@ export function isQueryKey(value: any): value is QueryKey {
   return typeof value === 'string' || Array.isArray(value)
 }
 
-export function isCancelable(value: any): value is Cancelable {
-  return typeof value?.cancel === 'function'
-}
-
 export function isError(value: any): value is Error {
   return value instanceof Error
 }
 
-export function isCancelledError(value: any): value is CancelledError {
-  return value instanceof CancelledError
-}
-
 export function sleep(timeout: number): Promise<void> {
   return new Promise(resolve => {
     setTimeout(resolve, timeout)