@rozenite/tanstack-query-plugin 1.0.0-alpha.4 → 1.0.0-alpha.6

package/dist/react-native.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});exports.useTanStackQueryDevTools=void 0;process.env.NODE_ENV!=="production"?exports.useTanStackQueryDevTools=require("./useTanStackQueryDevTools.js").useTanStackQueryDevTools:exports.useTanStackQueryDevTools=()=>({isConnected:!1});
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});exports.useTanStackQueryDevTools=void 0;process.env.NODE_ENV!=="production"?exports.useTanStackQueryDevTools=require("./useTanstackQueryDevTools.cjs").useTanStackQueryDevTools:exports.useTanStackQueryDevTools=()=>({isConnected:!1});

package/dist/react-native.d.ts

@@ -1,5 +1 @@
-export declare let useTanStackQueryDevTools: useTanStackQueryDevTools_2;
-
-declare const useTanStackQueryDevTools_2: () => void;
-
-export { }
+export declare let useTanStackQueryDevTools: typeof import('./src/react-native/useTanStackQueryDevTools').useTanStackQueryDevTools;

package/dist/react-native.js

@@ -1,5 +1,5 @@
 let e;
-process.env.NODE_ENV !== "production" ? e = require("./useTanStackQueryDevTools.js").useTanStackQueryDevTools : e = () => ({ isConnected: !1 });
+process.env.NODE_ENV !== "production" ? e = require("./useTanstackQueryDevTools.js").useTanStackQueryDevTools : e = () => ({ isConnected: !1 });
 export {
   e as useTanStackQueryDevTools
 };

package/dist/rozenite.config.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+    panels: {
+        name: string;
+        source: string;
+    }[];
+};
+export default _default;

package/dist/rozenite.json

@@ -1 +1 @@
-{"name":"@rozenite/tanstack-query-plugin","version":"1.0.0-alpha.3","description":"TanStack Query for Rozenite.","panels":[{"name":"Tanstack Query","source":"/tanstack-query.html"}]}
+{"name":"@rozenite/tanstack-query-plugin","version":"1.0.0-alpha.5","description":"TanStack Query for Rozenite.","panels":[{"name":"Tanstack Query","source":"/tanstack-query.html"}]}

package/dist/src/react-native/useHandleDevToolsMessages.d.ts

@@ -0,0 +1,3 @@
+import { QueryClient } from '@tanstack/react-query';
+import { TanStackQueryPluginClient } from '../shared/messaging';
+export declare const useHandleDevToolsMessages: (queryClient: QueryClient, client: TanStackQueryPluginClient | null) => void;

package/dist/src/react-native/useHandleInitialData.d.ts

@@ -0,0 +1,3 @@
+import { TanStackQueryPluginClient } from '../shared/messaging';
+import { QueryClient } from '@tanstack/react-query';
+export declare const useHandleInitialData: (queryClient: QueryClient, client: TanStackQueryPluginClient | null) => void;

package/dist/src/react-native/useSyncTanStackCache.d.ts

@@ -0,0 +1,3 @@
+import { QueryClient } from '@tanstack/react-query';
+import { TanStackQueryPluginClient } from '../shared/messaging';
+export declare const useSyncTanStackCache: (queryClient: QueryClient, client: TanStackQueryPluginClient | null) => void;

package/dist/src/react-native/useTanStackQueryDevTools.d.ts

@@ -0,0 +1,2 @@
+import { QueryClient } from '@tanstack/react-query';
+export declare const useTanStackQueryDevTools: (queryClient: QueryClient) => void;

package/dist/src/shared/dehydrate.d.ts

@@ -0,0 +1,6 @@
+import { Query, Mutation, QueryClient } from '@tanstack/react-query';
+import { SerializableQuery, SerializableMutation, SerializableObserver, SerializableQueryClient } from './types';
+export declare const dehydrateObservers: (query: Query) => SerializableObserver[];
+export declare const dehydrateQuery: (query: Query) => SerializableQuery;
+export declare const dehydrateMutation: (mutation: Mutation) => SerializableMutation;
+export declare const dehydrateQueryClient: (queryClient: QueryClient) => SerializableQueryClient;

package/dist/src/shared/hydrate.d.ts

