@remix-relay/react 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Dan Train
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.d.mts

@@ -0,0 +1,41 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { SuspenseProps, PropsWithChildren } from 'react';
+import relay, { GraphQLTaggedNode as GraphQLTaggedNode$1, PreloadFetchPolicy } from 'react-relay';
+import { Environment, OperationType, GraphQLTaggedNode, VariablesOf, RequestParameters, Variables, CacheConfig, Observable } from 'relay-runtime';
+import { ServerRuntimeMetaFunction } from '@remix-run/server-runtime';
+import { useQueryLoaderHookType } from 'react-relay/relay-hooks/useQueryLoader';
+
+declare function Suspense({ children, ...rest }: SuspenseProps): react_jsx_runtime.JSX.Element;
+
+declare function getClientLoaderQuery(environment: Environment): <TQuery extends OperationType>(query: GraphQLTaggedNode, variables: VariablesOf<TQuery>) => Promise<{
+    queryRef: relay.PreloadedQuery<TQuery, {}>;
+    data: Awaited<TQuery["response"]> | undefined;
+}>;
+declare function clientLoaderQuery<TQuery extends OperationType>(environment: Environment, query: GraphQLTaggedNode, variables: VariablesOf<TQuery>): Promise<{
+    queryRef: relay.PreloadedQuery<TQuery, {}>;
+    data: Awaited<TQuery["response"]> | undefined;
+}>;
+
+declare function RemixRelayProvider({ children }: PropsWithChildren): react_jsx_runtime.JSX.Element;
+
+declare function getCachedResponse(params: RequestParameters, variables: Variables, cacheConfig: CacheConfig): Observable<unknown> | null;
+
+declare function metaQuery<TQuery extends OperationType>(metaFunction: (args: Parameters<ServerRuntimeMetaFunction>[0] & {
+    data: TQuery["response"];
+}) => ReturnType<ServerRuntimeMetaFunction>): ServerRuntimeMetaFunction<() => {
+    preloadedQuery: {
+        response: {
+            data: TQuery["response"];
+        };
+    };
+} | {
+    data: TQuery["response"];
+}>;
+
+declare function useLoaderQuery<TQuery extends OperationType>(query: GraphQLTaggedNode$1, fetchPolicy?: PreloadFetchPolicy): [
+    TQuery["response"],
+    useQueryLoaderHookType<TQuery>[1],
+    useQueryLoaderHookType<TQuery>[2]
+];
+
+export { RemixRelayProvider, Suspense, clientLoaderQuery, getCachedResponse, getClientLoaderQuery, metaQuery, useLoaderQuery };

package/dist/index.d.ts

@@ -0,0 +1,41 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { SuspenseProps, PropsWithChildren } from 'react';
+import relay, { GraphQLTaggedNode as GraphQLTaggedNode$1, PreloadFetchPolicy } from 'react-relay';
+import { Environment, OperationType, GraphQLTaggedNode, VariablesOf, RequestParameters, Variables, CacheConfig, Observable } from 'relay-runtime';
+import { ServerRuntimeMetaFunction } from '@remix-run/server-runtime';
+import { useQueryLoaderHookType } from 'react-relay/relay-hooks/useQueryLoader';
+
+declare function Suspense({ children, ...rest }: SuspenseProps): react_jsx_runtime.JSX.Element;
+
+declare function getClientLoaderQuery(environment: Environment): <TQuery extends OperationType>(query: GraphQLTaggedNode, variables: VariablesOf<TQuery>) => Promise<{
+    queryRef: relay.PreloadedQuery<TQuery, {}>;
+    data: Awaited<TQuery["response"]> | undefined;
+}>;
+declare function clientLoaderQuery<TQuery extends OperationType>(environment: Environment, query: GraphQLTaggedNode, variables: VariablesOf<TQuery>): Promise<{
+    queryRef: relay.PreloadedQuery<TQuery, {}>;
+    data: Awaited<TQuery["response"]> | undefined;
+}>;
+
+declare function RemixRelayProvider({ children }: PropsWithChildren): react_jsx_runtime.JSX.Element;
+
+declare function getCachedResponse(params: RequestParameters, variables: Variables, cacheConfig: CacheConfig): Observable<unknown> | null;
+
+declare function metaQuery<TQuery extends OperationType>(metaFunction: (args: Parameters<ServerRuntimeMetaFunction>[0] & {
+    data: TQuery["response"];
+}) => ReturnType<ServerRuntimeMetaFunction>): ServerRuntimeMetaFunction<() => {
+    preloadedQuery: {
+        response: {
+            data: TQuery["response"];
+        };
+    };
+} | {
+    data: TQuery["response"];
+}>;
+
+declare function useLoaderQuery<TQuery extends OperationType>(query: GraphQLTaggedNode$1, fetchPolicy?: PreloadFetchPolicy): [
+    TQuery["response"],
+    useQueryLoaderHookType<TQuery>[1],
+    useQueryLoaderHookType<TQuery>[2]
+];
+
+export { RemixRelayProvider, Suspense, clientLoaderQuery, getCachedResponse, getClientLoaderQuery, metaQuery, useLoaderQuery };

