relay-nextjs - npm Package Compare versions

Comparing version 2.0.1 to 3.0.0

component.d.ts

 import type { NextPageContext, Redirect } from 'next';
 import { NextRouter } from 'next/router';
 import { ComponentType, ReactNode } from 'react';
-import { PreloadFetchPolicy, PreloadedQuery } from 'react-relay';
+import { LoadQueryOptions, PreloadedQuery } from 'react-relay';
 import { Environment, GraphQLResponse, GraphQLTaggedNode, OperationDescriptor, OperationType } from 'relay-runtime';
@@ -25,2 +25,3 @@ import { HydrationMeta } from './json_meta';
     variablesFromContext?: (ctx: NextPageContext | NextRouter) => Props['preloadedQuery']['variables'];
+    queryOptionsFromContext?: (ctx: NextPageContext | NextRouter) => LoadQueryOptions;
     /** Called when creating a Relay environment on the client. Should be idempotent. */
@@ -34,3 +35,2 @@ createClientEnvironment: () => Environment;
     serverSideProps?: (ctx: NextPageContext) => Promise<OrRedirect<ServerSideProps>>;
-    fetchPolicy?: PreloadFetchPolicy;
     /** Runs after a query has been executed on the server. */
@@ -37,0 +37,0 @@ serverSidePostQuery?: (queryResult: GraphQLResponse | undefined, ctx: NextPageContext) => Promise<unknown> | unknown;

component.js

@@ -52,18 +52,20 @@ "use strict";
 }
+function defaultQueryOptionsFromContext(_ctx) {
+    return { fetchPolicy: 'store-and-network' };
+}
+function useStableIdentity(nextValue) {
+    const lastValue = (0, react_1.useRef)(nextValue);
+    return (0, react_1.useMemo)(() => {
+        if (!(0, lodash_isequal_1.default)(lastValue.current, nextValue)) {
+            lastValue.current = nextValue;
+        }
+        return lastValue.current;
+    }, [nextValue]);
+}
 function withRelay(Component, query, opts) {
+    const { queryOptionsFromContext = defaultQueryOptionsFromContext, variablesFromContext = defaultQueryOptionsFromContext, } = opts;
     function useLoadedQuery(initialPreloadedQuery) {
         const router = (0, router_1.useRouter)();
-        const lastQueryVariables = (0, react_1.useRef)();
-        const queryVariables = (0, react_1.useMemo)(() => {
-            var _a;
-            const nextQueryVariables = ((_a = opts.variablesFromContext) !== null && _a !== void 0 ? _a : defaultVariablesFromContext)(router);
-            // In the case that the previous query variables are not deep equal to the
-            // next set of query variables update our reference. This ensures
-            // Object.is equality is maintained across renders.
-            if (lastQueryVariables.current == null ||
-                !(0, lodash_isequal_1.default)(lastQueryVariables.current, nextQueryVariables)) {
-                lastQueryVariables.current = nextQueryVariables;
-            }
-            return lastQueryVariables.current;
-        }, [router]);
+        const queryOptions = useStableIdentity((0, react_1.useMemo)(() => queryOptionsFromContext(router), [router]));
+        const queryVariables = useStableIdentity((0, react_1.useMemo)(() => variablesFromContext(router), [router]));
         const [preloadedQuery, setPreloadedQuery] = (0, react_1.useState)(initialPreloadedQuery);
@@ -78,8 +80,6 @@ const isMountedRef = (0, react_1.useRef)(false);
             }
-            const nextPreloadedQuery = (0, react_relay_1.loadQuery)(env, query, queryVariables, {
-                fetchPolicy: 'store-or-network',
-            });
+            const nextPreloadedQuery = (0, react_relay_1.loadQuery)(env, query, queryVariables, queryOptions);
             setPreloadedQuery(nextPreloadedQuery);
             return () => nextPreloadedQuery.dispose();
-        }, [env, queryVariables]);
+        }, [env, queryVariables, queryOptions]);
         return preloadedQuery;
@@ -107,5 +107,5 @@ }
 function getServerInitialProps(ctx, query, opts) {
-    var _a, _b;
+    var _a;
     return __awaiter(this, void 0, void 0, function* () {
-        const { variablesFromContext = defaultVariablesFromContext } = opts;
+        const { variablesFromContext = defaultVariablesFromContext, queryOptionsFromContext = defaultQueryOptionsFromContext, } = opts;
         const serverSideProps = opts.serverSideProps
@@ -132,7 +132,6 @@ ? yield opts.serverSideProps(ctx)
         const variables = variablesFromContext(ctx);
-        const preloadedQuery = (0, react_relay_1.loadQuery)(env, query, variables, {
-            fetchPolicy: (_a = opts.fetchPolicy) !== null && _a !== void 0 ? _a : 'store-and-network',
-        });
+        const queryOptions = queryOptionsFromContext(ctx);
+        const preloadedQuery = (0, react_relay_1.loadQuery)(env, query, variables, queryOptions);
         const payload = yield ensureQueryFlushed(preloadedQuery);
-        yield ((_b = opts.serverSidePostQuery) === null || _b === void 0 ? void 0 : _b.call(opts, payload, ctx));
+        yield ((_a = opts.serverSidePostQuery) === null || _a === void 0 ? void 0 : _a.call(opts, payload, ctx));
         const payloadSerializationMetadata = (0, json_meta_1.collectMeta)(payload);
@@ -153,3 +152,3 @@ const request = query;
     return __awaiter(this, void 0, void 0, function* () {
-        const { variablesFromContext = defaultVariablesFromContext } = opts;
+        const { variablesFromContext = defaultVariablesFromContext, queryOptionsFromContext = defaultQueryOptionsFromContext, } = opts;
         const clientSideProps = opts.clientSideProps
@@ -164,5 +163,4 @@ ? opts.clientSideProps(ctx)
         const variables = variablesFromContext(ctx);
-        const preloadedQuery = (0, react_relay_1.loadQuery)(env, query, variables, {
-            fetchPolicy: 'store-and-network',
-        });
+        const queryOptions = queryOptionsFromContext(ctx);
+        const preloadedQuery = (0, react_relay_1.loadQuery)(env, query, variables, queryOptions);
         return Object.assign(Object.assign({}, clientSideProps), { CSN: true, preloadedQuery });
@@ -169,0 +167,0 @@ });

package.json

 {
   "name": "relay-nextjs",
-  "version": "2.0.1",
+  "version": "3.0.0",
   "description": "Use Relay in your Next.js apps!",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -37,2 +37,6 @@ <p align="center">
 
+Note: `relay-nextjs` does not support [Nextjs 13 App Router](https://nextjs.org/docs/app) at the moment.
+
+- See [GitHub issue #89](https://github.com/RevereCRE/relay-nextjs/issues/89) for more info.
+
 ## Getting Started
@@ -39,0 +43,0 @@

No alert changes

Improved metrics

Total package byte prevSize

28369

increased by0.98%

Number of lines in readme file

236

increased by1.72%

Worsened metrics

Lines of code

402

decreased by-0.5%

No dependency changes