relay-nextjs - npm Package Compare versions

Comparing version 0.4.1 to 0.5.0

index.d.ts

 export { Wire as withRelay } from './wired/component';
-export type { WiredOptions as RelayOptions, WiredProps as RelayProps, } from './wired/component';
+export type { OrRedirect, WiredOptions as RelayOptions, WiredProps as RelayProps, } from './wired/component';
 export { getWiredSerializedState as getRelaySerializedState } from './wired/serialized_state';
 export type { WiredSerializedState as RelaySerializedState } from './wired/serialized_state';

package.json

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

wired/app.d.ts

 import type { AppProps } from 'next/app';
-import type { Environment } from 'react-relay';
+import type { Environment } from 'react-relay/hooks';
 import type { WiredProps } from './component';
@@ -4,0 +4,0 @@ import type { AnyPreloadedQuery } from './types';

wired/component.d.ts

@@ -10,2 +10,5 @@ import type { NextPageContext, Redirect } from 'next';
 };
+export declare type OrRedirect<T> = T | {
+    redirect: Redirect;
+};
 export interface WiredOptions<Props extends WiredProps, ServerSideProps = {}> {
@@ -18,11 +21,7 @@ /** Fallback rendered when the page suspends. */
     /** Props passed to the component when rendering on the client. */
-    clientSideProps?: (ctx: NextPageContext) => void | {
-        redirect: Redirect;
-    };
+    clientSideProps?: (ctx: NextPageContext) => OrRedirect<Partial<ServerSideProps>>;
     /** Called when creating a Relay environment on the server. */
     createServerEnvironment: (ctx: NextPageContext, props: ServerSideProps) => Promise<Environment>;
     /** Props passed to the component when rendering on the server. */
-    serverSideProps?: (ctx: NextPageContext) => Promise<ServerSideProps | {
-        redirect: Redirect;
-    }>;
+    serverSideProps?: (ctx: NextPageContext) => Promise<OrRedirect<ServerSideProps>>;
     ErrorComponent?: React.ComponentType<any>;
@@ -32,9 +31,3 @@ }
     (props: Props): JSX.Element;
-    getInitialProps: (ctx: NextPageContext) => Promise<{
-        __wired__server__context: {};
-    } | {
-        __wired__client__context?: undefined;
-    } | {
-        __wired__client__context: {};
-    }>;
+    getInitialProps: (ctx: NextPageContext) => Promise<{}>;
 };

wired/component.js

@@ -49,9 +49,11 @@ "use strict";
         const router = router_1.useRouter();
-        const [queryReference, loadQuery] = hooks_1.useQueryLoader(query, props.preloadedQuery);
+        const [queryReference, loadQuery, disposeQuery] = hooks_1.useQueryLoader(query, props.preloadedQuery);
         react_1.useEffect(() => {
             var _a;
-            loadQuery(((_a = opts.variablesFromContext) !== null && _a !== void 0 ? _a : defaultVariablesFromContext)(router));
-        }, [loadQuery, router]);
+            const queryVariables = ((_a = opts.variablesFromContext) !== null && _a !== void 0 ? _a : defaultVariablesFromContext)(router);
+            loadQuery(queryVariables);
+            return disposeQuery;
+        }, [loadQuery, disposeQuery, router]);
         if (props.CSN) {
-            return (jsx_runtime_1.jsx(error_boundry_1.WiredErrorBoundry, Object.assign({ ErrorComponent: opts.ErrorComponent }, { children: jsx_runtime_1.jsx(react_1.Suspense, Object.assign({ fallback: (_a = opts.fallback) !== null && _a !== void 0 ? _a : 'Loading...' }, { children: jsx_runtime_1.jsx(Component, Object.assign({}, props, { preloadedQuery: queryReference }), void 0) }), void 0) }), void 0));
+            return (jsx_runtime_1.jsx(error_boundry_1.WiredErrorBoundary, Object.assign({ ErrorComponent: opts.ErrorComponent }, { children: jsx_runtime_1.jsx(react_1.Suspense, Object.assign({ fallback: (_a = opts.fallback) !== null && _a !== void 0 ? _a : 'Loading...' }, { children: jsx_runtime_1.jsx(Component, Object.assign({}, props, { preloadedQuery: queryReference }), void 0) }), void 0) }), void 0));
         }
@@ -83,5 +85,13 @@ else {
         if ('redirect' in serverSideProps) {
+            const { redirect } = serverSideProps;
+            let statusCode = 302;
+            if ('statusCode' in redirect) {
+                statusCode = redirect.statusCode;
+            }
+            else if ('permanent' in redirect) {
+                statusCode = redirect.permanent ? 308 : 307;
+            }
             ctx
-                .res.writeHead(302, {
-                Location: serverSideProps.redirect.destination,
+                .res.writeHead(statusCode, {
+                Location: redirect.destination,
             })
@@ -107,4 +117,4 @@ .end();
         ? opts.clientSideProps(ctx)
-        : undefined;
-    if (clientSideProps != null && 'redirect' in clientSideProps) {
+        : {};
+    if ('redirect' in clientSideProps) {
         router_1.default.push(clientSideProps.redirect.destination);
@@ -121,3 +131,3 @@ return {};
     });
-    return { __wired__client__context: context };
+    return Object.assign(Object.assign({}, clientSideProps), { __wired__client__context: context });
 }
@@ -124,0 +134,0 @@ function ensureQueryFlushed(query) {

wired/context.d.ts

 /// <reference types="node" />
 import type { ParsedUrlQuery } from 'querystring';
-import type { GraphQLTaggedNode } from 'react-relay';
+import type { GraphQLTaggedNode } from 'react-relay/hooks';
 import type { AnyPreloadedQuery } from './types';
@@ -5,0 +5,0 @@ export interface WiredServerContext {

wired/error_boundry.d.ts

 import React, { Component, PropsWithChildren } from 'react';
-declare type WiredErrorBoundryProps = PropsWithChildren<{
+declare type WiredErrorBoundaryProps = PropsWithChildren<{
     ErrorComponent?: React.ComponentType<any>;
 }>;
-interface WiredErrorBoundryState {
+interface WiredErrorBoundaryState {
     hasError: boolean;
 }
-export declare class WiredErrorBoundry extends Component<WiredErrorBoundryProps, WiredErrorBoundryState> {
-    static getDerivedStateFromError(): WiredErrorBoundryState;
+export declare class WiredErrorBoundary extends Component<WiredErrorBoundaryProps, WiredErrorBoundaryState> {
+    static getDerivedStateFromError(): WiredErrorBoundaryState;
     state: {
@@ -11,0 +11,0 @@ hasError: boolean;

wired/error_boundry.js

@@ -6,7 +6,7 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.WiredErrorBoundry = void 0;
+exports.WiredErrorBoundary = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const error_1 = __importDefault(require("next/error"));
 const react_1 = require("react");
-class WiredErrorBoundry extends react_1.Component {
+class WiredErrorBoundary extends react_1.Component {
     constructor() {
@@ -29,2 +29,2 @@ super(...arguments);
 }
-exports.WiredErrorBoundry = WiredErrorBoundry;
+exports.WiredErrorBoundary = WiredErrorBoundary;

No alert changes

Improved metrics

Total package byte prevSize

29287

increased by1.24%

Lines of code

428

increased by0.71%

No dependency changes