@@ -0,0 +1,10 @@
+import { QueryClient } from '@tanstack/react-query';
+import { SerializableQuery, SerializableMutation, SerializableQueryClient, SerializableObserver, PartialQueryState } from './types';
+export declare const hydrateQueryClient: (client: QueryClient, dehydratedState: SerializableQueryClient) => void;
+export declare const applyQueryEvent: (queryClient: QueryClient, type: "added" | "updated" | "removed" | "observerAdded" | "observerRemoved" | "observerResultsUpdated" | "observerOptionsUpdated", data: SerializableQuery | PartialQueryState, action?: string) => void;
+export declare const applyPartialQueryState: (queryClient: QueryClient, data: PartialQueryState) => void;
+export declare const applyMutationEvent: (queryClient: QueryClient, type: "added" | "updated" | "removed" | "observerAdded" | "observerRemoved" | "observerResultsUpdated" | "observerOptionsUpdated", data: SerializableMutation) => void;
+export declare const applyQueryObserverEvent: (queryClient: QueryClient, data: {
+    queryHash: string;
+    observers: SerializableObserver[];
+}) => void;

package/dist/src/shared/messaging.d.ts

@@ -0,0 +1,34 @@
+import { RozeniteDevToolsClient } from '@rozenite/plugin-bridge';
+import { DevToolsActionType, SerializableQueryClient, SerializableQuery, SerializableMutation, SerializableObserver, PartialQueryState } from './types';
+export type TanStackQueryPluginEventMap = {
+    'online-status-changed': {
+        online: boolean;
+    };
+    'devtools-action': {
+        type: DevToolsActionType;
+        queryHash: string;
+    };
+    'request-initial-data': unknown;
+    'sync-data': {
+        data: SerializableQueryClient;
+    };
+    'sync-query-event': {
+        type: 'added' | 'removed';
+        data: SerializableQuery;
+    } | {
+        type: 'updated';
+        action?: string;
+        data: SerializableQuery | PartialQueryState;
+    } | {
+        type: 'observerAdded' | 'observerRemoved' | 'observerOptionsUpdated';
+        data: {
+            queryHash: string;
+            observers: SerializableObserver[];
+        };
+    };
+    'sync-mutation-event': {
+        type: 'added' | 'updated' | 'removed' | 'observerAdded' | 'observerRemoved' | 'observerResultsUpdated' | 'observerOptionsUpdated';
+        data: SerializableMutation;
+    };
+};
+export type TanStackQueryPluginClient = RozeniteDevToolsClient<TanStackQueryPluginEventMap>;

package/dist/src/shared/types.d.ts

@@ -0,0 +1,25 @@
+import { QueryKey, MutationState, QueryState, QueryObserverOptions, InfiniteQueryObserverOptions, MutationOptions } from '@tanstack/react-query';
+export type SerializableQuery = {
+    queryHash: string;
+    state: QueryState;
+    queryKey: QueryKey;
+    observers: SerializableObserver[];
+};
+export type PartialQueryState = {
+    queryHash: string;
+    state: Partial<QueryState>;
+};
+export type SerializableMutation = {
+    mutationId: number;
+    options: MutationOptions;
+    state: MutationState;
+};
+export type SerializableObserver = {
+    queryHash: string;
+    options: QueryObserverOptions | InfiniteQueryObserverOptions;
+};
+export type SerializableQueryClient = {
+    queries: SerializableQuery[];
+    mutations: SerializableMutation[];
+};
+export type DevToolsActionType = 'REFETCH' | 'INVALIDATE' | 'RESET' | 'REMOVE' | 'TRIGGER_ERROR' | 'RESTORE_ERROR' | 'TRIGGER_LOADING' | 'RESTORE_LOADING' | 'CLEAR_MUTATION_CACHE' | 'CLEAR_QUERY_CACHE';

package/dist/src/shared/useSyncOnlineStatus.d.ts

@@ -0,0 +1,2 @@
+import { TanStackQueryPluginClient } from './messaging';
+export declare const useSyncOnlineStatus: (client: TanStackQueryPluginClient | null) => void;

package/dist/src/ui/tanstack-query.d.ts

@@ -0,0 +1 @@
+export default function TanStackQueryPanel(): import("react/jsx-runtime").JSX.Element;

package/dist/src/ui/useHandleSyncMessages.d.ts

