@remix-relay/react/dist/index.mjs

Provides Relay integration with React Router (Framework)

// src/Deferred.tsx
import { Suspense, use, useEffect, useState as useState2 } from "react";
import { Await } from "react-router";

// 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, { value: setDeferredQueries, children: /* @__PURE__ */ jsx(DeferredQueryContext, { value: deferredQueries, children }) });
}

// src/Deferred.tsx
import { Fragment, jsx as jsx2 } from "react/jsx-runtime";
function Deferred({ children, ...rest }) {
  const [mounted, setMounted] = useState2(false);
  useEffect(() => {
    if (!mounted && typeof window !== "undefined") {
      setMounted(true);
    }
  }, [mounted]);
  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 });
}

// 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 { use as use2, useEffect as useEffect2, useMemo, useState as useState3 } from "react";
import { flushSync } from "react-dom";
import relay2 from "react-relay";
import { useLoaderData, useRouteLoaderData } from "react-router";
import invariant from "tiny-invariant";
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] = useState3(preloadedQuery);
  const setDeferredQueries = use2(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}${simpleHash(deferredResult.response)}`,
    fetchPolicy,
    isDisposed: false,
    name: deferredResult.params.name,
    kind: "PreloadedQuery",
    variables: deferredResult.variables,
    dispose: () => {
    }
  } : null;
  invariant(ref, "Missing queryRef");
  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 useLoaderQuery(query, fetchPolicy = "network-only") {
  const loaderData = useLoaderData();
  return useCommonLoaderQuery(query, fetchPolicy, loaderData);
}
function useRouteLoaderQuery(routeId, query, fetchPolicy = "network-only") {
  const loaderData = useRouteLoaderData(routeId);
  invariant(loaderData, `Missing loader data for routeId ${routeId}`);
  return useCommonLoaderQuery(query, fetchPolicy, loaderData);
}
function writePreloadedQueryToCache(preloadedQueryObject) {
  const params = preloadedQueryObject.params;
  const cacheKey = params.cacheID ?? params.id;
  invariant(cacheKey, "Missing cacheKey");
  responseCache?.set(
    cacheKey,
    preloadedQueryObject.variables,
    preloadedQueryObject.response
  );
}
function simpleHash(input) {
  return JSON.stringify(input).split("").reduce((a, b) => {
    a = (a << 5) - a + b.charCodeAt(0);
    return a & a;
  }, 0);
}
export {
  Deferred,
  RemixRelayProvider,
  clientLoaderQuery,
  getCachedResponse,
  getClientLoaderQuery,
  metaQuery,
  useLoaderQuery,
  useRouteLoaderQuery
};
//# sourceMappingURL=index.mjs.map