package/dist/index.js

@@ -0,0 +1,208 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  RemixRelayProvider: () => RemixRelayProvider,
+  Suspense: () => Suspense,
+  clientLoaderQuery: () => clientLoaderQuery,
+  getCachedResponse: () => getCachedResponse,
+  getClientLoaderQuery: () => getClientLoaderQuery,
+  metaQuery: () => metaQuery,
+  useLoaderQuery: () => useLoaderQuery
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/Suspense.tsx
+var import_react2 = require("@remix-run/react");
+var import_react3 = require("react");
+
+// 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);
+var SetDeferredQueryContext = (0, import_react.createContext)(() => {
+});
+function RemixRelayProvider({ children }) {
+  const [deferredQueries, setDeferredQueries] = (0, import_react.useState)(
+    null
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SetDeferredQueryContext.Provider, { value: setDeferredQueries, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DeferredQueryContext.Provider, { value: deferredQueries, children }) });
+}
+
+// src/Suspense.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function Suspense({ children, ...rest }) {
+  const [mounted, setMounted] = (0, import_react3.useState)(false);
+  (0, import_react3.useEffect)(() => {
+    if (!mounted && typeof window !== "undefined") {
+      setMounted(true);
+    }
+  }, [mounted]);
+  const deferredQuery = (0, import_react3.useContext)(DeferredQueryContext);
+  return mounted ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react3.Suspense, { ...rest, children: deferredQuery ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react2.Await, { resolve: deferredQuery, children }) : children }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: rest.fallback });
+}
+
+// src/client-loader-query.ts
+var import_react_relay = __toESM(require("react-relay"));
+var { fetchQuery, loadQuery } = import_react_relay.default;
+function getClientLoaderQuery(environment) {
+  return async (query, variables) => clientLoaderQuery(environment, query, variables);
+}
+async function clientLoaderQuery(environment, query, variables) {
+  const data = await fetchQuery(environment, query, variables, {
+    fetchPolicy: "store-or-network"
+  }).toPromise();
+  const queryRef = loadQuery(environment, query, variables, {
+    fetchPolicy: "store-only"
+  });
+  return { queryRef, data };
+}
+
+// src/get-cached-response.ts
+var import_relay_runtime = require("relay-runtime");
+var responseCache = new import_relay_runtime.QueryResponseCache({
+  size: 100,
+  ttl: 5e3
+});
+function getCachedResponse(params, variables, cacheConfig) {
+  const isQuery = params.operationKind === "query";
+  const cacheKey = params.id ?? params.cacheID;
+  const forceFetch = cacheConfig && cacheConfig.force;
+  if (responseCache === null || !isQuery || forceFetch) {
+    return null;
+  }
+  const fromCache = responseCache.get(cacheKey, variables);
+  const deferredFromCache = [];
+  for (let i = 0; ; i++) {
+    const deferred = responseCache.get(`${cacheKey}-${i}`, variables);
+    if (!deferred)
+      break;
+    deferredFromCache.push(deferred);
+  }
+  if (fromCache === null) {
+    return null;
+  }
+  return import_relay_runtime.Observable.create((sink) => {
+    sink.next(fromCache);
+    for (const deferred of deferredFromCache) {
+      sink.next(deferred);
+    }
+    sink.complete();
+  });
+}
+
+// src/meta-query.ts
+function metaQuery(metaFunction) {
+  return ({ data, ...rest }) => {
+    const metaData = data && "data" in data ? data.data : data && "preloadedQuery" in data ? data.preloadedQuery.response.data : null;
+    return metaFunction({
+      data: metaData,
+      ...rest
+    });
+  };
+}
+
+// src/useLoaderQuery.ts
+var import_react4 = require("@remix-run/react");
+var import_react5 = require("react");
+var import_react_dom = require("react-dom");
+var import_react_relay2 = __toESM(require("react-relay"));
+var import_tiny_invariant = __toESM(require("tiny-invariant"));
+var { usePreloadedQuery, useQueryLoader, useRelayEnvironment } = import_react_relay2.default;
+function useLoaderQuery(query, fetchPolicy = "network-only") {
+  const loaderData = (0, import_react4.useLoaderData)();
+  const preloadedQuery = "preloadedQuery" in loaderData ? loaderData.preloadedQuery : null;
+  const deferredQueries = "deferredQueries" in loaderData ? loaderData.deferredQueries : null;
+  const [deferredResult, setDeferredResult] = (0, import_react5.useState)(preloadedQuery);
+  const setDeferredQueries = (0, import_react5.useContext)(SetDeferredQueryContext);
+  (0, import_react5.useEffect)(() => {
+    if (deferredQueries) {
+      setDeferredQueries(
+        deferredQueries.then(async (deferredResults) => {
+          deferredResults.forEach((result) => {
+            (0, import_react_dom.flushSync)(() => {
+              setDeferredResult(
+                result
+              );
+            });
+          });
+          return deferredResults;
+        })
+      );
+    }
+  }, [deferredQueries, preloadedQuery, setDeferredQueries, setDeferredResult]);
+  const environment = useRelayEnvironment();
+  (0, import_react5.useMemo)(() => {
+    if (deferredResult) {
+      writePreloadedQueryToCache(deferredResult);
+    }
+  }, [deferredResult]);
+  let ref = "queryRef" in loaderData ? loaderData.queryRef : deferredResult ? {
+    environment,
+    fetchKey: `${deferredResult.params.id ?? deferredResult.params.cacheID}${JSON.stringify(deferredResult.response).split("").reduce((a, b) => {
+      a = (a << 5) - a + b.charCodeAt(0);
+      return a & a;
+    }, 0)}`,
+    fetchPolicy,
+    isDisposed: false,
+    name: deferredResult.params.name,
+    kind: "PreloadedQuery",
+    variables: deferredResult.variables,
+    dispose: () => {
+    }
+  } : null;
+  (0, import_tiny_invariant.default)(ref);
+  const [queryRef, loadQuery2, disposeQuery] = useQueryLoader(query);
+  if (queryRef)
+    ref = queryRef;
+  const reloadQuery = (variables, options = { fetchPolicy: "store-and-network" }) => loadQuery2(variables, options);
+  const data = usePreloadedQuery(query, ref);
+  return [data, reloadQuery, disposeQuery];
+}
+function writePreloadedQueryToCache(preloadedQueryObject) {
+  let cacheKey = preloadedQueryObject.params.id ?? preloadedQueryObject.params.cacheID;
+  responseCache?.set(
+    cacheKey,
+    preloadedQueryObject.variables,
+    preloadedQueryObject.response
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  RemixRelayProvider,
+  Suspense,
+  clientLoaderQuery,
+  getCachedResponse,
+  getClientLoaderQuery,
+  metaQuery,
+  useLoaderQuery
+});
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/Suspense.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 { Suspense } from \"./Suspense\";\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 } from \"./useLoaderQuery\";\n","import { Await } from \"@remix-run/react\";\nimport {\n  Suspense as ReactSuspense,\n  SuspenseProps,\n  useContext,\n  useEffect,\n  useState,\n} from \"react\";\nimport { DeferredQueryContext } from \"./deferred-query-context\";\n\nexport function Suspense({ children, ...rest }: SuspenseProps) {\n  const [mounted, setMounted] = useState(false);\n\n  useEffect(() => {\n    if (!mounted && typeof window !== \"undefined\") {\n      setMounted(true);\n    }\n  }, [mounted]);\n\n  const deferredQuery = useContext(DeferredQueryContext);\n\n  return mounted ? (\n    <ReactSuspense {...rest}>\n      {deferredQuery ? (\n        <Await resolve={deferredQuery}>{children}</Await>\n      ) : (\n        children\n      )}\n    </ReactSuspense>\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<any> | null>(null);\nexport const SetDeferredQueryContext = createContext<\n  Dispatch<SetStateAction<Promise<any> | null>>\n>(() => {});\n\nexport function RemixRelayProvider({ children }: PropsWithChildren) {\n  const [deferredQueries, setDeferredQueries] = useState<Promise<any> | null>(\n    null,\n  );\n\n  return (\n    <SetDeferredQueryContext.Provider value={setDeferredQueries}>\n      <DeferredQueryContext.Provider value={deferredQueries}>\n        {children}\n      </DeferredQueryContext.Provider>\n    </SetDeferredQueryContext.Provider>\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","/* eslint-disable no-unused-vars */\nimport type { ServerRuntimeMetaFunction } from \"@remix-run/server-runtime\";\nimport type { OperationType } from \"relay-runtime\";\n\nexport function metaQuery<TQuery extends OperationType>(\n  metaFunction: (\n    args: Parameters<ServerRuntimeMetaFunction>[0] & {\n      data: TQuery[\"response\"];\n    },\n  ) => ReturnType<ServerRuntimeMetaFunction>,\n): ServerRuntimeMetaFunction<\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 type { TypedDeferredData } from \"@remix-run/node\";\nimport { useLoaderData } from \"@remix-run/react\";\nimport { useContext, 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 type {\n  ConcreteRequest,\n  GraphQLResponse,\n  OperationType,\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\nexport function useLoaderQuery<TQuery extends OperationType>(\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy = \"network-only\",\n): [\n  TQuery[\"response\"],\n  useQueryLoaderHookType<TQuery>[1],\n  useQueryLoaderHookType<TQuery>[2],\n] {\n  const loaderData = useLoaderData<\n    () => Promise<\n      | TypedDeferredData<{\n          preloadedQuery: SerializablePreloadedQuery<TQuery>;\n          deferredQueries: Promise<SerializablePreloadedQuery<TQuery>[]>;\n        }>\n      | { queryRef: PreloadedQuery<TQuery> }\n    >\n  >();\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 = useContext(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            }${JSON.stringify(deferredResult.response)\n              .split(\"\")\n              .reduce((a, b) => {\n                a = (a << 5) - a + b.charCodeAt(0);\n                return a & a;\n              }, 0)}`,\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);\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\nfunction writePreloadedQueryToCache<TQuery extends OperationType>(\n  preloadedQueryObject: SerializablePreloadedQuery<TQuery>,\n) {\n  let cacheKey =\n    preloadedQueryObject.params.id ?? preloadedQueryObject.params.cacheID;\n\n  responseCache?.set(\n    cacheKey,\n    preloadedQueryObject.variables,\n    preloadedQueryObject.response,\n  );\n}\n"],"mappings":"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","names":["import_react","import_jsx_runtime","ReactSuspense","relay","import_react","import_react_relay","relay","invariant","loadQuery"]}