@@ -0,0 +1,2 @@
+import { TanStackQueryPluginClient } from '../shared/messaging';
+export declare const useHandleSyncMessages: (client: TanStackQueryPluginClient | null) => void;

package/dist/src/ui/useSyncDevToolsEvents.d.ts

@@ -0,0 +1,2 @@
+import { TanStackQueryPluginClient } from '../shared/messaging';
+export declare const useSyncDevToolsEvents: (client: TanStackQueryPluginClient | null) => void;

package/dist/src/ui/useSyncInitialData.d.ts

@@ -0,0 +1,2 @@
+import { TanStackQueryPluginClient } from '../shared/messaging';
+export declare const useSyncInitialData: (client: TanStackQueryPluginClient | null) => void;

package/dist/tanstack-query.html

@@ -22,7 +22,7 @@
     <script>
       var __ROZENITE_PANEL__ = true;
     </script>
-    <script type="module" crossorigin src="./assets/tanstack-query-DSN-k5Qe.js"></script>
+    <script type="module" crossorigin src="./assets/tanstack-query-PB2x2Kty.js"></script>
   </head>
   <body>
     <div id="root"></div>

package/dist/useTanstackQueryDevTools.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("@rozenite/plugin-bridge"),y=require("react"),p=require("@tanstack/react-query"),q=require("fast-deep-equal"),S=e=>e&&e.__esModule?e:{default:e},g=S(q),l=e=>{y.useEffect(()=>{if(!e)return;const a=p.onlineManager.subscribe(n=>{e.send("online-status-changed",{online:n})}),c=e.onMessage("online-status-changed",({online:n})=>{p.onlineManager.setOnline(n)});return()=>{a(),c.remove()}},[e])},M=(e,a)=>{y.useEffect(()=>{if(!a)return;const c=a.onMessage("devtools-action",({type:n,queryHash:o})=>{const s=e.getQueryCache().get(o);if(!s){console.warn(`No active query found for hash: ${o}`);return}switch(n){case"TRIGGER_ERROR":{const d=s.options,t=new Error("Unknown error from devtools");s.setState({status:"error",error:t,fetchMeta:{...s.state.fetchMeta,__previousQueryOptions:d}});break}case"RESTORE_ERROR":{e.resetQueries(s);break}case"TRIGGER_LOADING":{if(!s)return;const d=s.options;s.fetch({...d,queryFn:()=>new Promise(()=>{}),gcTime:-1}),s.setState({data:void 0,status:"pending",fetchMeta:{...s.state.fetchMeta,__previousQueryOptions:d}});break}case"RESTORE_LOADING":{const d=s.state,t=s.state.fetchMeta?s.state.fetchMeta.__previousQueryOptions:null;s.cancel({silent:!0}),s.setState({...d,fetchStatus:"idle",fetchMeta:null}),t&&s.fetch(t);break}case"RESET":{e.resetQueries(s);break}case"REMOVE":{e.removeQueries(s);break}case"REFETCH":{s.fetch().catch(()=>{});break}case"INVALIDATE":{e.invalidateQueries(s);break}default:console.warn(`Unknown devtools action: ${n}`)}});return()=>{c.remove()}},[a])},f=e=>e.observers.map(a=>({queryHash:e.queryHash,options:a.options})),h=e=>{const a=f(e);return{state:e.state,queryKey:e.queryKey,queryHash:e.queryHash,observers:a}},v=e=>({mutationId:e.mutationId,state:e.state,options:e.options}),H=e=>({queries:e.getQueryCache().getAll().map(h),mutations:e.getMutationCache().getAll().map(v)}),R=(e,a)=>{const c=y.useRef(new Map),n=y.useMemo(()=>o=>{if(!a||o.type==="observerResultsUpdated")return;if("query"in o){const{query:t,type:u}=o;if(u==="added"||u==="removed"){u==="removed"&&c.current.delete(t.queryHash);const i=h(t);a.send("sync-query-event",{type:u,data:i});return}if(u==="updated"&&"action"in o){const i=o.action;switch(i.type){case"fetch":{const r={queryHash:t.queryHash,state:{status:t.state.status,fetchStatus:t.state.fetchStatus,fetchMeta:t.state.fetchMeta,dataUpdatedAt:t.state.dataUpdatedAt,errorUpdatedAt:t.state.errorUpdatedAt}};a.send("sync-query-event",{type:"updated",action:"fetch",data:r});break}case"success":{const r={queryHash:t.queryHash,state:{status:t.state.status,data:t.state.data,dataUpdatedAt:t.state.dataUpdatedAt,error:t.state.error,errorUpdatedAt:t.state.errorUpdatedAt,fetchStatus:t.state.fetchStatus}};a.send("sync-query-event",{type:"updated",action:"success",data:r});break}case"error":{const r={queryHash:t.queryHash,state:{status:t.state.status,error:t.state.error,errorUpdatedAt:t.state.errorUpdatedAt,fetchStatus:t.state.fetchStatus}};a.send("sync-query-event",{type:"updated",action:"error",data:r});break}case"setState":{const r={queryHash:t.queryHash,state:i.state};a.send("sync-query-event",{type:"updated",action:"setState",data:r});break}case"invalidate":{const r={queryHash:t.queryHash,state:{isInvalidated:t.state.isInvalidated}};a.send("sync-query-event",{type:"updated",action:"invalidate",data:r});break}case"pause":{const r={queryHash:t.queryHash,state:{fetchStatus:t.state.fetchStatus}};a.send("sync-query-event",{type:"updated",action:"pause",data:r});break}case"continue":{const r={queryHash:t.queryHash,state:{fetchStatus:t.state.fetchStatus}};a.send("sync-query-event",{type:"updated",action:"continue",data:r});break}default:{const r=h(t);a.send("sync-query-event",{type:u,data:r})}}return}if(u==="observerAdded"||u==="observerRemoved"||u==="observerOptionsUpdated"){const i=f(t),r=c.current.get(t.queryHash);if(u==="observerOptionsUpdated"&&r&&g.default(r,i))return;c.current.set(t.queryHash,i),a.send("sync-query-event",{type:u,data:{queryHash:t.queryHash,observers:i}});return}}const{mutation:s,type:d}=o;if(s){const t=v(s);a.send("sync-mutation-event",{type:d,data:t})}},[a]);y.useEffect(()=>{if(!a)return;const o=e.getMutationCache().subscribe(n),s=e.getQueryCache().subscribe(n);return()=>{o(),s()}},[a,e,n])},k=(e,a)=>{y.useEffect(()=>{if(!a)return;const c=a.onMessage("request-initial-data",()=>{const n=H(e);a.send("sync-data",{data:n})});return()=>{c.remove()}},[a,e])},O=e=>{const a=b.useRozeniteDevToolsClient({pluginId:"@rozenite/tanstack-query-plugin"});l(a),M(e,a),R(e,a),k(e,a)};exports.useTanStackQueryDevTools=O;

