@buoy-gg/react-query 7.0.20 → 7.0.22

package/lib/commonjs/react-query/sync/snapshotProvider.js

@@ -55,6 +55,81 @@ function queryLabel(queryKey, queryHash) {
   }
 }
 const ITEM_RENDER_BYTE_LIMIT = 256 * 1024;
+
+/**
+ * A query `error` (and `fetchFailureReason`) usually holds the live
+ * Axios/fetch error: `request` points at the XHR, which is cyclic and would
+ * fail the whole snapshot's serialization. Only name + message survive —
+ * that's all a restored error state needs.
+ */
+function toStoredError(value) {
+  if (value == null) return value ?? null;
+  if (typeof value === "object") {
+    const err = value;
+    const name = typeof err.name === "string" ? err.name : undefined;
+    const message = typeof err.message === "string" ? err.message : undefined;
+    if (name !== undefined || message !== undefined) {
+      return {
+        ...(name !== undefined ? {
+          name
+        } : {}),
+        ...(message !== undefined ? {
+          message
+        } : {})
+      };
+    }
+  }
+  return value;
+}
+
+/** Would the Time Machine vault be able to store this value? */
+function isStorable(value) {
+  if (value === undefined) return true;
+  try {
+    (0, _sharedUi.superJsonSerialize)(value);
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+/**
+ * The queries as a SNAPSHOT sees them — raw.
+ *
+ * Deliberately NOT `dehydrateQueryClient()`: that is the WIRE form, which
+ * swaps any payload over 16KB for a `DATA_ON_DEVICE` marker so the dashboard
+ * stays inside its emit budget. Snapshots live on-device in persistentStorage
+ * with no such budget, and restoring a marker would write the placeholder
+ * object into the live cache — the app then renders `{__buoyDataOnDevice}` as
+ * if it were its data and crashes on the first field it reads.
+ */
+function captureQueries(client) {
+  const warnings = [];
+  const queries = [];
+  for (const query of client.getQueryCache().getAll()) {
+    const label = queryLabel(query.queryKey, query.queryHash);
+    if (!isStorable(query.state.data)) {
+      warnings.push(`query ${label}: data can't be serialized (circular reference?) — not captured`);
+      continue;
+    }
+    queries.push({
+      queryKey: query.queryKey,
+      queryHash: query.queryHash,
+      ...(query.meta && isStorable(query.meta) ? {
+        meta: query.meta
+      } : {}),
+      state: normalizeState({
+        ...query.state,
+        error: toStoredError(query.state.error),
+        fetchFailureReason: toStoredError(query.state.fetchFailureReason)
+      })
+    });
+  }
+  return {
+    queries,
+    warnings
+  };
+}
 function createQuerySnapshotProvider(queryClient) {
   return {
     id: "query",
@@ -66,21 +141,15 @@ function createQuerySnapshotProvider(queryClient) {
     async capture() {
       const {
         queries,
-        mutations
-      } = (0, _dehydrate.dehydrateQueryClient)(queryClient);
-      const warnings = [];
-      if (mutations.length > 0) {
-        warnings.push(`${mutations.length} mutation(s) not captured (mutation functions cannot be restored)`);
+        warnings
+      } = captureQueries(queryClient);
+      const mutationCount = queryClient.getMutationCache().getAll().length;
+      if (mutationCount > 0) {
+        warnings.push(`${mutationCount} mutation(s) not captured (mutation functions cannot be restored)`);
       }
       return {
         data: {
-          queries: queries.map(({
-            observers: _observers,
-            ...query
-          }) => ({
-            ...query,
-            state: normalizeState(query.state)
-          }))
+          queries
         },
         warnings
       };
@@ -112,6 +181,17 @@ function createQuerySnapshotProvider(queryClient) {
           excludedHits += 1;
           continue;
         }
+        // Snapshots taken before the raw-capture fix hold a wire placeholder
+        // instead of the data. Writing that into the cache hands the app an
+        // object with none of its fields — leave the live query alone and say
+        // why, rather than "restoring" a value that crashes the screen.
+        if ((0, _dehydrate.isWireDataMarker)(snap.state.data)) {
+          result.skipped.push({
+            id: snap.queryHash,
+            reason: "captured as an on-device placeholder by an older Buoy — re-capture this restore point"
+          });
+          continue;
+        }
         try {
           const state = normalizeState(snap.state);
           const existing = cache.get(snap.queryHash);
@@ -171,16 +251,24 @@ function createQuerySnapshotProvider(queryClient) {
     async previewItems(target, base) {
       const targetQueries = target?.queries ?? [];
       const liveMode = base === undefined;
-      const baseQueries = liveMode ? (0, _dehydrate.dehydrateQueryClient)(queryClient).queries.map(({
-        observers: _o,
-        ...q
-      }) => q) : base?.queries ?? [];
+      // Live side goes through the same raw capture as a snapshot would, so a
+      // big query diffs as its real value instead of a wire placeholder.
+      const baseQueries = liveMode ? captureQueries(queryClient).queries : base?.queries ?? [];
       const baseByHash = new Map(baseQueries.map(q => [q.queryHash, q]));
       const targetByHash = new Map(targetQueries.map(q => [q.queryHash, q]));
       const items = [];
       const notes = [];
       for (const q of targetQueries) {
         const label = queryLabel(q.queryKey, q.queryHash);
+        if ((0, _dehydrate.isWireDataMarker)(q.state.data)) {
+          items.push({
+            key: q.queryHash,
+            label,
+            verdict: "wont-apply",
+            reason: "data stayed on the device when this was captured (older Buoy) — re-capture this restore point"
+          });
+          continue;
+        }
         const baseQ = baseByHash.get(q.queryHash);
         if (!baseQ) {
           items.push({

package/lib/module/react-query/sync/snapshotProvider.js

@@ -17,9 +17,9 @@
  * the mutation cache is cleared instead.
  */
 
-import { registerStateSnapshotProvider } from "@buoy-gg/shared-ui";
+import { registerStateSnapshotProvider, superJsonSerialize } from "@buoy-gg/shared-ui";
 import { boundedDeepEqual, jsonLikelyLargerThan } from "@buoy-gg/shared-ui/dataViewer";
-import { dehydrateQueryClient } from "./dehydrate";
+import { isWireDataMarker } from "./dehydrate";
 /** A restored query must never claim an in-flight fetch it doesn't have. */
 function normalizeState(state) {
   return {
@@ -50,6 +50,81 @@ function queryLabel(queryKey, queryHash) {
   }
 }
 const ITEM_RENDER_BYTE_LIMIT = 256 * 1024;
+
+/**
+ * A query `error` (and `fetchFailureReason`) usually holds the live
+ * Axios/fetch error: `request` points at the XHR, which is cyclic and would
+ * fail the whole snapshot's serialization. Only name + message survive —
+ * that's all a restored error state needs.
+ */
+function toStoredError(value) {
+  if (value == null) return value ?? null;
+  if (typeof value === "object") {
+    const err = value;
+    const name = typeof err.name === "string" ? err.name : undefined;
+    const message = typeof err.message === "string" ? err.message : undefined;
+    if (name !== undefined || message !== undefined) {
+      return {
+        ...(name !== undefined ? {
+          name
+        } : {}),
+        ...(message !== undefined ? {
+          message
+        } : {})
+      };
+    }
+  }
+  return value;
+}
+
+/** Would the Time Machine vault be able to store this value? */
+function isStorable(value) {
+  if (value === undefined) return true;
+  try {
+    superJsonSerialize(value);
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+/**
+ * The queries as a SNAPSHOT sees them — raw.
+ *
+ * Deliberately NOT `dehydrateQueryClient()`: that is the WIRE form, which
+ * swaps any payload over 16KB for a `DATA_ON_DEVICE` marker so the dashboard
+ * stays inside its emit budget. Snapshots live on-device in persistentStorage
+ * with no such budget, and restoring a marker would write the placeholder
+ * object into the live cache — the app then renders `{__buoyDataOnDevice}` as
+ * if it were its data and crashes on the first field it reads.
+ */
+function captureQueries(client) {
+  const warnings = [];
+  const queries = [];
+  for (const query of client.getQueryCache().getAll()) {
+    const label = queryLabel(query.queryKey, query.queryHash);
+    if (!isStorable(query.state.data)) {
+      warnings.push(`query ${label}: data can't be serialized (circular reference?) — not captured`);
+      continue;
+    }
+    queries.push({
+      queryKey: query.queryKey,
+      queryHash: query.queryHash,
+      ...(query.meta && isStorable(query.meta) ? {
+        meta: query.meta
+      } : {}),
+      state: normalizeState({
+        ...query.state,
+        error: toStoredError(query.state.error),
+        fetchFailureReason: toStoredError(query.state.fetchFailureReason)
+      })
+    });
+  }
+  return {
+    queries,
+    warnings
+  };
+}
 export function createQuerySnapshotProvider(queryClient) {
   return {
     id: "query",
@@ -61,21 +136,15 @@ export function createQuerySnapshotProvider(queryClient) {
     async capture() {
       const {
         queries,
-        mutations
-      } = dehydrateQueryClient(queryClient);
-      const warnings = [];
-      if (mutations.length > 0) {
-        warnings.push(`${mutations.length} mutation(s) not captured (mutation functions cannot be restored)`);
+        warnings
+      } = captureQueries(queryClient);
+      const mutationCount = queryClient.getMutationCache().getAll().length;
+      if (mutationCount > 0) {
+        warnings.push(`${mutationCount} mutation(s) not captured (mutation functions cannot be restored)`);
       }
       return {
         data: {
-          queries: queries.map(({
-            observers: _observers,
-            ...query
-          }) => ({
-            ...query,
-            state: normalizeState(query.state)
-          }))
+          queries
         },
         warnings
       };
@@ -107,6 +176,17 @@ export function createQuerySnapshotProvider(queryClient) {
           excludedHits += 1;
           continue;
         }
+        // Snapshots taken before the raw-capture fix hold a wire placeholder
+        // instead of the data. Writing that into the cache hands the app an
+        // object with none of its fields — leave the live query alone and say
+        // why, rather than "restoring" a value that crashes the screen.
+        if (isWireDataMarker(snap.state.data)) {
+          result.skipped.push({
+            id: snap.queryHash,
+            reason: "captured as an on-device placeholder by an older Buoy — re-capture this restore point"
+          });
+          continue;
+        }
         try {
           const state = normalizeState(snap.state);
           const existing = cache.get(snap.queryHash);
@@ -166,16 +246,24 @@ export function createQuerySnapshotProvider(queryClient) {
     async previewItems(target, base) {
       const targetQueries = target?.queries ?? [];
       const liveMode = base === undefined;
-      const baseQueries = liveMode ? dehydrateQueryClient(queryClient).queries.map(({
-        observers: _o,
-        ...q
-      }) => q) : base?.queries ?? [];
+      // Live side goes through the same raw capture as a snapshot would, so a
+      // big query diffs as its real value instead of a wire placeholder.
+      const baseQueries = liveMode ? captureQueries(queryClient).queries : base?.queries ?? [];
       const baseByHash = new Map(baseQueries.map(q => [q.queryHash, q]));
       const targetByHash = new Map(targetQueries.map(q => [q.queryHash, q]));
       const items = [];
       const notes = [];
       for (const q of targetQueries) {
         const label = queryLabel(q.queryKey, q.queryHash);
+        if (isWireDataMarker(q.state.data)) {
+          items.push({
+            key: q.queryHash,
+            label,
+            verdict: "wont-apply",
+            reason: "data stayed on the device when this was captured (older Buoy) — re-capture this restore point"
+          });
+          continue;
+        }
         const baseQ = baseByHash.get(q.queryHash);
         if (!baseQ) {
           items.push({

package/lib/typescript/react-query/sync/snapshotProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"snapshotProvider.d.ts","sourceRoot":"","sources":["../../../../src/react-query/sync/snapshotProvider.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,KAAK,EAAE,WAAW,EAAc,MAAM,uBAAuB,CAAC;AACrE,OAAO,EAEL,KAAK,qBAAqB,EAK3B,MAAM,oBAAoB,CAAC;AAuC5B,wBAAgB,2BAA2B,CACzC,WAAW,EAAE,WAAW,GACvB,qBAAqB,CAuLvB;AAED,4EAA4E;AAC5E,wBAAgB,6BAA6B,CAC3C,WAAW,EAAE,WAAW,GACvB,MAAM,IAAI,CAEZ"}
+{"version":3,"file":"snapshotProvider.d.ts","sourceRoot":"","sources":["../../../../src/react-query/sync/snapshotProvider.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,KAAK,EAAE,WAAW,EAAc,MAAM,uBAAuB,CAAC;AACrE,OAAO,EAGL,KAAK,qBAAqB,EAK3B,MAAM,oBAAoB,CAAC;AA8G5B,wBAAgB,2BAA2B,CACzC,WAAW,EAAE,WAAW,GACvB,qBAAqB,CAwMvB;AAED,4EAA4E;AAC5E,wBAAgB,6BAA6B,CAC3C,WAAW,EAAE,WAAW,GACvB,MAAM,IAAI,CAEZ"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@buoy-gg/react-query",
-  "version": "7.0.20",
+  "version": "7.0.22",
   "description": "TanStack Query devtools inside your React Native app — cache inspection, refetch & invalidate, offline toggle. Part of Buoy devtools.",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -29,8 +29,8 @@
     "**/snapshotProvider.ts"
   ],
   "dependencies": {
-    "@buoy-gg/shared-ui": "^7.0.20",
-    "@buoy-gg/floating-tools-core": "^7.0.20"
+    "@buoy-gg/floating-tools-core": "^7.0.22",
+    "@buoy-gg/shared-ui": "^7.0.22"
   },
   "peerDependencies": {
     "@tanstack/react-query": ">=5.0.0",