Merge remote-tracking branch 'origin/main' into alpha

# Conflicts:
#	.github/workflows/pr.yml
#	packages/query-async-storage-persister/package.json
#	packages/query-broadcast-client-experimental/package.json
#	packages/query-core/package.json
#	packages/query-persist-client-core/package.json
#	packages/query-sync-storage-persister/package.json
#	packages/react-query-devtools/package.json
#	packages/react-query-devtools/src/devtools.tsx
#	packages/react-query-persist-client/package.json
#	packages/react-query/package.json
#	packages/solid-query/package.json
#	packages/svelte-query/package.json
#	packages/vue-query/package.json

Author: TkDodo

.github/workflows/ci-v3.yml

@@ -6,7 +6,6 @@ on:
       - 'v3'
 env:
   NX_DAEMON: false
-  NX_VERBOSE_LOGGING: true
   NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}
 jobs:
   test:

.github/workflows/ci.yml

@@ -15,7 +15,6 @@ on:
       - 'beta'
 env:
   NX_DAEMON: false
-  NX_VERBOSE_LOGGING: true
   NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}
 jobs:
   test-and-publish:

.github/workflows/pr.yml

@@ -2,38 +2,15 @@ name: pr
 on: [pull_request]
 env:
   NX_DAEMON: false
-  NX_VERBOSE_LOGGING: true
   NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}
 jobs:
-  test:
-    name: 'Test'
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v3
-        with:
-          fetch-depth: 0
-          ref: ${{ github.head_ref }}
-          repository: ${{github.event.pull_request.head.repo.full_name}}
-      - uses: pnpm/[email protected]
-        with:
-          version: 7
-      - uses: actions/setup-node@v3
-        with:
-          node-version: 16.19.0
-          cache: 'pnpm'
-      - name: Install dependencies
-        run: pnpm --filter "./packages/**" --filter query --prefer-offline install
-      - name: Run Tests
-        uses: nick-fields/[email protected]
-        with:
-          command: pnpm test:lib --base=${{ github.event.pull_request.base.sha }}
-          timeout_minutes: 5
-          max_attempts: 3
-      - name: Upload coverage to Codecov
-        uses: codecov/codecov-action@v3
-  lint:
-    name: 'Lint'
+  agent:
+    name: 'Nx Cloud Agents'
     runs-on: ubuntu-latest
+    timeout-minutes: 20
+    strategy:
+      matrix:
+        agent: [1, 2, 3, 4]
     steps:
       - uses: actions/checkout@v3
         with:
@@ -49,9 +26,10 @@ jobs:
           cache: 'pnpm'
       - name: Install dependencies
         run: pnpm --filter "./packages/**" --filter query --prefer-offline install
-      - run: pnpm run test:eslint --base=${{ github.event.pull_request.base.sha }}
-  typecheck:
-    name: 'Typecheck'
+      - name: Start Nx Agent ${{ matrix.agent }}
+        run: npx nx-cloud start-agent
+  orchestrator:
+    name: 'Nx Cloud Orchestrator'
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v3
@@ -64,11 +42,29 @@ jobs:
           version: 7
       - uses: actions/setup-node@v3
         with:
-          node-version: 16.14.2
+          node-version: 16.19.0
           cache: 'pnpm'
       - name: Install dependencies
         run: pnpm --filter "./packages/**" --filter query --prefer-offline install
-      - run: pnpm run test:types --base=${{ github.event.pull_request.base.sha }}
+      - name: Derive appropriate SHAs for base and head for `nx affected` commands
+        uses: nrwl/nx-set-shas@v2
+      - run: |
+          echo "BASE: ${{ env.NX_BASE }}"
+          echo "HEAD: ${{ env.NX_HEAD }}"
+      - name: Start CI Orchestrator
+        run: npx nx-cloud start-ci-run
+      - name: Run All Checks
+        uses: nick-fields/[email protected]
+        env:
+          BUNDLEWATCH_GITHUB_TOKEN: ${{ secrets.BUNDLEWATCH_GITHUB_TOKEN }}
+        with:
+          timeout_minutes: 5
+          max_attempts: 3
+          command: npx nx affected --targets=test:eslint,test:types,test:build,test:lib --base=${{ github.event.pull_request.base.sha }}
+      - name: Stop Agents
+        run: npx nx-cloud stop-all-agents
+      - name: Upload coverage to Codecov
+        uses: codecov/codecov-action@v3
   format:
     name: 'Format'
     runs-on: ubuntu-latest

docs/react/plugins/createSyncStoragePersister.md