package/dist/useTanstackQueryDevTools.js

@@ -0,0 +1,312 @@
+import { useRozeniteDevToolsClient as b } from "@rozenite/plugin-bridge";
+import { useEffect as y, useRef as S, useMemo as q } from "react";
+import { onlineManager as h } from "@tanstack/react-query";
+import m from "fast-deep-equal";
+const H = (t) => {
+  y(() => {
+    if (!t)
+      return;
+    const a = h.subscribe((n) => {
+      t.send("online-status-changed", { online: n });
+    }), d = t.onMessage(
+      "online-status-changed",
+      ({ online: n }) => {
+        h.setOnline(n);
+      }
+    );
+    return () => {
+      a(), d.remove();
+    };
+  }, [t]);
+}, M = (t, a) => {
+  y(() => {
+    if (!a)
+      return;
+    const d = a.onMessage(
+      "devtools-action",
+      ({ type: n, queryHash: o }) => {
+        const s = t.getQueryCache().get(o);
+        if (!s) {
+          console.warn(`No active query found for hash: ${o}`);
+          return;
+        }
+        switch (n) {
+          case "TRIGGER_ERROR": {
+            const c = s.options, e = new Error("Unknown error from devtools");
+            s.setState({
+              status: "error",
+              error: e,
+              fetchMeta: {
+                ...s.state.fetchMeta,
+                // @ts-expect-error This does exist
+                __previousQueryOptions: c
+              }
+            });
+            break;
+          }
+          case "RESTORE_ERROR": {
+            t.resetQueries(s);
+            break;
+          }
+          case "TRIGGER_LOADING": {
+            if (!s) return;
+            const c = s.options;
+            s.fetch({
+              ...c,
+              queryFn: () => new Promise(() => {
+              }),
+              gcTime: -1
+            }), s.setState({
+              data: void 0,
+              status: "pending",
+              fetchMeta: {
+                ...s.state.fetchMeta,
+                // @ts-expect-error This does exist
+                __previousQueryOptions: c
+              }
+            });
+            break;
+          }
+          case "RESTORE_LOADING": {
+            const c = s.state, e = s.state.fetchMeta ? s.state.fetchMeta.__previousQueryOptions : null;
+            s.cancel({ silent: !0 }), s.setState({
+              ...c,
+              fetchStatus: "idle",
+              fetchMeta: null
+            }), e && s.fetch(e);
+            break;
+          }
+          case "RESET": {
+            t.resetQueries(s);
+            break;
+          }
+          case "REMOVE": {
+            t.removeQueries(s);
+            break;
+          }
+          case "REFETCH": {
+            s.fetch().catch(() => {
+            });
+            break;
+          }
+          case "INVALIDATE": {
+            t.invalidateQueries(s);
+            break;
+          }
+          default:
+            console.warn(`Unknown devtools action: ${n}`);
+        }
+      }
+    );
+    return () => {
+      d.remove();
+    };
+  }, [a]);
+}, f = (t) => t.observers.map((a) => ({
+  queryHash: t.queryHash,
+  options: a.options
+})), p = (t) => {
+  const a = f(t);
+  return {
+    state: t.state,
+    queryKey: t.queryKey,
+    queryHash: t.queryHash,
+    observers: a
+  };
+}, v = (t) => ({
+  mutationId: t.mutationId,
+  state: t.state,
+  options: t.options
+}), g = (t) => ({
+  queries: t.getQueryCache().getAll().map(p),
+  mutations: t.getMutationCache().getAll().map(v)
+}), R = (t, a) => {
+  const d = S(
+    /* @__PURE__ */ new Map()
+  ), n = q(() => (o) => {
+    if (!a || o.type === "observerResultsUpdated")
+      return;
+    if ("query" in o) {
+      const { query: e, type: u } = o;
+      if (u === "added" || u === "removed") {
+        u === "removed" && d.current.delete(e.queryHash);
+        const i = p(e);
+        a.send("sync-query-event", { type: u, data: i });
+        return;
+      }
+      if (u === "updated" && "action" in o) {
+        const i = o.action;
+        switch (i.type) {
+          case "fetch": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                status: e.state.status,
+                fetchStatus: e.state.fetchStatus,
+                fetchMeta: e.state.fetchMeta,
+                dataUpdatedAt: e.state.dataUpdatedAt,
+                errorUpdatedAt: e.state.errorUpdatedAt
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "fetch",
+              data: r
+            });
+            break;
+          }
+          case "success": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                status: e.state.status,
+                data: e.state.data,
+                dataUpdatedAt: e.state.dataUpdatedAt,
+                error: e.state.error,
+                errorUpdatedAt: e.state.errorUpdatedAt,
+                fetchStatus: e.state.fetchStatus
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "success",
+              data: r
+            });
+            break;
+          }
+          case "error": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                status: e.state.status,
+                error: e.state.error,
+                errorUpdatedAt: e.state.errorUpdatedAt,
+                fetchStatus: e.state.fetchStatus
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "error",
+              data: r
+            });
+            break;
+          }
+          case "setState": {
+            const r = {
+              queryHash: e.queryHash,
+              state: i.state
+              // Only the changed state parts
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "setState",
+              data: r
+            });
+            break;
+          }
+          case "invalidate": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                isInvalidated: e.state.isInvalidated
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "invalidate",
+              data: r
+            });
+            break;
+          }
+          case "pause": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                fetchStatus: e.state.fetchStatus
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "pause",
+              data: r
+            });
+            break;
+          }
+          case "continue": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                fetchStatus: e.state.fetchStatus
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "continue",
+              data: r
+            });
+            break;
+          }
+          default: {
+            const r = p(e);
+            a.send("sync-query-event", { type: u, data: r });
+          }
+        }
+        return;
+      }
+      if (u === "observerAdded" || u === "observerRemoved" || u === "observerOptionsUpdated") {
+        const i = f(e), r = d.current.get(
+          e.queryHash
+        );
+        if (u === "observerOptionsUpdated" && r && m(r, i))
+          return;
+        d.current.set(
+          e.queryHash,
+          i
+        ), a.send("sync-query-event", {
+          type: u,
+          data: {
+            queryHash: e.queryHash,
+            observers: i
+          }
+        });
+        return;
+      }
+    }
+    const { mutation: s, type: c } = o;
+    if (s) {
+      const e = v(s);
+      a.send("sync-mutation-event", {
+        type: c,
+        data: e
+      });
+    }
+  }, [a]);
+  y(() => {
+    if (!a)
+      return;
+    const o = t.getMutationCache().subscribe(n), s = t.getQueryCache().subscribe(n);
+    return () => {
+      o(), s();
+    };
+  }, [a, t, n]);
+}, k = (t, a) => {
+  y(() => {
+    if (!a)
+      return;
+    const d = a.onMessage("request-initial-data", () => {
+      const n = g(t);
+      a.send("sync-data", { data: n });
+    });
+    return () => {
+      d.remove();
+    };
+  }, [a, t]);
+}, l = (t) => {
+  const a = b({
+    pluginId: "@rozenite/tanstack-query-plugin"
+  });
+  H(a), M(t, a), R(t, a), k(t, a);
+};
+export {
+  l as useTanStackQueryDevTools
+};