package/dist/index.mjs

@@ -0,0 +1,170 @@
+// src/Suspense.tsx
+import { Await } from "@remix-run/react";
+import {
+  Suspense as ReactSuspense,
+  useContext,
+  useEffect,
+  useState as useState2
+} from "react";
+
+// src/deferred-query-context.tsx
+import { createContext, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+var DeferredQueryContext = createContext(null);
+var SetDeferredQueryContext = createContext(() => {
+});
+function RemixRelayProvider({ children }) {
+  const [deferredQueries, setDeferredQueries] = useState(
+    null
+  );
+  return /* @__PURE__ */ jsx(SetDeferredQueryContext.Provider, { value: setDeferredQueries, children: /* @__PURE__ */ jsx(DeferredQueryContext.Provider, { value: deferredQueries, children }) });
+}
+
+// src/Suspense.tsx
+import { Fragment, jsx as jsx2 } from "react/jsx-runtime";
+function Suspense({ children, ...rest }) {
+  const [mounted, setMounted] = useState2(false);
+  useEffect(() => {
+    if (!mounted && typeof window !== "undefined") {
+      setMounted(true);
+    }
+  }, [mounted]);
+  const deferredQuery = useContext(DeferredQueryContext);
+  return mounted ? /* @__PURE__ */ jsx2(ReactSuspense, { ...rest, children: deferredQuery ? /* @__PURE__ */ jsx2(Await, { resolve: deferredQuery, children }) : children }) : /* @__PURE__ */ jsx2(Fragment, { children: rest.fallback });
+}
+
+// src/client-loader-query.ts
+import relay from "react-relay";
+var { fetchQuery, loadQuery } = relay;
+function getClientLoaderQuery(environment) {
+  return async (query, variables) => clientLoaderQuery(environment, query, variables);
+}
+async function clientLoaderQuery(environment, query, variables) {
+  const data = await fetchQuery(environment, query, variables, {
+    fetchPolicy: "store-or-network"
+  }).toPromise();
+  const queryRef = loadQuery(environment, query, variables, {
+    fetchPolicy: "store-only"
+  });
+  return { queryRef, data };
+}
+
+// src/get-cached-response.ts
+import { Observable, QueryResponseCache } from "relay-runtime";
+var responseCache = new QueryResponseCache({
+  size: 100,
+  ttl: 5e3
+});
+function getCachedResponse(params, variables, cacheConfig) {
+  const isQuery = params.operationKind === "query";
+  const cacheKey = params.id ?? params.cacheID;
+  const forceFetch = cacheConfig && cacheConfig.force;
+  if (responseCache === null || !isQuery || forceFetch) {
+    return null;
+  }
+  const fromCache = responseCache.get(cacheKey, variables);
+  const deferredFromCache = [];
+  for (let i = 0; ; i++) {
+    const deferred = responseCache.get(`${cacheKey}-${i}`, variables);
+    if (!deferred)
+      break;
+    deferredFromCache.push(deferred);
+  }
+  if (fromCache === null) {
+    return null;
+  }
+  return Observable.create((sink) => {
+    sink.next(fromCache);
+    for (const deferred of deferredFromCache) {
+      sink.next(deferred);
+    }
+    sink.complete();
+  });
+}
+
+// src/meta-query.ts
+function metaQuery(metaFunction) {
+  return ({ data, ...rest }) => {
+    const metaData = data && "data" in data ? data.data : data && "preloadedQuery" in data ? data.preloadedQuery.response.data : null;
+    return metaFunction({
+      data: metaData,
+      ...rest
+    });
+  };
+}
+
+// src/useLoaderQuery.ts
+import { useLoaderData } from "@remix-run/react";
+import { useContext as useContext2, useEffect as useEffect2, useMemo, useState as useState3 } from "react";
+import { flushSync } from "react-dom";
+import relay2 from "react-relay";
+import invariant from "tiny-invariant";
+var { usePreloadedQuery, useQueryLoader, useRelayEnvironment } = relay2;
+function useLoaderQuery(query, fetchPolicy = "network-only") {
+  const loaderData = useLoaderData();
+  const preloadedQuery = "preloadedQuery" in loaderData ? loaderData.preloadedQuery : null;
+  const deferredQueries = "deferredQueries" in loaderData ? loaderData.deferredQueries : null;
+  const [deferredResult, setDeferredResult] = useState3(preloadedQuery);
+  const setDeferredQueries = useContext2(SetDeferredQueryContext);
+  useEffect2(() => {
+    if (deferredQueries) {
+      setDeferredQueries(
+        deferredQueries.then(async (deferredResults) => {
+          deferredResults.forEach((result) => {
+            flushSync(() => {
+              setDeferredResult(
+                result
+              );
+            });
+          });
+          return deferredResults;
+        })
+      );
+    }
+  }, [deferredQueries, preloadedQuery, setDeferredQueries, setDeferredResult]);
+  const environment = useRelayEnvironment();
+  useMemo(() => {
+    if (deferredResult) {
+      writePreloadedQueryToCache(deferredResult);
+    }
+  }, [deferredResult]);
+  let ref = "queryRef" in loaderData ? loaderData.queryRef : deferredResult ? {
+    environment,
+    fetchKey: `${deferredResult.params.id ?? deferredResult.params.cacheID}${JSON.stringify(deferredResult.response).split("").reduce((a, b) => {
+      a = (a << 5) - a + b.charCodeAt(0);
+      return a & a;
+    }, 0)}`,
+    fetchPolicy,
+    isDisposed: false,
+    name: deferredResult.params.name,
+    kind: "PreloadedQuery",
+    variables: deferredResult.variables,
+    dispose: () => {
+    }
+  } : null;
+  invariant(ref);
+  const [queryRef, loadQuery2, disposeQuery] = useQueryLoader(query);
+  if (queryRef)
+    ref = queryRef;
+  const reloadQuery = (variables, options = { fetchPolicy: "store-and-network" }) => loadQuery2(variables, options);
+  const data = usePreloadedQuery(query, ref);
+  return [data, reloadQuery, disposeQuery];
+}
+function writePreloadedQueryToCache(preloadedQueryObject) {
+  let cacheKey = preloadedQueryObject.params.id ?? preloadedQueryObject.params.cacheID;
+  responseCache?.set(
+    cacheKey,
+    preloadedQueryObject.variables,
+    preloadedQueryObject.response
+  );
+}
+export {
+  RemixRelayProvider,
+  Suspense,
+  clientLoaderQuery,
+  getCachedResponse,
+  getClientLoaderQuery,
+  metaQuery,
+  useLoaderQuery
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Suspense.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 { Await } from \"@remix-run/react\";\nimport {\n  Suspense as ReactSuspense,\n  SuspenseProps,\n  useContext,\n  useEffect,\n  useState,\n} from \"react\";\nimport { DeferredQueryContext } from \"./deferred-query-context\";\n\nexport function Suspense({ children, ...rest }: SuspenseProps) {\n  const [mounted, setMounted] = useState(false);\n\n  useEffect(() => {\n    if (!mounted && typeof window !== \"undefined\") {\n      setMounted(true);\n    }\n  }, [mounted]);\n\n  const deferredQuery = useContext(DeferredQueryContext);\n\n  return mounted ? (\n    <ReactSuspense {...rest}>\n      {deferredQuery ? (\n        <Await resolve={deferredQuery}>{children}</Await>\n      ) : (\n        children\n      )}\n    </ReactSuspense>\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<any> | null>(null);\nexport const SetDeferredQueryContext = createContext<\n  Dispatch<SetStateAction<Promise<any> | null>>\n>(() => {});\n\nexport function RemixRelayProvider({ children }: PropsWithChildren) {\n  const [deferredQueries, setDeferredQueries] = useState<Promise<any> | null>(\n    null,\n  );\n\n  return (\n    <SetDeferredQueryContext.Provider value={setDeferredQueries}>\n      <DeferredQueryContext.Provider value={deferredQueries}>\n        {children}\n      </DeferredQueryContext.Provider>\n    </SetDeferredQueryContext.Provider>\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","/* eslint-disable no-unused-vars */\nimport type { ServerRuntimeMetaFunction } from \"@remix-run/server-runtime\";\nimport type { OperationType } from \"relay-runtime\";\n\nexport function metaQuery<TQuery extends OperationType>(\n  metaFunction: (\n    args: Parameters<ServerRuntimeMetaFunction>[0] & {\n      data: TQuery[\"response\"];\n    },\n  ) => ReturnType<ServerRuntimeMetaFunction>,\n): ServerRuntimeMetaFunction<\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 type { TypedDeferredData } from \"@remix-run/node\";\nimport { useLoaderData } from \"@remix-run/react\";\nimport { useContext, 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 type {\n  ConcreteRequest,\n  GraphQLResponse,\n  OperationType,\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\nexport function useLoaderQuery<TQuery extends OperationType>(\n  query: GraphQLTaggedNode,\n  fetchPolicy: PreloadFetchPolicy = \"network-only\",\n): [\n  TQuery[\"response\"],\n  useQueryLoaderHookType<TQuery>[1],\n  useQueryLoaderHookType<TQuery>[2],\n] {\n  const loaderData = useLoaderData<\n    () => Promise<\n      | TypedDeferredData<{\n          preloadedQuery: SerializablePreloadedQuery<TQuery>;\n          deferredQueries: Promise<SerializablePreloadedQuery<TQuery>[]>;\n        }>\n      | { queryRef: PreloadedQuery<TQuery> }\n    >\n  >();\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 = useContext(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            }${JSON.stringify(deferredResult.response)\n              .split(\"\")\n              .reduce((a, b) => {\n                a = (a << 5) - a + b.charCodeAt(0);\n                return a & a;\n              }, 0)}`,\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);\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\nfunction writePreloadedQueryToCache<TQuery extends OperationType>(\n  preloadedQueryObject: SerializablePreloadedQuery<TQuery>,\n) {\n  let cacheKey =\n    preloadedQueryObject.params.id ?? preloadedQueryObject.params.cacheID;\n\n  responseCache?.set(\n    cacheKey,\n    preloadedQueryObject.variables,\n    preloadedQueryObject.response,\n  );\n}\n"],"mappings":"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","names":["useState","jsx","useState","useContext","useEffect","useState","relay","relay","useState","useContext","useEffect","loadQuery"]}

