@remix-relay/react 2.4.3 → 2.4.5

package/dist/index.js

@@ -48,14 +48,31 @@ var import_react_router = require("react-router");
 // src/deferred-query-context.tsx
 var import_react = require("react");
 var import_jsx_runtime = require("react/jsx-runtime");
-var DeferredQueryContext = (0, import_react.createContext)(
-  null
+function createDeferredQueryStore() {
+  let value = void 0;
+  const listeners = /* @__PURE__ */ new Set();
+  return {
+    get: () => value,
+    set: (newValue) => {
+      value = newValue;
+      listeners.forEach((l) => l());
+    },
+    subscribe: (listener) => {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    }
+  };
+}
+var DeferredQueryStoreContext = (0, import_react.createContext)(
+  createDeferredQueryStore()
 );
-var SetDeferredQueryContext = (0, import_react.createContext)(() => {
-});
+function useDeferredQuery() {
+  const store = (0, import_react.use)(DeferredQueryStoreContext);
+  return (0, import_react.useSyncExternalStore)(store.subscribe, store.get, () => void 0);
+}
 function RemixRelayProvider({ children }) {
-  const [deferredQueries, setDeferredQueries] = (0, import_react.useState)(null);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SetDeferredQueryContext, { value: setDeferredQueries, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DeferredQueryContext, { value: deferredQueries, children }) });
+  const store = (0, import_react.useMemo)(() => createDeferredQueryStore(), []);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DeferredQueryStoreContext, { value: store, children });
 }
 
 // src/Deferred.tsx
@@ -70,8 +87,14 @@ function useIsMounted() {
 }
 function Deferred({ children, ...rest }) {
   const mounted = useIsMounted();
-  const deferredQuery = (0, import_react2.use)(DeferredQueryContext);
-  return mounted ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react2.Suspense, { ...rest, children: deferredQuery ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_router.Await, { resolve: deferredQuery, children }) : children }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: rest.fallback });
+  const deferredQuery = useDeferredQuery();
+  if (!mounted || deferredQuery === void 0) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: rest.fallback });
+  }
+  if (deferredQuery === null) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react2.Suspense, { ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_router.Await, { resolve: deferredQuery, children }) });
 }
 
 // src/client-loader-query.ts
