import { notifyManager } from './notifyManager' import { QueryObserver } from './queryObserver' import { Subscribable } from './subscribable' import { replaceEqualDeep } from './utils' import type { DefaultedQueryObserverOptions, QueryObserverOptions, QueryObserverResult, } from './types' import type { QueryClient } from './queryClient' function difference(array1: Array, array2: Array): Array { const excludeSet = new Set(array2) return array1.filter((x) => !excludeSet.has(x)) } function replaceAt(array: Array, index: number, value: T): Array { const copy = array.slice(0) copy[index] = value return copy } type QueriesObserverListener = (result: Array) => void type CombineFn = ( result: Array, ) => TCombinedResult export interface QueriesObserverOptions< TCombinedResult = Array, > { combine?: CombineFn } export class QueriesObserver< TCombinedResult = Array, > extends Subscribable { #client: QueryClient #result!: Array #queries: Array #options?: QueriesObserverOptions #observers: Array #combinedResult?: TCombinedResult #lastCombine?: CombineFn #lastResult?: Array #observerMatches: Array = [] constructor( client: QueryClient, queries: Array>, options?: QueriesObserverOptions, ) { super() this.#client = client this.#options = options this.#queries = [] this.#observers = [] this.#result = [] this.setQueries(queries) } protected onSubscribe(): void { if (this.listeners.size === 1) { this.#observers.forEach((observer) => { observer.subscribe((result) => { this.#onUpdate(observer, result) }) }) } } protected onUnsubscribe(): void { if (!this.listeners.size) { this.destroy() } } destroy(): void { this.listeners = new Set() this.#observers.forEach((observer) => { observer.destroy() }) } setQueries( queries: Array, options?: QueriesObserverOptions, ): void { this.#queries = queries this.#options = options if (process.env.NODE_ENV !== 'production') { const queryHashes = queries.map( (query) => this.#client.defaultQueryOptions(query).queryHash, ) if (new Set(queryHashes).size !== queryHashes.length) { console.warn( '[QueriesObserver]: Duplicate Queries found. This might result in unexpected behavior.', ) } } notifyManager.batch(() => { const prevObservers = this.#observers const newObserverMatches = this.#findMatchingObservers(this.#queries) this.#observerMatches = newObserverMatches // set options for the new observers to notify of changes newObserverMatches.forEach((match) => match.observer.setOptions(match.defaultedQueryOptions), ) const newObservers = newObserverMatches.map((match) => match.observer) const newResult = newObservers.map((observer) => observer.getCurrentResult(), ) const hasIndexChange = newObservers.some( (observer, index) => observer !== prevObservers[index], ) if (prevObservers.length === newObservers.length && !hasIndexChange) { return } this.#observers = newObservers this.#result = newResult if (!this.hasListeners()) { return } difference(prevObservers, newObservers).forEach((observer) => { observer.destroy() }) difference(newObservers, prevObservers).forEach((observer) => { observer.subscribe((result) => { this.#onUpdate(observer, result) }) }) this.#notify() }) } getCurrentResult(): Array { return this.#result } getQueries() { return this.#observers.map((observer) => observer.getCurrentQuery()) } getObservers() { return this.#observers } getOptimisticResult( queries: Array, combine: CombineFn | undefined, ): [ rawResult: Array, combineResult: (r?: Array) => TCombinedResult, trackResult: () => Array, ] { const matches = this.#findMatchingObservers(queries) const result = matches.map((match) => match.observer.getOptimisticResult(match.defaultedQueryOptions), ) return [ result, (r?: Array) => { return this.#combineResult(r ?? result, combine) }, () => { return this.#trackResult(result, matches) }, ] } #trackResult( result: Array, matches: Array, ) { return matches.map((match, index) => { const observerResult = result[index]! return !match.defaultedQueryOptions.notifyOnChangeProps ? match.observer.trackResult(observerResult, (accessedProp) => { // track property on all observers to ensure proper (synchronized) tracking (#7000) matches.forEach((m) => { m.observer.trackProp(accessedProp) }) }) : observerResult }) } #combineResult( input: Array, combine: CombineFn | undefined, ): TCombinedResult { if (combine) { if ( !this.#combinedResult || this.#result !== this.#lastResult || combine !== this.#lastCombine ) { this.#lastCombine = combine this.#lastResult = this.#result this.#combinedResult = replaceEqualDeep( this.#combinedResult, combine(input), ) } return this.#combinedResult } return input as any } #findMatchingObservers( queries: Array, ): Array { const prevObserversMap = new Map( this.#observers.map((observer) => [observer.options.queryHash, observer]), ) const observers: Array = [] queries.forEach((options) => { const defaultedOptions = this.#client.defaultQueryOptions(options) const match = prevObserversMap.get(defaultedOptions.queryHash) if (match) { observers.push({ defaultedQueryOptions: defaultedOptions, observer: match, }) } else { observers.push({ defaultedQueryOptions: defaultedOptions, observer: new QueryObserver(this.#client, defaultedOptions), }) } }) return observers } #onUpdate(observer: QueryObserver, result: QueryObserverResult): void { const index = this.#observers.indexOf(observer) if (index !== -1) { this.#result = replaceAt(this.#result, index, result) this.#notify() } } #notify(): void { if (this.hasListeners()) { const previousResult = this.#combinedResult const newTracked = this.#trackResult(this.#result, this.#observerMatches) const newResult = this.#combineResult(newTracked, this.#options?.combine) if (previousResult !== newResult) { notifyManager.batch(() => { this.listeners.forEach((listener) => { listener(this.#result) }) }) } } } } type QueryObserverMatch = { defaultedQueryOptions: DefaultedQueryObserverOptions observer: QueryObserver }