@shopify/react-network - npm Package Compare versions

Comparing version 3.3.0-beta.1 to 3.3.1

CHANGELOG.md

@@ -10,7 +10,9 @@ # Changelog
 
-## [3.3.0]
+## [3.2.0]
 
-- Add `useNetworkManager` hook [#1018](https://github.com/Shopify/quilt/pull/1018)
-- Add server state management to `NetworkManager` and update `applyToContext` to support server state [#1018](https://github.com/Shopify/quilt/pull/1018)
+## Added
 
+- The NetworkManager now accepts a `cookies` property in its constructor. This value is used to create a `ServerCookieManager` that can be accessed on the NetworkManger class instance. [#1002](https://github.com/Shopify/quilt/pull/1002)
+- Added a new hook `useNetworkManager()` that returns the network manager. [#1002](https://github.com/Shopify/quilt/pull/1002)
+
 ## [3.2.0]
@@ -17,0 +19,0 @@

dist/hooks.d.ts

 import { Language } from 'accept-language-parser';
 import { CspDirective, StatusCode } from '@shopify/network';
 import { NetworkManager } from './manager';
-export declare function useNetworkManager(): NetworkManager | null;
 export declare function useNetworkEffect(perform: (network: NetworkManager) => void): void;
@@ -9,4 +8,5 @@ export declare function useCspDirective(directive: CspDirective, source: string | string[] | boolean): void;
 export declare function useHeader(header: string, value: string): void;
+export declare function useNetworkManager(): NetworkManager | null;
 export declare function useStatus(code: StatusCode): void;
 export declare function useRedirect(url: string, status?: StatusCode): void;
 export declare function useAcceptLanguage(fallback?: Language): Language[];

dist/hooks.js

@@ -8,6 +8,2 @@ "use strict";
 var context_1 = require("./context");
-function useNetworkManager() {
-    return react_1.useContext(context_1.NetworkContext);
-}
-exports.useNetworkManager = useNetworkManager;
 function useNetworkEffect(perform) {
@@ -35,2 +31,6 @@ var network = react_1.useContext(context_1.NetworkContext);
 exports.useHeader = useHeader;
+function useNetworkManager() {
+    return react_1.useContext(context_1.NetworkContext);
+}
+exports.useNetworkManager = useNetworkManager;
 function useStatus(code) {
@@ -37,0 +37,0 @@ useNetworkEffect(function (network) { return network.addStatusCode(code); });

dist/index.d.ts

 export * from '@shopify/network';
 export * from './components';
-export { NetworkManager, STATE_ID } from './manager';
+export { NetworkManager } from './manager';
 export { NetworkContext } from './context';
-export { useNetworkManager, useNetworkEffect, useStatus, useCspDirective, useHeader, useRequestHeader, useRedirect, useAcceptLanguage, } from './hooks';
+export { ServerCookieManager } from './ServerCookieManager';
+export { useNetworkEffect, useStatus, useCspDirective, useHeader, useRequestHeader, useRedirect, useAcceptLanguage, useNetworkManager, } from './hooks';

dist/index.js

@@ -8,7 +8,7 @@ "use strict";
 exports.NetworkManager = manager_1.NetworkManager;
-exports.STATE_ID = manager_1.STATE_ID;
 var context_1 = require("./context");
 exports.NetworkContext = context_1.NetworkContext;
+var ServerCookieManager_1 = require("./ServerCookieManager");
+exports.ServerCookieManager = ServerCookieManager_1.ServerCookieManager;
 var hooks_1 = require("./hooks");
-exports.useNetworkManager = hooks_1.useNetworkManager;
 exports.useNetworkEffect = hooks_1.useNetworkEffect;
@@ -21,1 +21,2 @@ exports.useStatus = hooks_1.useStatus;
 exports.useAcceptLanguage = hooks_1.useAcceptLanguage;
+exports.useNetworkManager = hooks_1.useNetworkManager;

dist/manager.d.ts

@@ -1,23 +0,21 @@
-import { Context } from 'koa';
 import { StatusCode, CspDirective } from '@shopify/network';
 import { EffectKind } from '@shopify/react-effect';
+import { ServerCookieManager, Cookie } from './ServerCookieManager';
 export { NetworkContext } from './context';
 export declare const EFFECT_ID: unique symbol;
-export declare const STATE_ID: unique symbol;
 interface Options {
     headers?: Record<string, string>;
+    cookies?: Cookie | string;
 }
 export declare class NetworkManager {
     readonly effect: EffectKind;
+    cookies: ServerCookieManager;
     private statusCodes;
     private redirectUrl?;
-    private serverState;
     private readonly csp;
     private readonly headers;
     private readonly requestHeaders;
-    constructor({ headers }?: Options);
+    constructor({ headers, cookies }?: Options);
     reset(): void;
     getHeader(header: string): string;
-    getServerState(): Context['state'];
-    setServerState(newState: Context['state']): void;
     setHeader(header: string, value: string): void;
@@ -30,5 +28,7 @@ redirectTo(url: string, status?: StatusCode): void;
         headers: Map<string, string>;
+        cookies: {
+            [x: string]: import("./ServerCookieManager").CookieValue;
+        };
         redirectUrl: string | undefined;
-        serverState: any;
     };
 }

dist/manager.js

@@ -5,9 +5,9 @@ "use strict";
 var network_1 = require("@shopify/network");
+var ServerCookieManager_1 = require("./ServerCookieManager");
 var context_1 = require("./context");
 exports.NetworkContext = context_1.NetworkContext;
 exports.EFFECT_ID = Symbol('network');
-exports.STATE_ID = Symbol('network-state');
 var NetworkManager = /** @class */ (function () {
     function NetworkManager(_a) {
-        var headers = (_a === void 0 ? {} : _a).headers;
+        var _b = _a === void 0 ? {} : _a, headers = _b.headers, cookies = _b.cookies;
         var _this = this;
@@ -27,2 +27,3 @@ this.effect = {
         this.requestHeaders = normalizeHeaders(headers);
+        this.cookies = new ServerCookieManager_1.ServerCookieManager(cookies);
     }
@@ -33,4 +34,4 @@ NetworkManager.prototype.reset = function () {
         this.headers.clear();
+        this.cookies.clear();
         this.redirectUrl = undefined;
-        this.serverState = {};
     };
@@ -40,8 +41,2 @@ NetworkManager.prototype.getHeader = function (header) {
     };
-    NetworkManager.prototype.getServerState = function () {
-        return this.serverState || {};
-    };
-    NetworkManager.prototype.setServerState = function (newState) {
-        this.serverState = newState;
-    };
     NetworkManager.prototype.setHeader = function (header, value) {
@@ -95,4 +90,4 @@ this.headers.set(header, value);
             headers: headers,
+            cookies: this.cookies.getCookies(),
             redirectUrl: this.redirectUrl,
-            serverState: this.serverState,
         };
@@ -99,0 +94,0 @@ };

dist/server.d.ts

@@ -6,2 +6,1 @@ import { Context } from 'koa';
 export declare function applyToContext<T extends Context>(ctx: T, manager: NetworkManager): T;
-export declare function getServerState<T extends Context>(ctx: T): any;

dist/server.js

@@ -11,3 +11,3 @@ "use strict";
     var e_1, _a;
-    var _b = manager.extract(), status = _b.status, redirectUrl = _b.redirectUrl, headers = _b.headers, serverState = _b.serverState;
+    var _b = manager.extract(), status = _b.status, redirectUrl = _b.redirectUrl, headers = _b.headers, cookies = _b.cookies;
     if (redirectUrl) {
@@ -32,9 +32,11 @@ ctx.redirect(redirectUrl);
     }
-    ctx.state[manager_1.STATE_ID] = serverState;
+    Object.entries(cookies).forEach(function (_a) {
+        var _b = tslib_1.__read(_a, 2), cookie = _b[0], options = _b[1];
+        var value = options.value, cookieOptions = tslib_1.__rest(options, ["value"]);
+        // missing 'none` in `sameSite`
+        // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/cookies/index.d.ts#L91
+        ctx.cookies.set(cookie, value, cookieOptions);
+    });
     return ctx;
 }
 exports.applyToContext = applyToContext;
-function getServerState(ctx) {
-    return ctx.state[manager_1.STATE_ID];
-}
-exports.getServerState = getServerState;

package.json

 {
   "name": "@shopify/react-network",
-  "version": "3.3.0-beta.1",
+  "version": "3.3.1",
   "license": "MIT",
@@ -30,4 +30,6 @@ "description": "A collection of components that allow you to set common HTTP headers from within your React application.",
     "@types/accept-language-parser": "1.5.0",
+    "@types/cookie": "^0.3.3",
     "@types/koa": "^2.0.46",
     "accept-language-parser": "1.5.0",
+    "cookie": "^0.4.0",
     "tslib": "^1.9.3"
@@ -34,0 +36,0 @@ },

README.md

@@ -122,2 +122,22 @@ # `@shopify/react-network`
 
+#### `useNetworkManager()`
+
+Returns the full network manager from context.
+
+```tsx
+import React from 'react';
+import {useNetworkManager} from '@shopify/react-network';
+import {CookieContext} from './context';
+
+export function CookieProvider({children}: Props) {
+  const manager = useNetworkManager();
+
+  return (
+    <CookieContext.Provider value={manager.cookies}>
+      {children}
+    </CookieContext.Provider>
+  );
+}
+```
+
 ### Server
@@ -124,0 +144,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

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

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

40262

increased by10.35%

Number of package files

71

increased by5.97%

Lines of code

815

increased by10.28%

Number of low quality alerts

0

decreased by-100%

Number of lines in readme file

188

increased by11.9%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Dependency count

8

increased by33.33%

Dependency changes

• + Added@types/cookie@^0.3.3

• + Addedcookie@^0.4.0

• + Added@types/cookie@0.3.3(transitive)

• + Addedcookie@0.4.2(transitive)