@@ -128,8 +128,8 @@ import { compress, decompress } from 'lz-string';
 const queryClient = new QueryClient({ defaultOptions: { queries: { staleTime: Infinity } } });
 
 persistQueryClient({
-  queryClient: connectionsQueryClient,
-  persistor: createSyncStoragePersister({
+  queryClient: queryClient,
+  persister: createSyncStoragePersister({
     storage: window.localStorage,
     serialize: data => compress(JSON.stringify(data)),
     deserialize: data => JSON.parse(decompress(data)),

nx.json

@@ -7,6 +7,7 @@
           "test:lib",
           "test:eslint",
           "test:types",
+          "test:build",
           "build:types",
           "build",
           "rollup"
@@ -27,7 +28,8 @@
       "{workspaceRoot}/rollup.config.js",
       "{workspaceRoot}/rollup.config.ts",
       "{workspaceRoot}/tsconfig.json",
-      "{workspaceRoot}/tsconfig.base.json"
+      "{workspaceRoot}/tsconfig.base.json",
+      "{workspaceRoot}/package.json"
     ],
     "globalNonBuildAffectingConfig": ["{workspaceRoot}/.eslintrc"],
     "default": [

packages/query-core/src/query.ts

@@ -464,7 +464,7 @@ export class Query<
               `Query data cannot be undefined. Please make sure to return a value other than undefined from your query function. Affected query key: ${this.queryHash}`,
             )
           }
-          onError(new Error('undefined') as any)
+          onError(new Error(`${this.queryHash} data is undefined`) as any)
           return
         }
 

packages/query-core/src/tests/query.test.tsx

@@ -788,7 +788,7 @@ describe('query', () => {
 
     await sleep(10)
 
-    const error = new Error('undefined')
+    const error = new Error(`${JSON.stringify(key)} data is undefined`)
 
     expect(observerResult).toMatchObject({
       isError: true,

packages/react-query-devtools/src/CachePanel/ActiveQuery.tsx

@@ -101,7 +101,7 @@ const ActiveQuery = ({
 
   const restoreQueryAfterLoadingOrError = () => {
     activeQuery.fetch(
-      (activeQuery.state.fetchMeta as any).__previousQueryOptions,
+      (activeQuery.state.fetchMeta as any)?.__previousQueryOptions,
       {
         // Make sure this fetch will cancel the previous one
         cancelRefetch: true,
@@ -252,6 +252,14 @@ const ActiveQuery = ({
         <Button
           type="button"
           onClick={() => {
+            // Return early if the query is already restoring
+            if (
+              activeQuery.state.fetchStatus === 'fetching' &&
+              typeof (activeQuery.state.fetchMeta as any)
+                ?.__previousQueryOptions === 'undefined'
+            ) {
+              return
+            }
             if (activeQuery.state.data === undefined) {
               restoreQueryAfterLoadingOrError()
             } else {

packages/react-query-devtools/src/__tests__/devtools.test.tsx

@@ -1081,4 +1081,56 @@ describe('ReactQueryDevtools', () => {
       expect(screen.getByText('No error, success')).toBeInTheDocument()
     })
   })
+
+  it('should not refetch when already restoring a query', async () => {
+    const { queryClient } = createQueryClient()
+
+    let count = 0
+    let resolvePromise: (value: unknown) => void = () => undefined
+
+    function App() {
+      const { data } = useQuery(['key'], () => {
+        count++
+
+        // Resolve the promise immediately when
+        // the query is fetched for the first time
+        if (count === 1) {
+          return Promise.resolve('test')
+        }
+
+        return new Promise((resolve) => {
+          // Do not resolve immediately and store the
+          // resolve function to resolve the promise later
+          resolvePromise = resolve
+        })
+      })
+
+      return (
+        <div>
+          <h1>{typeof data === 'string' ? data : 'No data'}</h1>
+        </div>
+      )
+    }
+
+    renderWithClient(queryClient, <App />, {
+      initialIsOpen: true,
+    })
+
+    const loadingButton = await screen.findByRole('button', {
+      name: 'Trigger loading',
+    })
+    fireEvent.click(loadingButton)
+
+    await waitFor(() => {
+      expect(screen.getByText('Restore loading')).toBeInTheDocument()
+    })
+
+    // Click the restore loading button twice and only resolve query promise
+    // after the second click.
+    fireEvent.click(screen.getByRole('button', { name: /restore loading/i }))
+    fireEvent.click(screen.getByRole('button', { name: /restore loading/i }))
+    resolvePromise('test')
+
+    expect(count).toBe(2)
+  })
 })

tsconfig.base.json

@@ -15,6 +15,7 @@
     "strictNullChecks": true,
     "jsx": "react",
     "declaration": true,
+    "declarationMap": true,
     "emitDeclarationOnly": true,
     "esModuleInterop": true,
     "skipLibCheck": true,