package/package.json

@@ -1,31 +1,32 @@
 {
   "name": "@rozenite/tanstack-query-plugin",
-  "version": "1.0.0-alpha.4",
+  "version": "1.0.0-alpha.6",
   "description": "TanStack Query for Rozenite.",
   "type": "module",
   "main": "./dist/react-native.cjs",
   "module": "./dist/react-native.js",
   "types": "./dist/react-native.d.ts",
   "dependencies": {
-    "@rozenite/plugin-bridge": "1.0.0-alpha.4"
+    "fast-deep-equal": "^3.1.3",
+    "@rozenite/plugin-bridge": "1.0.0-alpha.6"
   },
   "devDependencies": {
-    "vite": "^6.0.0",
-    "typescript": "^5.7.3",
-    "react-native-web": "0.21.0",
+    "@tanstack/react-query": "^5.0.0",
+    "@tanstack/react-query-devtools": "^5.0.0",
+    "@types/react": "~18.3.12",
     "react": "18.3.1",
     "react-dom": "18.3.0",
     "react-native": "0.76.0",
-    "@types/react": "~18.3.12",
-    "@tanstack/react-query": "^5.0.0",
-    "@tanstack/react-query-devtools": "^5.0.0",
-    "@rozenite/vite-plugin": "1.0.0-alpha.4",
-    "rozenite": "1.0.0-alpha.4"
+    "react-native-web": "0.21.0",
+    "typescript": "^5.7.3",
+    "vite": "^6.0.0",
+    "@rozenite/vite-plugin": "1.0.0-alpha.6",
+    "rozenite": "1.0.0-alpha.6"
   },
   "peerDependencies": {
+    "@tanstack/react-query": "^5.0.0",
     "react": "*",
-    "react-native": "*",
-    "@tanstack/react-query": "^5.0.0"
+    "react-native": "*"
   },
   "license": "MIT",
   "scripts": {

package/src/react-native/useHandleDevToolsMessages.ts

@@ -1,12 +1,11 @@
 import { useEffect } from 'react';
-import { useQueryClient } from '@tanstack/react-query';
+import { QueryClient } from '@tanstack/react-query';
 import { TanStackQueryPluginClient } from '../shared/messaging';
 
 export const useHandleDevToolsMessages = (
+  queryClient: QueryClient,
   client: TanStackQueryPluginClient | null
 ) => {
-  const queryClient = useQueryClient();
-
   useEffect(() => {
     if (!client) {
       return;

package/src/react-native/useHandleInitialData.ts

@@ -1,13 +1,12 @@
 import { useEffect } from 'react';
 import { TanStackQueryPluginClient } from '../shared/messaging';
-import { useQueryClient } from '@tanstack/react-query';
+import { QueryClient } from '@tanstack/react-query';
 import { dehydrateQueryClient } from '../shared/dehydrate';
 
 export const useHandleInitialData = (
+  queryClient: QueryClient,
   client: TanStackQueryPluginClient | null
 ) => {
-  const queryClient = useQueryClient();
-
   useEffect(() => {
     if (!client) {
       return;