package/package.json

@@ -0,0 +1,79 @@
+{
+  "name": "@remix-relay/react",
+  "description": "Provides Relay integration with Remix",
+  "version": "1.0.0",
+  "author": {
+    "name": "Dan Train",
+    "url": "https://github.com/dantrain"
+  },
+  "keywords": [
+    "Remix",
+    "Relay",
+    "React"
+  ],
+  "homepage": "https://github.com/dantrain/remix-relay#readme",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/dantrain/remix-relay.git"
+  },
+  "license": "MIT",
+  "type": "commonjs",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "module": "./dist/index.mjs",
+      "import": {
+        "types": "./dist/index.d.mts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "default": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist/**"
+  ],
+  "peerDependencies": {
+    "@remix-run/react": "^2.4.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-relay": "^16.1.0",
+    "relay-runtime": "^16.1.0"
+  },
+  "dependencies": {
+    "tiny-invariant": "^1.3.3"
+  },
+  "devDependencies": {
+    "@remix-run/node": "^2.8.1",
+    "@remix-run/react": "^2.8.1",
+    "@remix-run/server-runtime": "^2.8.1",
+    "@types/eslint": "^8.56.5",
+    "@types/node": "^20.11.25",
+    "@types/react": "^18.2.64",
+    "@types/react-dom": "^18.2.21",
+    "@types/react-relay": "^16.0.6",
+    "@types/relay-runtime": "^14.1.23",
+    "eslint": "^8.57.0",
+    "graphql": "17.0.0-alpha.2",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-relay": "^16.2.0",
+    "relay-runtime": "^16.2.0",
+    "tsup": "^8.0.2",
+    "typescript": "^5.4.2",
+    "@remix-relay/eslint-config": "0.0.0",
+    "@remix-relay/typescript-config": "0.0.0"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "lint": "eslint . --max-warnings 0",
+    "typecheck": "tsc --noEmit"
+  }
+}