Repository: tannerlinsley/react-query
File: packages/query-core/src/queriesObserver.ts (TypeScript)

Code before:

      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) {
        const resultChanged = newResult.some((result, index) => {
          const prev = this.#result[index]
          return (
            !prev ||
            result.data !== prev.data ||
            result.isPending !== prev.isPending ||
            result.error !== prev.error
          )
        })

        if (resultChanged) {
          this.#result = newResult
          this.#notify()
        }

        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)

Review comment (refactor):
checking for these 3 props seems a bit random. I think we’d want to use our `shallowEqualObjects` helper from the query-core to just compare `result` with `prev`. This is also what we do inside `queryObserver`:

https://github.com/TanStack/query/blob/abab082593424bd4b6a3c3e494f0cf4a8c40dcc1/packages/query-core/src/queryObserver.ts#L656-L659

Code after:

      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],
      )

      const hasResultChange =
        prevObservers.length === newObservers.length && !hasIndexChange
          ? newResult.some((result, index) => {
              const prev = this.#result[index]
              return !prev || !shallowEqualObjects(result, prev)
            })
          : true

      if (!hasIndexChange && !hasResultChange) return

      if (hasIndexChange) {
        this.#observers = newObservers
      }

      this.#result = newResult

      if (!this.hasListeners()) return

      if (hasIndexChange) {
        difference(prevObservers, newObservers).forEach((observer) => {
          observer.destroy()
        })
        difference(newObservers, prevObservers).forEach((observer) => {
          observer.subscribe((result) => {
            this.#onUpdate(observer, result)
          })
        })
      }

      this.#notify()
    })
  }