just ignore stale hydrations if the client changes

Author: TkDodo

src/persistQueryClient/PersistQueryClientProvider.tsx

@@ -19,33 +19,30 @@ export const PersistQueryClientProvider = ({
 }: PersistQueryClientProviderProps): JSX.Element => {
   const [isHydrating, setIsHydrating] = React.useState(true)
   const refs = React.useRef({ persistOptions, onSuccess })
-  const previousPromise = React.useRef(Promise.resolve())
 
   React.useEffect(() => {
     refs.current = { persistOptions, onSuccess }
   })
 
   React.useEffect(() => {
+    let isStale = false
     setIsHydrating(true)
     const [unsubscribe, promise] = persistQueryClient({
       ...refs.current.persistOptions,
       queryClient: client,
     })
 
-    async function handlePersist() {
-      try {
-        await previousPromise.current
-        previousPromise.current = promise
-        await promise
+    promise.then(() => {
+      if (!isStale) {
         refs.current.onSuccess?.()
-      } finally {
         setIsHydrating(false)
       }
-    }
-
-    void handlePersist()
+    })
 
-    return unsubscribe
+    return () => {
+      isStale = true
+      unsubscribe()
+    }
   }, [client])
 
   return (