@@ -144,11 +167,16 @@ function useCommonLoaderQuery(query, fetchPolicy, loaderData) {
   const preloadedQuery = "preloadedQuery" in loaderData ? loaderData.preloadedQuery : null;
   const deferredQueries = "deferredQueries" in loaderData ? loaderData.deferredQueries : null;
   const [deferredResult, setDeferredResult] = (0, import_react3.useState)(preloadedQuery);
-  const setDeferredQueries = (0, import_react3.use)(SetDeferredQueryContext);
-  (0, import_react3.useEffect)(() => {
+  const store = (0, import_react3.use)(DeferredQueryStoreContext);
+  const transformedPromiseRef = (0, import_react3.useRef)(null);
+  const prevDeferredQueriesRef = (0, import_react3.useRef)(
+    /* @__PURE__ */ Symbol()
+  );
+  if (deferredQueries !== prevDeferredQueriesRef.current) {
+    prevDeferredQueriesRef.current = deferredQueries;
     if (deferredQueries) {
-      setDeferredQueries(
-        deferredQueries.then(async (deferredResults) => {
+      transformedPromiseRef.current = deferredQueries.then(
+        async (deferredResults) => {
           deferredResults.forEach((result) => {
             (0, import_react_dom.flushSync)(() => {
               setDeferredResult(
@@ -157,10 +185,14 @@ function useCommonLoaderQuery(query, fetchPolicy, loaderData) {
             });
           });
           return deferredResults;
-        })
+        }
       );
+      store.set(transformedPromiseRef.current);
+    } else {
+      transformedPromiseRef.current = null;
+      store.set(null);
     }
-  }, [deferredQueries, preloadedQuery, setDeferredQueries, setDeferredResult]);
+  }
   const environment = useRelayEnvironment();
   (0, import_react3.useMemo)(() => {
     if (deferredResult) {

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/Deferred.tsx","../src/deferred-query-context.tsx","../src/client-loader-query.ts","../src/get-cached-response.ts","../src/meta-query.ts","../src/useLoaderQuery.ts"],"sourcesContent":["export { Deferred } from \"./Deferred\";\nexport { clientLoaderQuery, getClientLoaderQuery } from \"./client-loader-query\";\nexport { RemixRelayProvider } from \"./deferred-query-context\";\nexport { getCachedResponse } from \"./get-cached-response\";\nexport { metaQuery } from \"./meta-query\";\nexport { useLoaderQuery, useRouteLoaderQuery } from \"./useLoaderQuery\";\n","import { Suspense, SuspenseProps, use, useSyncExternalStore } from \"react\";\nimport { Await } from \"react-router\";\nimport { DeferredQueryContext } from \"./deferred-query-context\";\n\nfunction useIsMounted() {\n  return useSyncExternalStore(\n    () => () => {},\n    () => true,\n    () => false,\n  );\n}\n\nexport function Deferred({ children, ...rest }: SuspenseProps) {\n  const mounted = useIsMounted();\n\n  const deferredQuery = use(DeferredQueryContext);\n\n  return mounted ? (\n    <Suspense {...rest}>\n      {deferredQuery ? (\n        <Await resolve={deferredQuery}>{children}</Await>\n      ) : (\n        children\n      )}\n    </Suspense>\n  ) : (\n    <>{rest.fallback}</>\n  );\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from \"react\";\nimport { createContext, useState } from \"react\";\n\nexport const DeferredQueryContext = createContext<Promise<unknown> | null>(\n  null,\n);\nexport const SetDeferredQueryContext = createContext<\n  Dispatch<SetStateAction<Promise<unknown> | null>>\n>(() => {});\n\nexport function RemixRelayProvider({ children }: PropsWithChildren) {\n  const [deferredQueries, setDeferredQueries] =\n    useState<Promise<unknown> | null>(null);\n\n  return (\n    <SetDeferredQueryContext value={setDeferredQueries}>\n      <DeferredQueryContext value={deferredQueries}>\n        {children}\n      </DeferredQueryContext>\n    </SetDeferredQueryContext>\n  );\n}\n","import relay from \"react-relay\";\nimport type {\n  Environment,\n  GraphQLTaggedNode,\n  OperationType,\n  VariablesOf,\n} from \"relay-runtime\";\n\nconst { fetchQuery, loadQuery } = relay;\n\nexport function getClientLoaderQuery(environment: Environment) {\n  return async <TQuery extends OperationType>(\n    query: GraphQLTaggedNode,\n    variables: VariablesOf<TQuery>,\n  ) => clientLoaderQuery(environment, query, variables);\n}\n\nexport async function clientLoaderQuery<TQuery extends OperationType>(\n  environment: Environment,\n  query: GraphQLTaggedNode,\n  variables: VariablesOf<TQuery>,\n) {\n  const data = await fetchQuery<TQuery>(environment, query, variables, {\n    fetchPolicy: \"store-or-network\",\n  }).toPromise();\n\n  const queryRef = loadQuery<TQuery>(environment, query, variables, {\n    fetchPolicy: \"store-only\",\n  });\n\n  return { queryRef, data };\n}\n","import type {\n  CacheConfig,\n  GraphQLResponse,\n  RequestParameters,\n  Variables,\n} from \"relay-runtime\";\nimport { Observable, QueryResponseCache } from \"relay-runtime\";\n\nexport const responseCache: QueryResponseCache = new QueryResponseCache({\n  size: 100,\n  ttl: 5000,\n});\n\nexport function getCachedResponse(\n  params: RequestParameters,\n  variables: Variables,\n  cacheConfig: CacheConfig,\n) {\n  const isQuery = params.operationKind === \"query\";\n  const cacheKey = params.id ?? params.cacheID;\n  const forceFetch = cacheConfig && cacheConfig.force;\n\n  if (responseCache === null || !isQuery || forceFetch) {\n    return null;\n  }\n\n  const fromCache = responseCache.get(cacheKey, variables);\n\n  const deferredFromCache: GraphQLResponse[] = [];\n\n  for (let i = 0; ; i++) {\n    const deferred = responseCache.get(`${cacheKey}-${i}`, variables);\n    if (!deferred) break;\n    deferredFromCache.push(deferred);\n  }\n\n  if (fromCache === null) {\n    return null;\n  }\n\n  return Observable.create((sink) => {\n    sink.next(fromCache);\n\n    for (const deferred of deferredFromCache) {\n      sink.next(deferred);\n    }\n\n    sink.complete();\n  });\n}\n","import type { MetaFunction } from \"react-router\";\nimport type { OperationType } from \"relay-runtime\";\n\nexport function metaQuery<TQuery extends OperationType>(\n  metaFunction: (\n    args: Parameters<MetaFunction>[0] & {\n      data: TQuery[\"response\"];\n    },\n  ) => ReturnType<MetaFunction>,\n): MetaFunction<\n  () =>\n    | { preloadedQuery: { response: { data: TQuery[\"response\"] } } }\n    | { data: TQuery[\"response\"] }\n> {\n  return ({ data, ...rest }) => {\n    const metaData: TQuery[\"response\"] =\n      data && \"data\" in data\n        ? data.data\n        : data && \"preloadedQuery\" in data\n          ? (data.preloadedQuery.response as { data: TQuery[\"response\"] }).data\n          : null;\n\n    return metaFunction({\n      data: metaData,\n      ...rest,\n    });\n  };\n}\n","import { use, useEffect, useMemo, useState } from \"react\";\nimport { flushSync } from \"react-dom\";\nimport type {\n  GraphQLTaggedNode,\n  PreloadFetchPolicy,\n  PreloadedQuery,\n} from \"react-relay\";\nimport relay from \"react-relay\";\nimport type { useQueryLoaderHookType } from \"react-relay/relay-hooks/useQueryLoader\";\nimport { useLoaderData, useRouteLoaderData } from \"react-router\";\nimport type {\n  ConcreteRequest,\n  GraphQLResponse,\n  OperationType,\n  RequestParameters,\n  VariablesOf,\n} from \"relay-runtime\";\nimport invariant from \"tiny-invariant\";\nimport { SetDeferredQueryContext } from \"./deferred-query-context\";\nimport { responseCache } from \"./get-cached-response\";\n\nconst { usePreloadedQuery, useQueryLoader, useRelayEnvironment } = relay;\n\nexport type SerializablePreloadedQuery<TQuery extends OperationType> = {\n  params: ConcreteRequest[\"params\"];\n  variables: VariablesOf<TQuery>;\n  response: GraphQLResponse;\n};\n\ntype LoaderData<TQuery extends OperationType> =\n  | {\n      preloadedQuery: SerializablePreloadedQuery<TQuery>;\n      deferredQueries: Promise<SerializablePreloadedQuery<TQuery>[]>;\n    }\n  | { queryRef: PreloadedQuery<TQuery> };\n\nfunction useCommonLoaderQuery<TQuery extends OperationType>(\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy,\n  loaderData: LoaderData<TQuery>,\n): [\n  TQuery[\"response\"],\n  useQueryLoaderHookType<TQuery>[1],\n  useQueryLoaderHookType<TQuery>[2],\n] {\n  const preloadedQuery =\n    \"preloadedQuery\" in loaderData\n      ? (loaderData.preloadedQuery as unknown as SerializablePreloadedQuery<TQuery>)\n      : null;\n\n  const deferredQueries =\n    \"deferredQueries\" in loaderData\n      ? (loaderData.deferredQueries as unknown as Promise<\n          SerializablePreloadedQuery<TQuery>[]\n        >)\n      : null;\n\n  const [deferredResult, setDeferredResult] = useState(preloadedQuery);\n\n  const setDeferredQueries = use(SetDeferredQueryContext);\n\n  useEffect(() => {\n    if (deferredQueries) {\n      setDeferredQueries(\n        deferredQueries.then(async (deferredResults) => {\n          deferredResults.forEach((result) => {\n            flushSync(() => {\n              setDeferredResult(\n                result as unknown as SerializablePreloadedQuery<TQuery>,\n              );\n            });\n          });\n\n          return deferredResults;\n        }),\n      );\n    }\n  }, [deferredQueries, preloadedQuery, setDeferredQueries, setDeferredResult]);\n\n  const environment = useRelayEnvironment();\n\n  useMemo(() => {\n    if (deferredResult) {\n      writePreloadedQueryToCache(deferredResult);\n    }\n  }, [deferredResult]);\n\n  let ref: PreloadedQuery<TQuery> | null =\n    \"queryRef\" in loaderData\n      ? (loaderData.queryRef as unknown as PreloadedQuery<TQuery>)\n      : deferredResult\n        ? {\n            environment,\n            fetchKey: `${\n              deferredResult.params.id ?? deferredResult.params.cacheID\n            }${simpleHash(deferredResult.response)}`,\n            fetchPolicy,\n            isDisposed: false,\n            name: deferredResult.params.name,\n            kind: \"PreloadedQuery\",\n            variables: deferredResult.variables,\n            dispose: () => {},\n          }\n        : null;\n\n  invariant(ref, \"Missing queryRef\");\n\n  const [queryRef, loadQuery, disposeQuery] = useQueryLoader<TQuery>(query);\n\n  if (queryRef) ref = queryRef;\n\n  const reloadQuery: typeof loadQuery = (\n    variables,\n    options = { fetchPolicy: \"store-and-network\" },\n  ) => loadQuery(variables, options);\n\n  const data = usePreloadedQuery<TQuery>(query, ref);\n\n  return [data, reloadQuery, disposeQuery];\n}\n\nexport function useLoaderQuery<TQuery extends OperationType>(\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy = \"network-only\",\n) {\n  const loaderData: LoaderData<TQuery> = useLoaderData();\n  return useCommonLoaderQuery(query, fetchPolicy, loaderData);\n}\n\nexport function useRouteLoaderQuery<TQuery extends OperationType>(\n  routeId: string,\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy = \"network-only\",\n) {\n  const loaderData: LoaderData<TQuery> | undefined =\n    useRouteLoaderData(routeId);\n\n  invariant(loaderData, `Missing loader data for routeId ${routeId}`);\n  return useCommonLoaderQuery(query, fetchPolicy, loaderData);\n}\n\nfunction writePreloadedQueryToCache<TQuery extends OperationType>(\n  preloadedQueryObject: SerializablePreloadedQuery<TQuery>,\n) {\n  const params = preloadedQueryObject.params as RequestParameters & {\n    cacheID?: string;\n  };\n\n  const cacheKey = params.cacheID ?? params.id;\n  invariant(cacheKey, \"Missing cacheKey\");\n\n  responseCache?.set(\n    cacheKey,\n    preloadedQueryObject.variables,\n    preloadedQueryObject.response,\n  );\n}\n\nfunction simpleHash(input: unknown): number {\n  return JSON.stringify(input)\n    .split(\"\")\n    .reduce((a, b) => {\n      a = (a << 5) - a + b.charCodeAt(0);\n      return a & a;\n    }, 0);\n}\n"],"mappings":"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","names":["import_react","import_jsx_runtime","relay","import_react","import_react_relay","import_react_router","relay","invariant","loadQuery"]}
+{"version":3,"sources":["../src/index.ts","../src/Deferred.tsx","../src/deferred-query-context.tsx","../src/client-loader-query.ts","../src/get-cached-response.ts","../src/meta-query.ts","../src/useLoaderQuery.ts"],"sourcesContent":["export { Deferred } from \"./Deferred\";\nexport { clientLoaderQuery, getClientLoaderQuery } from \"./client-loader-query\";\nexport { RemixRelayProvider } from \"./deferred-query-context\";\nexport { getCachedResponse } from \"./get-cached-response\";\nexport { metaQuery } from \"./meta-query\";\nexport { useLoaderQuery, useRouteLoaderQuery } from \"./useLoaderQuery\";\n","import { Suspense, SuspenseProps, useSyncExternalStore } from \"react\";\nimport { Await } from \"react-router\";\nimport { useDeferredQuery } from \"./deferred-query-context\";\n\nfunction useIsMounted() {\n  return useSyncExternalStore(\n    () => () => {},\n    () => true,\n    () => false,\n  );\n}\n\nexport function Deferred({ children, ...rest }: SuspenseProps) {\n  const mounted = useIsMounted();\n  const deferredQuery = useDeferredQuery();\n\n  // SSR or context not yet initialized - show fallback\n  if (!mounted || deferredQuery === undefined) {\n    return <>{rest.fallback}</>;\n  }\n\n  // No deferred data in this query - render children directly\n  if (deferredQuery === null) {\n    return <>{children}</>;\n  }\n\n  // Has deferred data - use Await\n  return (\n    <Suspense {...rest}>\n      <Await resolve={deferredQuery}>{children}</Await>\n    </Suspense>\n  );\n}\n","import type { PropsWithChildren } from \"react\";\nimport { createContext, use, useMemo, useSyncExternalStore } from \"react\";\n\ntype DeferredQueryValue = Promise<unknown> | null | undefined;\n\ntype DeferredQueryStore = {\n  get: () => DeferredQueryValue;\n  set: (value: DeferredQueryValue) => void;\n  subscribe: (listener: () => void) => () => void;\n};\n\nfunction createDeferredQueryStore(): DeferredQueryStore {\n  let value: DeferredQueryValue = undefined;\n  const listeners = new Set<() => void>();\n\n  return {\n    get: () => value,\n    set: (newValue) => {\n      value = newValue;\n      listeners.forEach((l) => l());\n    },\n    subscribe: (listener) => {\n      listeners.add(listener);\n      return () => listeners.delete(listener);\n    },\n  };\n}\n\nexport const DeferredQueryStoreContext = createContext<DeferredQueryStore>(\n  createDeferredQueryStore(),\n);\n\nexport function useDeferredQuery(): DeferredQueryValue {\n  const store = use(DeferredQueryStoreContext);\n  return useSyncExternalStore(store.subscribe, store.get, () => undefined);\n}\n\nexport function RemixRelayProvider({ children }: PropsWithChildren) {\n  const store = useMemo(() => createDeferredQueryStore(), []);\n\n  return (\n    <DeferredQueryStoreContext value={store}>\n      {children}\n    </DeferredQueryStoreContext>\n  );\n}\n","import relay from \"react-relay\";\nimport type {\n  Environment,\n  GraphQLTaggedNode,\n  OperationType,\n  VariablesOf,\n} from \"relay-runtime\";\n\nconst { fetchQuery, loadQuery } = relay;\n\nexport function getClientLoaderQuery(environment: Environment) {\n  return async <TQuery extends OperationType>(\n    query: GraphQLTaggedNode,\n    variables: VariablesOf<TQuery>,\n  ) => clientLoaderQuery(environment, query, variables);\n}\n\nexport async function clientLoaderQuery<TQuery extends OperationType>(\n  environment: Environment,\n  query: GraphQLTaggedNode,\n  variables: VariablesOf<TQuery>,\n) {\n  const data = await fetchQuery<TQuery>(environment, query, variables, {\n    fetchPolicy: \"store-or-network\",\n  }).toPromise();\n\n  const queryRef = loadQuery<TQuery>(environment, query, variables, {\n    fetchPolicy: \"store-only\",\n  });\n\n  return { queryRef, data };\n}\n","import type {\n  CacheConfig,\n  GraphQLResponse,\n  RequestParameters,\n  Variables,\n} from \"relay-runtime\";\nimport { Observable, QueryResponseCache } from \"relay-runtime\";\n\nexport const responseCache: QueryResponseCache = new QueryResponseCache({\n  size: 100,\n  ttl: 5000,\n});\n\nexport function getCachedResponse(\n  params: RequestParameters,\n  variables: Variables,\n  cacheConfig: CacheConfig,\n) {\n  const isQuery = params.operationKind === \"query\";\n  const cacheKey = params.id ?? params.cacheID;\n  const forceFetch = cacheConfig && cacheConfig.force;\n\n  if (responseCache === null || !isQuery || forceFetch) {\n    return null;\n  }\n\n  const fromCache = responseCache.get(cacheKey, variables);\n\n  const deferredFromCache: GraphQLResponse[] = [];\n\n  for (let i = 0; ; i++) {\n    const deferred = responseCache.get(`${cacheKey}-${i}`, variables);\n    if (!deferred) break;\n    deferredFromCache.push(deferred);\n  }\n\n  if (fromCache === null) {\n    return null;\n  }\n\n  return Observable.create((sink) => {\n    sink.next(fromCache);\n\n    for (const deferred of deferredFromCache) {\n      sink.next(deferred);\n    }\n\n    sink.complete();\n  });\n}\n","import type { MetaFunction } from \"react-router\";\nimport type { OperationType } from \"relay-runtime\";\n\nexport function metaQuery<TQuery extends OperationType>(\n  metaFunction: (\n    args: Parameters<MetaFunction>[0] & {\n      data: TQuery[\"response\"];\n    },\n  ) => ReturnType<MetaFunction>,\n): MetaFunction<\n  () =>\n    | { preloadedQuery: { response: { data: TQuery[\"response\"] } } }\n    | { data: TQuery[\"response\"] }\n> {\n  return ({ data, ...rest }) => {\n    const metaData: TQuery[\"response\"] =\n      data && \"data\" in data\n        ? data.data\n        : data && \"preloadedQuery\" in data\n          ? (data.preloadedQuery.response as { data: TQuery[\"response\"] }).data\n          : null;\n\n    return metaFunction({\n      data: metaData,\n      ...rest,\n    });\n  };\n}\n","import { use, useMemo, useRef, useState } from \"react\";\nimport { flushSync } from \"react-dom\";\nimport type {\n  GraphQLTaggedNode,\n  PreloadFetchPolicy,\n  PreloadedQuery,\n} from \"react-relay\";\nimport relay from \"react-relay\";\nimport type { useQueryLoaderHookType } from \"react-relay/relay-hooks/useQueryLoader\";\nimport { useLoaderData, useRouteLoaderData } from \"react-router\";\nimport type {\n  ConcreteRequest,\n  GraphQLResponse,\n  OperationType,\n  RequestParameters,\n  VariablesOf,\n} from \"relay-runtime\";\nimport invariant from \"tiny-invariant\";\nimport { DeferredQueryStoreContext } from \"./deferred-query-context\";\nimport { responseCache } from \"./get-cached-response\";\n\nconst { usePreloadedQuery, useQueryLoader, useRelayEnvironment } = relay;\n\nexport type SerializablePreloadedQuery<TQuery extends OperationType> = {\n  params: ConcreteRequest[\"params\"];\n  variables: VariablesOf<TQuery>;\n  response: GraphQLResponse;\n};\n\ntype LoaderData<TQuery extends OperationType> =\n  | {\n      preloadedQuery: SerializablePreloadedQuery<TQuery>;\n      deferredQueries: Promise<SerializablePreloadedQuery<TQuery>[]>;\n    }\n  | { queryRef: PreloadedQuery<TQuery> };\n\nfunction useCommonLoaderQuery<TQuery extends OperationType>(\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy,\n  loaderData: LoaderData<TQuery>,\n): [\n  TQuery[\"response\"],\n  useQueryLoaderHookType<TQuery>[1],\n  useQueryLoaderHookType<TQuery>[2],\n] {\n  const preloadedQuery =\n    \"preloadedQuery\" in loaderData\n      ? (loaderData.preloadedQuery as unknown as SerializablePreloadedQuery<TQuery>)\n      : null;\n\n  const deferredQueries =\n    \"deferredQueries\" in loaderData\n      ? (loaderData.deferredQueries as unknown as Promise<\n          SerializablePreloadedQuery<TQuery>[]\n        >)\n      : null;\n\n  const [deferredResult, setDeferredResult] = useState(preloadedQuery);\n\n  const store = use(DeferredQueryStoreContext);\n\n  // Track transformed promise to avoid recreating on every render\n  const transformedPromiseRef = useRef<Promise<unknown> | null>(null);\n  const prevDeferredQueriesRef = useRef<typeof deferredQueries | symbol>(\n    Symbol(),\n  );\n\n  // Set store synchronously during render (before Deferred reads it)\n  if (deferredQueries !== prevDeferredQueriesRef.current) {\n    prevDeferredQueriesRef.current = deferredQueries;\n    if (deferredQueries) {\n      transformedPromiseRef.current = deferredQueries.then(\n        async (deferredResults) => {\n          deferredResults.forEach((result) => {\n            flushSync(() => {\n              setDeferredResult(\n                result as unknown as SerializablePreloadedQuery<TQuery>,\n              );\n            });\n          });\n          return deferredResults;\n        },\n      );\n      store.set(transformedPromiseRef.current);\n    } else {\n      transformedPromiseRef.current = null;\n      store.set(null);\n    }\n  }\n\n  const environment = useRelayEnvironment();\n\n  useMemo(() => {\n    if (deferredResult) {\n      writePreloadedQueryToCache(deferredResult);\n    }\n  }, [deferredResult]);\n\n  let ref: PreloadedQuery<TQuery> | null =\n    \"queryRef\" in loaderData\n      ? (loaderData.queryRef as unknown as PreloadedQuery<TQuery>)\n      : deferredResult\n        ? {\n            environment,\n            fetchKey: `${\n              deferredResult.params.id ?? deferredResult.params.cacheID\n            }${simpleHash(deferredResult.response)}`,\n            fetchPolicy,\n            isDisposed: false,\n            name: deferredResult.params.name,\n            kind: \"PreloadedQuery\",\n            variables: deferredResult.variables,\n            dispose: () => {},\n          }\n        : null;\n\n  invariant(ref, \"Missing queryRef\");\n\n  const [queryRef, loadQuery, disposeQuery] = useQueryLoader<TQuery>(query);\n\n  if (queryRef) ref = queryRef;\n\n  const reloadQuery: typeof loadQuery = (\n    variables,\n    options = { fetchPolicy: \"store-and-network\" },\n  ) => loadQuery(variables, options);\n\n  const data = usePreloadedQuery<TQuery>(query, ref);\n\n  return [data, reloadQuery, disposeQuery];\n}\n\nexport function useLoaderQuery<TQuery extends OperationType>(\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy = \"network-only\",\n) {\n  const loaderData: LoaderData<TQuery> = useLoaderData();\n  return useCommonLoaderQuery(query, fetchPolicy, loaderData);\n}\n\nexport function useRouteLoaderQuery<TQuery extends OperationType>(\n  routeId: string,\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy = \"network-only\",\n) {\n  const loaderData: LoaderData<TQuery> | undefined =\n    useRouteLoaderData(routeId);\n\n  invariant(loaderData, `Missing loader data for routeId ${routeId}`);\n  return useCommonLoaderQuery(query, fetchPolicy, loaderData);\n}\n\nfunction writePreloadedQueryToCache<TQuery extends OperationType>(\n  preloadedQueryObject: SerializablePreloadedQuery<TQuery>,\n) {\n  const params = preloadedQueryObject.params as RequestParameters & {\n    cacheID?: string;\n  };\n\n  const cacheKey = params.cacheID ?? params.id;\n  invariant(cacheKey, \"Missing cacheKey\");\n\n  responseCache?.set(\n    cacheKey,\n    preloadedQueryObject.variables,\n    preloadedQueryObject.response,\n  );\n}\n\nfunction simpleHash(input: unknown): number {\n  return JSON.stringify(input)\n    .split(\"\")\n    .reduce((a, b) => {\n      a = (a << 5) - a + b.charCodeAt(0);\n      return a & a;\n    }, 0);\n}\n"],"mappings":"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","names":["import_react","import_jsx_runtime","relay","import_react","import_react_relay","import_react_router","relay","invariant","loadQuery"]}

package/dist/index.mjs

@@ -1,24 +1,41 @@
 // src/Deferred.tsx
-import { Suspense, use, useSyncExternalStore } from "react";
+import { Suspense, useSyncExternalStore as useSyncExternalStore2 } from "react";
 import { Await } from "react-router";
 
 // src/deferred-query-context.tsx
-import { createContext, useState } from "react";
+import { createContext, use, useMemo, useSyncExternalStore } from "react";
 import { jsx } from "react/jsx-runtime";
-var DeferredQueryContext = createContext(
-  null
+function createDeferredQueryStore() {
+  let value = void 0;
+  const listeners = /* @__PURE__ */ new Set();
+  return {
+    get: () => value,
+    set: (newValue) => {
+      value = newValue;
+      listeners.forEach((l) => l());
+    },
+    subscribe: (listener) => {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    }
+  };
+}
+var DeferredQueryStoreContext = createContext(
+  createDeferredQueryStore()
 );
-var SetDeferredQueryContext = createContext(() => {
-});
+function useDeferredQuery() {
+  const store = use(DeferredQueryStoreContext);
+  return useSyncExternalStore(store.subscribe, store.get, () => void 0);
+}
 function RemixRelayProvider({ children }) {
-  const [deferredQueries, setDeferredQueries] = useState(null);
-  return /* @__PURE__ */ jsx(SetDeferredQueryContext, { value: setDeferredQueries, children: /* @__PURE__ */ jsx(DeferredQueryContext, { value: deferredQueries, children }) });
+  const store = useMemo(() => createDeferredQueryStore(), []);
+  return /* @__PURE__ */ jsx(DeferredQueryStoreContext, { value: store, children });
 }
 
 // src/Deferred.tsx
 import { Fragment, jsx as jsx2 } from "react/jsx-runtime";
 function useIsMounted() {
-  return useSyncExternalStore(
+  return useSyncExternalStore2(
     () => () => {
     },
     () => true,
@@ -27,8 +44,14 @@ function useIsMounted() {
 }
 function Deferred({ children, ...rest }) {
   const mounted = useIsMounted();
-  const deferredQuery = use(DeferredQueryContext);
-  return mounted ? /* @__PURE__ */ jsx2(Suspense, { ...rest, children: deferredQuery ? /* @__PURE__ */ jsx2(Await, { resolve: deferredQuery, children }) : children }) : /* @__PURE__ */ jsx2(Fragment, { children: rest.fallback });
+  const deferredQuery = useDeferredQuery();
+  if (!mounted || deferredQuery === void 0) {
+    return /* @__PURE__ */ jsx2(Fragment, { children: rest.fallback });
+  }
+  if (deferredQuery === null) {
+    return /* @__PURE__ */ jsx2(Fragment, { children });
+  }
+  return /* @__PURE__ */ jsx2(Suspense, { ...rest, children: /* @__PURE__ */ jsx2(Await, { resolve: deferredQuery, children }) });
 }
 
 // src/client-loader-query.ts
@@ -91,7 +114,7 @@ function metaQuery(metaFunction) {
 }
 
 // src/useLoaderQuery.ts
-import { use as use2, useEffect, useMemo, useState as useState2 } from "react";
+import { use as use2, useMemo as useMemo2, useRef, useState } from "react";
 import { flushSync } from "react-dom";
 import relay2 from "react-relay";
 import { useLoaderData, useRouteLoaderData } from "react-router";
@@ -100,12 +123,17 @@ var { usePreloadedQuery, useQueryLoader, useRelayEnvironment } = relay2;
 function useCommonLoaderQuery(query, fetchPolicy, loaderData) {
   const preloadedQuery = "preloadedQuery" in loaderData ? loaderData.preloadedQuery : null;
   const deferredQueries = "deferredQueries" in loaderData ? loaderData.deferredQueries : null;
-  const [deferredResult, setDeferredResult] = useState2(preloadedQuery);
-  const setDeferredQueries = use2(SetDeferredQueryContext);
-  useEffect(() => {
+  const [deferredResult, setDeferredResult] = useState(preloadedQuery);
+  const store = use2(DeferredQueryStoreContext);
+  const transformedPromiseRef = useRef(null);
+  const prevDeferredQueriesRef = useRef(
+    /* @__PURE__ */ Symbol()
+  );
+  if (deferredQueries !== prevDeferredQueriesRef.current) {
+    prevDeferredQueriesRef.current = deferredQueries;
     if (deferredQueries) {
-      setDeferredQueries(
-        deferredQueries.then(async (deferredResults) => {
+      transformedPromiseRef.current = deferredQueries.then(
+        async (deferredResults) => {
           deferredResults.forEach((result) => {
             flushSync(() => {
               setDeferredResult(
@@ -114,12 +142,16 @@ function useCommonLoaderQuery(query, fetchPolicy, loaderData) {
             });
           });
           return deferredResults;
-        })
+        }
       );
+      store.set(transformedPromiseRef.current);
+    } else {
+      transformedPromiseRef.current = null;
+      store.set(null);
     }
-  }, [deferredQueries, preloadedQuery, setDeferredQueries, setDeferredResult]);
+  }
   const environment = useRelayEnvironment();
-  useMemo(() => {
+  useMemo2(() => {
     if (deferredResult) {
       writePreloadedQueryToCache(deferredResult);
     }

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Deferred.tsx","../src/deferred-query-context.tsx","../src/client-loader-query.ts","../src/get-cached-response.ts","../src/meta-query.ts","../src/useLoaderQuery.ts"],"sourcesContent":["import { Suspense, SuspenseProps, use, useSyncExternalStore } from \"react\";\nimport { Await } from \"react-router\";\nimport { DeferredQueryContext } from \"./deferred-query-context\";\n\nfunction useIsMounted() {\n  return useSyncExternalStore(\n    () => () => {},\n    () => true,\n    () => false,\n  );\n}\n\nexport function Deferred({ children, ...rest }: SuspenseProps) {\n  const mounted = useIsMounted();\n\n  const deferredQuery = use(DeferredQueryContext);\n\n  return mounted ? (\n    <Suspense {...rest}>\n      {deferredQuery ? (\n        <Await resolve={deferredQuery}>{children}</Await>\n      ) : (\n        children\n      )}\n    </Suspense>\n  ) : (\n    <>{rest.fallback}</>\n  );\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from \"react\";\nimport { createContext, useState } from \"react\";\n\nexport const DeferredQueryContext = createContext<Promise<unknown> | null>(\n  null,\n);\nexport const SetDeferredQueryContext = createContext<\n  Dispatch<SetStateAction<Promise<unknown> | null>>\n>(() => {});\n\nexport function RemixRelayProvider({ children }: PropsWithChildren) {\n  const [deferredQueries, setDeferredQueries] =\n    useState<Promise<unknown> | null>(null);\n\n  return (\n    <SetDeferredQueryContext value={setDeferredQueries}>\n      <DeferredQueryContext value={deferredQueries}>\n        {children}\n      </DeferredQueryContext>\n    </SetDeferredQueryContext>\n  );\n}\n","import relay from \"react-relay\";\nimport type {\n  Environment,\n  GraphQLTaggedNode,\n  OperationType,\n  VariablesOf,\n} from \"relay-runtime\";\n\nconst { fetchQuery, loadQuery } = relay;\n\nexport function getClientLoaderQuery(environment: Environment) {\n  return async <TQuery extends OperationType>(\n    query: GraphQLTaggedNode,\n    variables: VariablesOf<TQuery>,\n  ) => clientLoaderQuery(environment, query, variables);\n}\n\nexport async function clientLoaderQuery<TQuery extends OperationType>(\n  environment: Environment,\n  query: GraphQLTaggedNode,\n  variables: VariablesOf<TQuery>,\n) {\n  const data = await fetchQuery<TQuery>(environment, query, variables, {\n    fetchPolicy: \"store-or-network\",\n  }).toPromise();\n\n  const queryRef = loadQuery<TQuery>(environment, query, variables, {\n    fetchPolicy: \"store-only\",\n  });\n\n  return { queryRef, data };\n}\n","import type {\n  CacheConfig,\n  GraphQLResponse,\n  RequestParameters,\n  Variables,\n} from \"relay-runtime\";\nimport { Observable, QueryResponseCache } from \"relay-runtime\";\n\nexport const responseCache: QueryResponseCache = new QueryResponseCache({\n  size: 100,\n  ttl: 5000,\n});\n\nexport function getCachedResponse(\n  params: RequestParameters,\n  variables: Variables,\n  cacheConfig: CacheConfig,\n) {\n  const isQuery = params.operationKind === \"query\";\n  const cacheKey = params.id ?? params.cacheID;\n  const forceFetch = cacheConfig && cacheConfig.force;\n\n  if (responseCache === null || !isQuery || forceFetch) {\n    return null;\n  }\n\n  const fromCache = responseCache.get(cacheKey, variables);\n\n  const deferredFromCache: GraphQLResponse[] = [];\n\n  for (let i = 0; ; i++) {\n    const deferred = responseCache.get(`${cacheKey}-${i}`, variables);\n    if (!deferred) break;\n    deferredFromCache.push(deferred);\n  }\n\n  if (fromCache === null) {\n    return null;\n  }\n\n  return Observable.create((sink) => {\n    sink.next(fromCache);\n\n    for (const deferred of deferredFromCache) {\n      sink.next(deferred);\n    }\n\n    sink.complete();\n  });\n}\n","import type { MetaFunction } from \"react-router\";\nimport type { OperationType } from \"relay-runtime\";\n\nexport function metaQuery<TQuery extends OperationType>(\n  metaFunction: (\n    args: Parameters<MetaFunction>[0] & {\n      data: TQuery[\"response\"];\n    },\n  ) => ReturnType<MetaFunction>,\n): MetaFunction<\n  () =>\n    | { preloadedQuery: { response: { data: TQuery[\"response\"] } } }\n    | { data: TQuery[\"response\"] }\n> {\n  return ({ data, ...rest }) => {\n    const metaData: TQuery[\"response\"] =\n      data && \"data\" in data\n        ? data.data\n        : data && \"preloadedQuery\" in data\n          ? (data.preloadedQuery.response as { data: TQuery[\"response\"] }).data\n          : null;\n\n    return metaFunction({\n      data: metaData,\n      ...rest,\n    });\n  };\n}\n","import { use, useEffect, useMemo, useState } from \"react\";\nimport { flushSync } from \"react-dom\";\nimport type {\n  GraphQLTaggedNode,\n  PreloadFetchPolicy,\n  PreloadedQuery,\n} from \"react-relay\";\nimport relay from \"react-relay\";\nimport type { useQueryLoaderHookType } from \"react-relay/relay-hooks/useQueryLoader\";\nimport { useLoaderData, useRouteLoaderData } from \"react-router\";\nimport type {\n  ConcreteRequest,\n  GraphQLResponse,\n  OperationType,\n  RequestParameters,\n  VariablesOf,\n} from \"relay-runtime\";\nimport invariant from \"tiny-invariant\";\nimport { SetDeferredQueryContext } from \"./deferred-query-context\";\nimport { responseCache } from \"./get-cached-response\";\n\nconst { usePreloadedQuery, useQueryLoader, useRelayEnvironment } = relay;\n\nexport type SerializablePreloadedQuery<TQuery extends OperationType> = {\n  params: ConcreteRequest[\"params\"];\n  variables: VariablesOf<TQuery>;\n  response: GraphQLResponse;\n};\n\ntype LoaderData<TQuery extends OperationType> =\n  | {\n      preloadedQuery: SerializablePreloadedQuery<TQuery>;\n      deferredQueries: Promise<SerializablePreloadedQuery<TQuery>[]>;\n    }\n  | { queryRef: PreloadedQuery<TQuery> };\n\nfunction useCommonLoaderQuery<TQuery extends OperationType>(\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy,\n  loaderData: LoaderData<TQuery>,\n): [\n  TQuery[\"response\"],\n  useQueryLoaderHookType<TQuery>[1],\n  useQueryLoaderHookType<TQuery>[2],\n] {\n  const preloadedQuery =\n    \"preloadedQuery\" in loaderData\n      ? (loaderData.preloadedQuery as unknown as SerializablePreloadedQuery<TQuery>)\n      : null;\n\n  const deferredQueries =\n    \"deferredQueries\" in loaderData\n      ? (loaderData.deferredQueries as unknown as Promise<\n          SerializablePreloadedQuery<TQuery>[]\n        >)\n      : null;\n\n  const [deferredResult, setDeferredResult] = useState(preloadedQuery);\n\n  const setDeferredQueries = use(SetDeferredQueryContext);\n\n  useEffect(() => {\n    if (deferredQueries) {\n      setDeferredQueries(\n        deferredQueries.then(async (deferredResults) => {\n          deferredResults.forEach((result) => {\n            flushSync(() => {\n              setDeferredResult(\n                result as unknown as SerializablePreloadedQuery<TQuery>,\n              );\n            });\n          });\n\n          return deferredResults;\n        }),\n      );\n    }\n  }, [deferredQueries, preloadedQuery, setDeferredQueries, setDeferredResult]);\n\n  const environment = useRelayEnvironment();\n\n  useMemo(() => {\n    if (deferredResult) {\n      writePreloadedQueryToCache(deferredResult);\n    }\n  }, [deferredResult]);\n\n  let ref: PreloadedQuery<TQuery> | null =\n    \"queryRef\" in loaderData\n      ? (loaderData.queryRef as unknown as PreloadedQuery<TQuery>)\n      : deferredResult\n        ? {\n            environment,\n            fetchKey: `${\n              deferredResult.params.id ?? deferredResult.params.cacheID\n            }${simpleHash(deferredResult.response)}`,\n            fetchPolicy,\n            isDisposed: false,\n            name: deferredResult.params.name,\n            kind: \"PreloadedQuery\",\n            variables: deferredResult.variables,\n            dispose: () => {},\n          }\n        : null;\n\n  invariant(ref, \"Missing queryRef\");\n\n  const [queryRef, loadQuery, disposeQuery] = useQueryLoader<TQuery>(query);\n\n  if (queryRef) ref = queryRef;\n\n  const reloadQuery: typeof loadQuery = (\n    variables,\n    options = { fetchPolicy: \"store-and-network\" },\n  ) => loadQuery(variables, options);\n\n  const data = usePreloadedQuery<TQuery>(query, ref);\n\n  return [data, reloadQuery, disposeQuery];\n}\n\nexport function useLoaderQuery<TQuery extends OperationType>(\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy = \"network-only\",\n) {\n  const loaderData: LoaderData<TQuery> = useLoaderData();\n  return useCommonLoaderQuery(query, fetchPolicy, loaderData);\n}\n\nexport function useRouteLoaderQuery<TQuery extends OperationType>(\n  routeId: string,\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy = \"network-only\",\n) {\n  const loaderData: LoaderData<TQuery> | undefined =\n    useRouteLoaderData(routeId);\n\n  invariant(loaderData, `Missing loader data for routeId ${routeId}`);\n  return useCommonLoaderQuery(query, fetchPolicy, loaderData);\n}\n\nfunction writePreloadedQueryToCache<TQuery extends OperationType>(\n  preloadedQueryObject: SerializablePreloadedQuery<TQuery>,\n) {\n  const params = preloadedQueryObject.params as RequestParameters & {\n    cacheID?: string;\n  };\n\n  const cacheKey = params.cacheID ?? params.id;\n  invariant(cacheKey, \"Missing cacheKey\");\n\n  responseCache?.set(\n    cacheKey,\n    preloadedQueryObject.variables,\n    preloadedQueryObject.response,\n  );\n}\n\nfunction simpleHash(input: unknown): number {\n  return JSON.stringify(input)\n    .split(\"\")\n    .reduce((a, b) => {\n      a = (a << 5) - a + b.charCodeAt(0);\n      return a & a;\n    }, 0);\n}\n"],"mappings":"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","names":["jsx","use","useState","relay","relay","useState","use","loadQuery"]}
+{"version":3,"sources":["../src/Deferred.tsx","../src/deferred-query-context.tsx","../src/client-loader-query.ts","../src/get-cached-response.ts","../src/meta-query.ts","../src/useLoaderQuery.ts"],"sourcesContent":["import { Suspense, SuspenseProps, useSyncExternalStore } from \"react\";\nimport { Await } from \"react-router\";\nimport { useDeferredQuery } from \"./deferred-query-context\";\n\nfunction useIsMounted() {\n  return useSyncExternalStore(\n    () => () => {},\n    () => true,\n    () => false,\n  );\n}\n\nexport function Deferred({ children, ...rest }: SuspenseProps) {\n  const mounted = useIsMounted();\n  const deferredQuery = useDeferredQuery();\n\n  // SSR or context not yet initialized - show fallback\n  if (!mounted || deferredQuery === undefined) {\n    return <>{rest.fallback}</>;\n  }\n\n  // No deferred data in this query - render children directly\n  if (deferredQuery === null) {\n    return <>{children}</>;\n  }\n\n  // Has deferred data - use Await\n  return (\n    <Suspense {...rest}>\n      <Await resolve={deferredQuery}>{children}</Await>\n    </Suspense>\n  );\n}\n","import type { PropsWithChildren } from \"react\";\nimport { createContext, use, useMemo, useSyncExternalStore } from \"react\";\n\ntype DeferredQueryValue = Promise<unknown> | null | undefined;\n\ntype DeferredQueryStore = {\n  get: () => DeferredQueryValue;\n  set: (value: DeferredQueryValue) => void;\n  subscribe: (listener: () => void) => () => void;\n};\n\nfunction createDeferredQueryStore(): DeferredQueryStore {\n  let value: DeferredQueryValue = undefined;\n  const listeners = new Set<() => void>();\n\n  return {\n    get: () => value,\n    set: (newValue) => {\n      value = newValue;\n      listeners.forEach((l) => l());\n    },\n    subscribe: (listener) => {\n      listeners.add(listener);\n      return () => listeners.delete(listener);\n    },\n  };\n}\n\nexport const DeferredQueryStoreContext = createContext<DeferredQueryStore>(\n  createDeferredQueryStore(),\n);\n\nexport function useDeferredQuery(): DeferredQueryValue {\n  const store = use(DeferredQueryStoreContext);\n  return useSyncExternalStore(store.subscribe, store.get, () => undefined);\n}\n\nexport function RemixRelayProvider({ children }: PropsWithChildren) {\n  const store = useMemo(() => createDeferredQueryStore(), []);\n\n  return (\n    <DeferredQueryStoreContext value={store}>\n      {children}\n    </DeferredQueryStoreContext>\n  );\n}\n","import relay from \"react-relay\";\nimport type {\n  Environment,\n  GraphQLTaggedNode,\n  OperationType,\n  VariablesOf,\n} from \"relay-runtime\";\n\nconst { fetchQuery, loadQuery } = relay;\n\nexport function getClientLoaderQuery(environment: Environment) {\n  return async <TQuery extends OperationType>(\n    query: GraphQLTaggedNode,\n    variables: VariablesOf<TQuery>,\n  ) => clientLoaderQuery(environment, query, variables);\n}\n\nexport async function clientLoaderQuery<TQuery extends OperationType>(\n  environment: Environment,\n  query: GraphQLTaggedNode,\n  variables: VariablesOf<TQuery>,\n) {\n  const data = await fetchQuery<TQuery>(environment, query, variables, {\n    fetchPolicy: \"store-or-network\",\n  }).toPromise();\n\n  const queryRef = loadQuery<TQuery>(environment, query, variables, {\n    fetchPolicy: \"store-only\",\n  });\n\n  return { queryRef, data };\n}\n","import type {\n  CacheConfig,\n  GraphQLResponse,\n  RequestParameters,\n  Variables,\n} from \"relay-runtime\";\nimport { Observable, QueryResponseCache } from \"relay-runtime\";\n\nexport const responseCache: QueryResponseCache = new QueryResponseCache({\n  size: 100,\n  ttl: 5000,\n});\n\nexport function getCachedResponse(\n  params: RequestParameters,\n  variables: Variables,\n  cacheConfig: CacheConfig,\n) {\n  const isQuery = params.operationKind === \"query\";\n  const cacheKey = params.id ?? params.cacheID;\n  const forceFetch = cacheConfig && cacheConfig.force;\n\n  if (responseCache === null || !isQuery || forceFetch) {\n    return null;\n  }\n\n  const fromCache = responseCache.get(cacheKey, variables);\n\n  const deferredFromCache: GraphQLResponse[] = [];\n\n  for (let i = 0; ; i++) {\n    const deferred = responseCache.get(`${cacheKey}-${i}`, variables);\n    if (!deferred) break;\n    deferredFromCache.push(deferred);\n  }\n\n  if (fromCache === null) {\n    return null;\n  }\n\n  return Observable.create((sink) => {\n    sink.next(fromCache);\n\n    for (const deferred of deferredFromCache) {\n      sink.next(deferred);\n    }\n\n    sink.complete();\n  });\n}\n","import type { MetaFunction } from \"react-router\";\nimport type { OperationType } from \"relay-runtime\";\n\nexport function metaQuery<TQuery extends OperationType>(\n  metaFunction: (\n    args: Parameters<MetaFunction>[0] & {\n      data: TQuery[\"response\"];\n    },\n  ) => ReturnType<MetaFunction>,\n): MetaFunction<\n  () =>\n    | { preloadedQuery: { response: { data: TQuery[\"response\"] } } }\n    | { data: TQuery[\"response\"] }\n> {\n  return ({ data, ...rest }) => {\n    const metaData: TQuery[\"response\"] =\n      data && \"data\" in data\n        ? data.data\n        : data && \"preloadedQuery\" in data\n          ? (data.preloadedQuery.response as { data: TQuery[\"response\"] }).data\n          : null;\n\n    return metaFunction({\n      data: metaData,\n      ...rest,\n    });\n  };\n}\n","import { use, useMemo, useRef, useState } from \"react\";\nimport { flushSync } from \"react-dom\";\nimport type {\n  GraphQLTaggedNode,\n  PreloadFetchPolicy,\n  PreloadedQuery,\n} from \"react-relay\";\nimport relay from \"react-relay\";\nimport type { useQueryLoaderHookType } from \"react-relay/relay-hooks/useQueryLoader\";\nimport { useLoaderData, useRouteLoaderData } from \"react-router\";\nimport type {\n  ConcreteRequest,\n  GraphQLResponse,\n  OperationType,\n  RequestParameters,\n  VariablesOf,\n} from \"relay-runtime\";\nimport invariant from \"tiny-invariant\";\nimport { DeferredQueryStoreContext } from \"./deferred-query-context\";\nimport { responseCache } from \"./get-cached-response\";\n\nconst { usePreloadedQuery, useQueryLoader, useRelayEnvironment } = relay;\n\nexport type SerializablePreloadedQuery<TQuery extends OperationType> = {\n  params: ConcreteRequest[\"params\"];\n  variables: VariablesOf<TQuery>;\n  response: GraphQLResponse;\n};\n\ntype LoaderData<TQuery extends OperationType> =\n  | {\n      preloadedQuery: SerializablePreloadedQuery<TQuery>;\n      deferredQueries: Promise<SerializablePreloadedQuery<TQuery>[]>;\n    }\n  | { queryRef: PreloadedQuery<TQuery> };\n\nfunction useCommonLoaderQuery<TQuery extends OperationType>(\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy,\n  loaderData: LoaderData<TQuery>,\n): [\n  TQuery[\"response\"],\n  useQueryLoaderHookType<TQuery>[1],\n  useQueryLoaderHookType<TQuery>[2],\n] {\n  const preloadedQuery =\n    \"preloadedQuery\" in loaderData\n      ? (loaderData.preloadedQuery as unknown as SerializablePreloadedQuery<TQuery>)\n      : null;\n\n  const deferredQueries =\n    \"deferredQueries\" in loaderData\n      ? (loaderData.deferredQueries as unknown as Promise<\n          SerializablePreloadedQuery<TQuery>[]\n        >)\n      : null;\n\n  const [deferredResult, setDeferredResult] = useState(preloadedQuery);\n\n  const store = use(DeferredQueryStoreContext);\n\n  // Track transformed promise to avoid recreating on every render\n  const transformedPromiseRef = useRef<Promise<unknown> | null>(null);\n  const prevDeferredQueriesRef = useRef<typeof deferredQueries | symbol>(\n    Symbol(),\n  );\n\n  // Set store synchronously during render (before Deferred reads it)\n  if (deferredQueries !== prevDeferredQueriesRef.current) {\n    prevDeferredQueriesRef.current = deferredQueries;\n    if (deferredQueries) {\n      transformedPromiseRef.current = deferredQueries.then(\n        async (deferredResults) => {\n          deferredResults.forEach((result) => {\n            flushSync(() => {\n              setDeferredResult(\n                result as unknown as SerializablePreloadedQuery<TQuery>,\n              );\n            });\n          });\n          return deferredResults;\n        },\n      );\n      store.set(transformedPromiseRef.current);\n    } else {\n      transformedPromiseRef.current = null;\n      store.set(null);\n    }\n  }\n\n  const environment = useRelayEnvironment();\n\n  useMemo(() => {\n    if (deferredResult) {\n      writePreloadedQueryToCache(deferredResult);\n    }\n  }, [deferredResult]);\n\n  let ref: PreloadedQuery<TQuery> | null =\n    \"queryRef\" in loaderData\n      ? (loaderData.queryRef as unknown as PreloadedQuery<TQuery>)\n      : deferredResult\n        ? {\n            environment,\n            fetchKey: `${\n              deferredResult.params.id ?? deferredResult.params.cacheID\n            }${simpleHash(deferredResult.response)}`,\n            fetchPolicy,\n            isDisposed: false,\n            name: deferredResult.params.name,\n            kind: \"PreloadedQuery\",\n            variables: deferredResult.variables,\n            dispose: () => {},\n          }\n        : null;\n\n  invariant(ref, \"Missing queryRef\");\n\n  const [queryRef, loadQuery, disposeQuery] = useQueryLoader<TQuery>(query);\n\n  if (queryRef) ref = queryRef;\n\n  const reloadQuery: typeof loadQuery = (\n    variables,\n    options = { fetchPolicy: \"store-and-network\" },\n  ) => loadQuery(variables, options);\n\n  const data = usePreloadedQuery<TQuery>(query, ref);\n\n  return [data, reloadQuery, disposeQuery];\n}\n\nexport function useLoaderQuery<TQuery extends OperationType>(\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy = \"network-only\",\n) {\n  const loaderData: LoaderData<TQuery> = useLoaderData();\n  return useCommonLoaderQuery(query, fetchPolicy, loaderData);\n}\n\nexport function useRouteLoaderQuery<TQuery extends OperationType>(\n  routeId: string,\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy = \"network-only\",\n) {\n  const loaderData: LoaderData<TQuery> | undefined =\n    useRouteLoaderData(routeId);\n\n  invariant(loaderData, `Missing loader data for routeId ${routeId}`);\n  return useCommonLoaderQuery(query, fetchPolicy, loaderData);\n}\n\nfunction writePreloadedQueryToCache<TQuery extends OperationType>(\n  preloadedQueryObject: SerializablePreloadedQuery<TQuery>,\n) {\n  const params = preloadedQueryObject.params as RequestParameters & {\n    cacheID?: string;\n  };\n\n  const cacheKey = params.cacheID ?? params.id;\n  invariant(cacheKey, \"Missing cacheKey\");\n\n  responseCache?.set(\n    cacheKey,\n    preloadedQueryObject.variables,\n    preloadedQueryObject.response,\n  );\n}\n\nfunction simpleHash(input: unknown): number {\n  return JSON.stringify(input)\n    .split(\"\")\n    .reduce((a, b) => {\n      a = (a << 5) - a + b.charCodeAt(0);\n      return a & a;\n    }, 0);\n}\n"],"mappings":"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","names":["useSyncExternalStore","jsx","useSyncExternalStore","use","useMemo","relay","relay","use","useMemo","loadQuery"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remix-relay/react",
-  "version": "2.4.3",
+  "version": "2.4.5",
   "description": "Provides Relay integration with React Router (Framework)",
   "keywords": [
     "Remix",