next-urql - npm Package Compare versions

Comparing version 3.1.1 to 3.2.0

CHANGELOG.md

 # Changelog
 
+## 3.2.0
+
+### Minor Changes
+
+- Add new `staleWhileRevalidate` option from the `ssrExchange` addition to `withUrqlClient`'s options. This is useful when Next.js is used in static site generation (SSG) mode, by [@kitten](https://github.com/kitten) (See [#1852](https://github.com/FormidableLabs/urql/pull/1852))
+
+### Patch Changes
+
+- Use the built-in `next` types for next-urql HOC return values, by [@JoviDeCroock](https://github.com/JoviDeCroock) (See [#1812](https://github.com/FormidableLabs/urql/pull/1812))
+
 ## 3.1.1
@@ -4,0 +14,0 @@

dist/next-urql.es.js

@@ -5,3 +5,3 @@ import { useReducer as e, useMemo as t, useCallback as n, createElement as r } from "react";
 
-import { createClient as a, ssrExchange as o, dedupExchange as l, cacheExchange as u, fetchExchange as s, Provider as p } from "urql";
+import { createClient as a, ssrExchange as o, dedupExchange as l, cacheExchange as s, fetchExchange as u, Provider as p } from "urql";
 
@@ -49,3 +49,3 @@ function _extends() {
     var WithUrql = function(i) {
-      var f = i.pageProps;
+      var h = i.pageProps;
       var m = i.urqlClient;
@@ -62,10 +62,10 @@ var q = i.urqlState;
       }(i, [ "pageProps", "urqlClient", "urqlState" ]);
-      var h = e((function(e) {
+      var P = e((function(e) {
         return e + 1;
       }), 0);
-      var P = h[0];
-      var g = h[1];
-      var x = f && f.urqlState || q;
-      var _ = t((function() {
-        if (m && !P) {
+      var g = P[0];
+      var x = P[1];
+      var _ = h && h.urqlState || q;
+      var w = t((function() {
+        if (m && !g) {
           return m;
@@ -75,15 +75,16 @@ }
           v = o({
-            initialState: x,
-            isClient: !0
+            initialState: _,
+            isClient: !0,
+            staleWhileRevalidate: f.staleWhileRevalidate
           });
-        } else if (!P) {
-          v.restoreData(x);
+        } else if (!g) {
+          v.restoreData(_);
         }
         var e = a(v);
         if (!e.exchanges) {
-          e.exchanges = [ l, u, v, s ];
+          e.exchanges = [ l, s, v, u ];
         }
         return initUrqlClient(e, d);
-      }), [ m, x, P ]);
-      var w = n((function() {
+      }), [ m, _, g ]);
+      var y = n((function() {
         resetClient();
@@ -93,10 +94,10 @@ v = o({
         });
-        g();
+        x();
       }), []);
       return r(p, {
-        value: _
+        value: w
       }, r(c, _extends({}, C, {
-        pageProps: f,
-        urqlClient: _,
-        resetUrqlClient: w
+        pageProps: h,
+        urqlClient: w,
+        resetUrqlClient: y
       })));
@@ -110,14 +111,14 @@ };
             function _temp2() {
-              return _extends({}, q, {
+              return _extends({}, m, {
                 urqlState: v ? v.extractData() : void 0,
-                urqlClient: m
+                urqlClient: h
               });
             }
             if ("undefined" != typeof window) {
-              return _extends({}, q, {
-                urqlClient: m
+              return _extends({}, m, {
+                urqlClient: h
               });
             }
-            var e = _extends({}, q, {
-              urqlClient: m
+            var e = _extends({}, m, {
+              urqlClient: h
             });
@@ -142,17 +143,17 @@ var a = n ? e : {
           if (!d.exchanges) {
-            d.exchanges = [ l, u, v, s ];
+            d.exchanges = [ l, s, v, u ];
           }
-          var m = initUrqlClient(d, !f.neverSuspend);
-          if (m) {
-            p.urqlClient = m;
+          var h = initUrqlClient(d, !f.neverSuspend);
+          if (h) {
+            p.urqlClient = h;
           }
-          var q = {};
-          const C = function() {
+          var m = {};
+          const q = function() {
             if (c.getInitialProps) {
               return Promise.resolve(c.getInitialProps(e)).then((function(e) {
-                q = e;
+                m = e;
               }));
             }
           }();
-          return Promise.resolve(C && C.then ? C.then(_temp4) : _temp4());
+          return Promise.resolve(q && q.then ? q.then(_temp4) : _temp4());
         } catch (e) {
@@ -159,0 +160,0 @@ return Promise.reject(e);

dist/next-urql.js

@@ -56,6 +56,6 @@ var e = require("react");
     var WithUrql = function(r) {
-      var i = r.pageProps;
-      var o = r.urqlClient;
-      var s = r.urqlState;
-      var c = function objectWithoutProperties(e, t) {
+      var o = r.pageProps;
+      var s = r.urqlClient;
+      var c = r.urqlState;
+      var f = function objectWithoutProperties(e, t) {
         var n = {};
@@ -69,19 +69,20 @@ for (var r in e) {
       }(r, [ "pageProps", "urqlClient", "urqlState" ]);
-      var f = e.useReducer((function(e) {
+      var p = e.useReducer((function(e) {
         return e + 1;
       }), 0);
-      var p = f[0];
-      var v = f[1];
-      var d = i && i.urqlState || s;
-      var h = e.useMemo((function() {
-        if (o && !p) {
-          return o;
+      var v = p[0];
+      var d = p[1];
+      var h = o && o.urqlState || c;
+      var g = e.useMemo((function() {
+        if (s && !v) {
+          return s;
         }
         if (!a || "undefined" == typeof window) {
           a = n.ssrExchange({
-            initialState: d,
-            isClient: !0
+            initialState: h,
+            isClient: !0,
+            staleWhileRevalidate: i.staleWhileRevalidate
           });
-        } else if (!p) {
-          a.restoreData(d);
+        } else if (!v) {
+          a.restoreData(h);
         }
@@ -93,4 +94,4 @@ var e = t(a);
         return initUrqlClient(e, u);
-      }), [ o, d, p ]);
-      var g = e.useCallback((function() {
+      }), [ s, h, v ]);
+      var x = e.useCallback((function() {
         resetClient();
@@ -100,10 +101,10 @@ a = n.ssrExchange({
         });
-        v();
+        d();
       }), []);
       return e.createElement(n.Provider, {
-        value: h
-      }, e.createElement(l, _extends({}, c, {
-        pageProps: i,
-        urqlClient: h,
-        resetUrqlClient: g
+        value: g
+      }, e.createElement(l, _extends({}, f, {
+        pageProps: o,
+        urqlClient: g,
+        resetUrqlClient: x
       })));
@@ -110,0 +111,0 @@ };

dist/next-urql.min.es.js

@@ -1,2 +0,2 @@
-import{useReducer as e,useMemo as n,useCallback as t,createElement as r}from"react";import i from"react-ssr-prepass";import{createClient as o,ssrExchange as u,dedupExchange as a,cacheExchange as l,fetchExchange as s,Provider as p}from"urql";function c(){return(c=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}var f,v=null;function d(){v=null}function h(e,n){var t="undefined"==typeof window;return!t&&v||((v=o(c({},e,{suspense:n&&(t||e.suspense)}))).toJSON=function(){return null}),v}function g(o,v){return v||(v={}),function(g){var m=Boolean((g.getInitialProps||v.ssr)&&!v.neverSuspend),P=function(i){var v=i.pageProps,P=i.urqlClient,q=i.urqlState,C=function(e,n){var t={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&-1===n.indexOf(r)&&(t[r]=e[r]);return t}(i,["pageProps","urqlClient","urqlState"]),y=e((function(e){return e+1}),0),S=y[0],w=y[1],x=v&&v.urqlState||q,O=n((function(){if(P&&!S)return P;f&&"undefined"!=typeof window?S||f.restoreData(x):f=u({initialState:x,isClient:!0});var e=o(f);return e.exchanges||(e.exchanges=[a,l,f,s]),h(e,m)}),[P,x,S]),I=t((function(){d(),f=u({initialState:void 0}),w()}),[]);return r(p,{value:O},r(g,c({},C,{pageProps:v,urqlClient:O,resetUrqlClient:I})))};return P.displayName="withUrqlClient("+(g.displayName||g.name||"Component")+")",(g.getInitialProps||v.ssr)&&(P.getInitialProps=function(e){try{function n(){function e(){return c({},q,{urqlState:d?d.extractData():void 0,urqlClient:P})}if("undefined"!=typeof window)return c({},q,{urqlClient:P});var n=c({},q,{urqlClient:P}),o=p?n:{pageProps:n};const u=function(){if(!v.neverSuspend)return Promise.resolve(i(r(t,o))).then((function(){}))}();return u&&u.then?u.then(e):e()}var t=e.AppTree,p=!!e.Component,f=p?e.ctx:e,d=u({initialState:void 0}),m=o(d,f);m.exchanges||(m.exchanges=[a,l,d,s]);var P=h(m,!v.neverSuspend);P&&(f.urqlClient=P);var q={};const C=function(){if(g.getInitialProps)return Promise.resolve(g.getInitialProps(e)).then((function(e){q=e}))}();return Promise.resolve(C&&C.then?C.then(n):n())}catch(e){return Promise.reject(e)}}),P}}export{h as initUrqlClient,g as withUrqlClient};
+import{useReducer as e,useMemo as t,useCallback as n,createElement as r}from"react";import i from"react-ssr-prepass";import{createClient as o,ssrExchange as a,dedupExchange as u,cacheExchange as l,fetchExchange as s,Provider as p}from"urql";function c(){return(c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}var f,v=null;function d(){v=null}function h(e,t){var n="undefined"==typeof window;return!n&&v||((v=o(c({},e,{suspense:t&&(n||e.suspense)}))).toJSON=function(){return null}),v}function g(o,v){return v||(v={}),function(g){var m=Boolean((g.getInitialProps||v.ssr)&&!v.neverSuspend),P=function(i){var P=i.pageProps,q=i.urqlClient,C=i.urqlState,y=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&-1===t.indexOf(r)&&(n[r]=e[r]);return n}(i,["pageProps","urqlClient","urqlState"]),S=e((function(e){return e+1}),0),w=S[0],x=S[1],O=P&&P.urqlState||C,I=t((function(){if(q&&!w)return q;f&&"undefined"!=typeof window?w||f.restoreData(O):f=a({initialState:O,isClient:!0,staleWhileRevalidate:v.staleWhileRevalidate});var e=o(f);return e.exchanges||(e.exchanges=[u,l,f,s]),h(e,m)}),[q,O,w]),j=n((function(){d(),f=a({initialState:void 0}),x()}),[]);return r(p,{value:I},r(g,c({},y,{pageProps:P,urqlClient:I,resetUrqlClient:j})))};return P.displayName="withUrqlClient("+(g.displayName||g.name||"Component")+")",(g.getInitialProps||v.ssr)&&(P.getInitialProps=function(e){try{function t(){function e(){return c({},q,{urqlState:d?d.extractData():void 0,urqlClient:P})}if("undefined"!=typeof window)return c({},q,{urqlClient:P});var t=c({},q,{urqlClient:P}),o=p?t:{pageProps:t};const a=function(){if(!v.neverSuspend)return Promise.resolve(i(r(n,o))).then((function(){}))}();return a&&a.then?a.then(e):e()}var n=e.AppTree,p=!!e.Component,f=p?e.ctx:e,d=a({initialState:void 0}),m=o(d,f);m.exchanges||(m.exchanges=[u,l,d,s]);var P=h(m,!v.neverSuspend);P&&(f.urqlClient=P);var q={};const C=function(){if(g.getInitialProps)return Promise.resolve(g.getInitialProps(e)).then((function(e){q=e}))}();return Promise.resolve(C&&C.then?C.then(t):t())}catch(e){return Promise.reject(e)}}),P}}export{h as initUrqlClient,g as withUrqlClient};
 //# sourceMappingURL=next-urql.min.es.js.map

dist/next-urql.min.js

@@ -1,2 +0,2 @@
-var e=require("react"),n=require("react-ssr-prepass"),t=require("urql");function r(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var i=r(n);function a(){return(a=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}var u,o=null;function l(){o=null}function c(e,n){var r="undefined"==typeof window;return!r&&o||((o=t.createClient(a({},e,{suspense:n&&(r||e.suspense)}))).toJSON=function(){return null}),o}exports.initUrqlClient=c,exports.withUrqlClient=function(n,r){return r||(r={}),function(o){var s=Boolean((o.getInitialProps||r.ssr)&&!r.neverSuspend),p=function(r){var i=r.pageProps,p=r.urqlClient,f=r.urqlState,h=function(e,n){var t={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&-1===n.indexOf(r)&&(t[r]=e[r]);return t}(r,["pageProps","urqlClient","urqlState"]),v=e.useReducer((function(e){return e+1}),0),d=v[0],g=v[1],q=i&&i.urqlState||f,x=e.useMemo((function(){if(p&&!d)return p;u&&"undefined"!=typeof window?d||u.restoreData(q):u=t.ssrExchange({initialState:q,isClient:!0});var e=n(u);return e.exchanges||(e.exchanges=[t.dedupExchange,t.cacheExchange,u,t.fetchExchange]),c(e,s)}),[p,q,d]),C=e.useCallback((function(){l(),u=t.ssrExchange({initialState:void 0}),g()}),[]);return e.createElement(t.Provider,{value:x},e.createElement(o,a({},h,{pageProps:i,urqlClient:x,resetUrqlClient:C})))};return p.displayName="withUrqlClient("+(o.displayName||o.name||"Component")+")",(o.getInitialProps||r.ssr)&&(p.getInitialProps=function(u){try{function l(){function n(){return a({},g,{urqlState:h?h.extractData():void 0,urqlClient:d})}if("undefined"!=typeof window)return a({},g,{urqlClient:d});var t=a({},g,{urqlClient:d}),u=p?t:{pageProps:t};const o=function(){if(!r.neverSuspend)return Promise.resolve(i(e.createElement(s,u))).then((function(){}))}();return o&&o.then?o.then(n):n()}var s=u.AppTree,p=!!u.Component,f=p?u.ctx:u,h=t.ssrExchange({initialState:void 0}),v=n(h,f);v.exchanges||(v.exchanges=[t.dedupExchange,t.cacheExchange,h,t.fetchExchange]);var d=c(v,!r.neverSuspend);d&&(f.urqlClient=d);var g={};const q=function(){if(o.getInitialProps)return Promise.resolve(o.getInitialProps(u)).then((function(e){g=e}))}();return Promise.resolve(q&&q.then?q.then(l):l())}catch(e){return Promise.reject(e)}}),p}};
+var e=require("react"),n=require("react-ssr-prepass"),t=require("urql");function r(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var i=r(n);function a(){return(a=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}var u,o=null;function l(){o=null}function s(e,n){var r="undefined"==typeof window;return!r&&o||((o=t.createClient(a({},e,{suspense:n&&(r||e.suspense)}))).toJSON=function(){return null}),o}exports.initUrqlClient=s,exports.withUrqlClient=function(n,r){return r||(r={}),function(o){var c=Boolean((o.getInitialProps||r.ssr)&&!r.neverSuspend),p=function(i){var p=i.pageProps,f=i.urqlClient,h=i.urqlState,v=function(e,n){var t={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&-1===n.indexOf(r)&&(t[r]=e[r]);return t}(i,["pageProps","urqlClient","urqlState"]),d=e.useReducer((function(e){return e+1}),0),g=d[0],q=d[1],x=p&&p.urqlState||h,C=e.useMemo((function(){if(f&&!g)return f;u&&"undefined"!=typeof window?g||u.restoreData(x):u=t.ssrExchange({initialState:x,isClient:!0,staleWhileRevalidate:r.staleWhileRevalidate});var e=n(u);return e.exchanges||(e.exchanges=[t.dedupExchange,t.cacheExchange,u,t.fetchExchange]),s(e,c)}),[f,x,g]),P=e.useCallback((function(){l(),u=t.ssrExchange({initialState:void 0}),q()}),[]);return e.createElement(t.Provider,{value:C},e.createElement(o,a({},v,{pageProps:p,urqlClient:C,resetUrqlClient:P})))};return p.displayName="withUrqlClient("+(o.displayName||o.name||"Component")+")",(o.getInitialProps||r.ssr)&&(p.getInitialProps=function(u){try{function l(){function n(){return a({},g,{urqlState:h?h.extractData():void 0,urqlClient:d})}if("undefined"!=typeof window)return a({},g,{urqlClient:d});var t=a({},g,{urqlClient:d}),u=p?t:{pageProps:t};const o=function(){if(!r.neverSuspend)return Promise.resolve(i(e.createElement(c,u))).then((function(){}))}();return o&&o.then?o.then(n):n()}var c=u.AppTree,p=!!u.Component,f=p?u.ctx:u,h=t.ssrExchange({initialState:void 0}),v=n(h,f);v.exchanges||(v.exchanges=[t.dedupExchange,t.cacheExchange,h,t.fetchExchange]);var d=s(v,!r.neverSuspend);d&&(f.urqlClient=d);var g={};const q=function(){if(o.getInitialProps)return Promise.resolve(o.getInitialProps(u)).then((function(e){g=e}))}();return Promise.resolve(q&&q.then?q.then(l):l())}catch(e){return Promise.reject(e)}}),p}};
 //# sourceMappingURL=next-urql.min.js.map

dist/types/types.d.ts

 import { GraphQLError } from 'graphql';
-import { ComponentType } from 'react';
 import { ClientOptions, Exchange, Client } from 'urql';
-export interface PartialNextContext {
-    res?: any;
-    AppTree: NextComponentType<PartialNextContext>;
-    Component?: NextComponentType<PartialNextContext>;
-    ctx?: PartialNextContext;
-    pathname: any;
-    query: any;
-    [key: string]: any;
+import { NextPageContext } from 'next';
+import { AppContext } from 'next/app';
+export interface NextUrqlPageContext extends NextPageContext {
+    urqlClient: Client;
 }
-export declare type NextComponentType<C extends PartialNextContext = PartialNextContext, IP = {}, P = {}> = ComponentType<P & WithUrqlProps> & {
-    getInitialProps?(context: C): IP | Promise<IP>;
-};
-export interface NextUrqlContext extends PartialNextContext {
+export interface NextUrqlAppContext extends AppContext {
     urqlClient: Client;
-    Component: NextComponentType<PartialNextContext>;
-    ctx: NextUrqlContext;
-    router: any;
 }
-export declare type NextUrqlPageContext = NextUrqlContext;
-export declare type NextUrqlAppContext = NextUrqlContext;
-export declare type NextUrqlClientConfig = (ssrExchange: SSRExchange, ctx?: NextUrqlContext) => ClientOptions;
+export declare type NextUrqlContext = NextUrqlPageContext | NextUrqlAppContext;
+export declare type NextUrqlClientConfig = (ssrExchange: SSRExchange, ctx?: NextPageContext) => ClientOptions;
 export interface WithUrqlState {
@@ -55,2 +43,3 @@ urqlState?: SSRData;
     neverSuspend?: boolean;
+    staleWhileRevalidate?: boolean;
 }

dist/types/with-urql-client.d.ts

@@ -1,2 +0,4 @@
-import { NextUrqlClientConfig, WithUrqlClientOptions, NextComponentType } from './types';
-export declare function withUrqlClient(getClientConfig: NextUrqlClientConfig, options?: WithUrqlClientOptions): <C extends NextComponentType<import("./types").PartialNextContext, {}, {}> = NextComponentType<import("./types").PartialNextContext, {}, {}>>(AppOrPage: C) => NextComponentType;
+import { NextComponentType, NextPage } from 'next';
+import NextApp from 'next/app';
+import { NextUrqlClientConfig, NextUrqlContext, WithUrqlProps, WithUrqlClientOptions } from './types';
+export declare function withUrqlClient(getClientConfig: NextUrqlClientConfig, options?: WithUrqlClientOptions): <C extends NextPage<any, any> | typeof NextApp>(AppOrPage: C) => NextComponentType<NextUrqlContext, {}, WithUrqlProps>;

package.json

 {
   "name": "next-urql",
-  "version": "3.1.1",
+  "version": "3.2.0",
   "description": "Convenience wrappers for using urql with NextJS.",
@@ -46,2 +46,3 @@ "sideEffects": false,
     "graphql": "^15.4.0",
+    "next": "^11.0.1",
     "react": "^17.0.1",
@@ -48,0 +49,0 @@ "react-dom": "^17.0.1",

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

73886

increased by1.93%

Worsened metrics

Dev dependency count

12

increased by9.09%

Lines of code

387

decreased by-2.03%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes