@salesforce/commerce-sdk-react 3.0.0 → 3.1.0-exp-server-affinity.1

package/CHANGELOG.md

@@ -1,3 +1,12 @@
+## v3.1.0-exp-server-affinity.1 (Sep 11, 2024)
+## v3.1.0-dev (Aug 08, 2024)
+
+- Add `defaultDnt` to support setting the dnt flag for SLAS. Upgrade `commerce-sdk-isomorphic` to v3.1.1 [#1979](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/1979)
+- Update logout helper to work for guest users [#1997](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/1997)
+
+## v3.0.1 (Sep 04, 2024)
+- Fixed an issue where the `expires` attribute in cookies, ensuring it uses seconds instead of days. [#1994](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/1994)
+
 ## v3.0.0 (Aug 07, 2024)
 - Add `meta.displayName` to queries. It can be used to identify queries in performance metrics or logs. [#1895](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/1895)
 - Upgrade to commerce-sdk-isomorphic v3.0.0 [#1914](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/1914)

package/auth/index.d.ts

@@ -9,11 +9,11 @@ interface AuthConfig extends ApiClientConfigParams {
     proxy: string;
     fetchOptions?: ShopperLoginTypes.FetchOptions;
     fetchedToken?: string;
-    OCAPISessionsURL?: string;
     enablePWAKitPrivateClient?: boolean;
     clientSecret?: string;
     silenceWarnings?: boolean;
     logger: Logger;
+    defaultDnt?: boolean;
 }
 /**
  * The extended field is not from api response, we manually store the auth type,
@@ -26,7 +26,7 @@ export type AuthData = Prettify<RemoveStringIndex<TokenResponse> & {
     idp_access_token: string;
 }>;
 /** A shopper could be guest or registered, so we store the refresh tokens individually. */
-type AuthDataKeys = Exclude<keyof AuthData, 'refresh_token'> | 'refresh_token_guest' | 'refresh_token_registered' | 'access_token_sfra';
+type AuthDataKeys = Exclude<keyof AuthData, 'refresh_token'> | 'refresh_token_guest' | 'refresh_token_registered' | 'access_token_sfra' | 'dwsid';
 /**
  * This class is used to handle shopper authentication.
  * It is responsible for initializing shopper session, manage access
@@ -42,10 +42,10 @@ declare class Auth {
     private pendingToken;
     private stores;
     private fetchedToken;
-    private OCAPISessionsURL;
     private clientSecret;
     private silenceWarnings;
     private logger;
+    private defaultDnt;
     constructor(config: AuthConfig);
     get(name: AuthDataKeys): string;
     private set;
@@ -74,6 +74,16 @@ declare class Auth {
      */
     private getAccessToken;
     private clearSFRAAuthToken;
+    private clearECOMSession;
+    /**
+     * Converts a duration in seconds to a Date object.
+     * This function takes a number representing seconds and returns a Date object
+     * for the current time plus the given duration.
+     *
+     * @param {number} seconds - The number of seconds to add to the current time.
+     * @returns {Date} A Date object for the expiration time.
+     */
+    private convertSecondsToDate;
     /**
      * This method stores the TokenResponse object retrived from SLAS, and
      * store the data in storage.
@@ -219,18 +229,6 @@ declare class Auth {
      *
      */
     logout(): Promise<ShopperLoginTypes.TokenResponse>;
-    /**
-     * Make a post request to the OCAPI /session endpoint to bridge the session.
-     *
-     * The HTTP response contains a set-cookie header which sets the dwsid session cookie.
-     * This cookie is used on SFRA, and it allows shoppers to navigate between SFRA and
-     * this PWA site seamlessly; this is often used to enable hybrid deployment.
-     *
-     * (Note: this method is client side only, b/c MRT doesn't support set-cookie header right now)
-     *
-     * @returns {Promise}
-     */
-    createOCAPISession(): Promise<Response>;
     /**
      * Decode SLAS JWT and extract information such as customer id, usid, etc.
      *

package/auth/index.js

@@ -107,6 +107,10 @@ const DATA_MAP = {
   access_token_sfra: {
     storageType: 'cookie',
     key: 'cc-at'
+  },
+  dwsid: {
+    storageType: 'cookie',
+    key: 'dwsid'
   }
 };
 
@@ -157,8 +161,8 @@ class Auth {
     };
     this.redirectURI = config.redirectURI;
     this.fetchedToken = config.fetchedToken || '';
-    this.OCAPISessionsURL = config.OCAPISessionsURL || '';
     this.logger = config.logger;
+    this.defaultDnt = config.defaultDnt;
 
     /*
      * There are 2 ways to enable SLAS private client mode.
@@ -304,6 +308,29 @@ class Auth {
     const store = this.stores[storageType];
     store.delete(key);
   }
+  clearECOMSession() {
+    const {
+      key,
+      storageType
+    } = DATA_MAP['dwsid'];
+    const store = this.stores[storageType];
+    store.delete(key);
+  }
+
+  /**
+   * Converts a duration in seconds to a Date object.
+   * This function takes a number representing seconds and returns a Date object
+   * for the current time plus the given duration.
+   *
+   * @param {number} seconds - The number of seconds to add to the current time.
+   * @returns {Date} A Date object for the expiration time.
+   */
+  convertSecondsToDate(seconds) {
+    if (typeof seconds !== 'number') {
+      throw new Error('The refresh_token_expires_in seconds parameter must be a number.');
+    }
+    return new Date(Date.now() + seconds * 1000);
+  }
 
   /**
    * This method stores the TokenResponse object retrived from SLAS, and
@@ -320,8 +347,9 @@ class Auth {
     this.set('usid', res.usid);
     this.set('customer_type', isGuest ? 'guest' : 'registered');
     const refreshTokenKey = isGuest ? 'refresh_token_guest' : 'refresh_token_registered';
+    const expiresDate = res.refresh_token_expires_in ? this.convertSecondsToDate(res.refresh_token_expires_in) : undefined;
     this.set(refreshTokenKey, res.refresh_token, {
-      expires: res.refresh_token_expires_in
+      expires: expiresDate
     });
   }
 
@@ -339,9 +367,6 @@ class Auth {
       _this.pendingToken = queue.then( /*#__PURE__*/_asyncToGenerator(function* () {
         const token = yield fn();
         _this.handleTokenResponse(token, isGuest);
-        if ((0, _utils.onClient)() && _this.OCAPISessionsURL) {
-          void _this.createOCAPISession();
-        }
         // Q: Why don't we just return token? Why re-construct the same object again?
         // A: because a user could open multiple tabs and the data in memory could be out-dated
         // We must always grab the data from the storage (cookie/localstorage) directly
@@ -396,9 +421,11 @@ class Auth {
       const refreshToken = refreshTokenRegistered || refreshTokenGuest;
       if (refreshToken) {
         try {
-          return yield _this2.queueRequest(() => _commerceSdkIsomorphic.helpers.refreshAccessToken(_this2.client, {
+          return yield _this2.queueRequest(() => _commerceSdkIsomorphic.helpers.refreshAccessToken(_this2.client, _objectSpread({
             refreshToken
-          }, {
+          }, _this2.defaultDnt !== undefined && {
+            dnt: _this2.defaultDnt
+          }), {
             clientSecret: _this2.clientSecret
           }), !!refreshTokenGuest);
         } catch (error) {
@@ -444,14 +471,18 @@ class Auth {
       }
       const usid = _this4.get('usid');
       const isGuest = true;
-      const guestPrivateArgs = [_this4.client, _objectSpread({}, usid && {
+      const guestPrivateArgs = [_this4.client, _objectSpread(_objectSpread({}, _this4.defaultDnt !== undefined && {
+        dnt: _this4.defaultDnt
+      }), usid && {
         usid
       }), {
         clientSecret: _this4.clientSecret
       }];
-      const guestPublicArgs = [_this4.client, _objectSpread({
+      const guestPublicArgs = [_this4.client, _objectSpread(_objectSpread({
         redirectURI: _this4.redirectURI
-      }, usid && {
+      }, _this4.defaultDnt !== undefined && {
+        dnt: _this4.defaultDnt
+      }), usid && {
         usid
       })];
       const callback = _this4.clientSecret ? () => _commerceSdkIsomorphic.helpers.loginGuestUserPrivate(...guestPrivateArgs) : () => _commerceSdkIsomorphic.helpers.loginGuestUser(...guestPublicArgs);
@@ -508,14 +539,16 @@ class Auth {
       const isGuest = false;
       const token = yield _commerceSdkIsomorphic.helpers.loginRegisteredUserB2C(_this6.client, _objectSpread(_objectSpread({}, credentials), {}, {
         clientSecret: _this6.clientSecret
-      }), _objectSpread({
+      }), _objectSpread(_objectSpread({
         redirectURI
-      }, usid && {
+      }, _this6.defaultDnt !== undefined && {
+        dnt: _this6.defaultDnt
+      }), usid && {
         usid
       }));
       _this6.handleTokenResponse(token, isGuest);
-      if ((0, _utils.onClient)() && _this6.OCAPISessionsURL) {
-        void _this6.createOCAPISession();
+      if ((0, _utils.onClient)()) {
+        void _this6.clearECOMSession();
       }
       return token;
     })();
@@ -528,36 +561,18 @@ class Auth {
   logout() {
     var _this7 = this;
     return _asyncToGenerator(function* () {
-      // Not awaiting on purpose because there isn't much we can do if this fails.
-      void _commerceSdkIsomorphic.helpers.logout(_this7.client, {
-        accessToken: _this7.get('access_token'),
-        refreshToken: _this7.get('refresh_token_registered')
-      });
+      if (_this7.get('customer_type') === 'registered') {
+        // Not awaiting on purpose because there isn't much we can do if this fails.
+        void _commerceSdkIsomorphic.helpers.logout(_this7.client, {
+          accessToken: _this7.get('access_token'),
+          refreshToken: _this7.get('refresh_token_registered')
+        });
+      }
       _this7.clearStorage();
       return yield _this7.loginGuestUser();
     })();
   }
 
-  /**
-   * Make a post request to the OCAPI /session endpoint to bridge the session.
-   *
-   * The HTTP response contains a set-cookie header which sets the dwsid session cookie.
-   * This cookie is used on SFRA, and it allows shoppers to navigate between SFRA and
-   * this PWA site seamlessly; this is often used to enable hybrid deployment.
-   *
-   * (Note: this method is client side only, b/c MRT doesn't support set-cookie header right now)
-   *
-   * @returns {Promise}
-   */
-  createOCAPISession() {
-    return fetch(this.OCAPISessionsURL, {
-      method: 'POST',
-      headers: {
-        Authorization: 'Bearer ' + this.get('access_token')
-      }
-    });
-  }
-
   /**
    * Decode SLAS JWT and extract information such as customer id, usid, etc.
    *

package/auth/storage/cookie.js

@@ -7,6 +7,7 @@ exports.CookieStorage = void 0;
 var _jsCookie = _interopRequireDefault(require("js-cookie"));
 var _utils = require("../../utils");
 var _base = require("./base");
+var _constant = require("../../constant");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -33,11 +34,11 @@ class CookieStorage extends _base.BaseStorage {
     super(options);
   }
   set(key, value, options) {
-    const suffixedKey = this.getSuffixedKey(key);
+    const suffixedKey = _constant.EXCLUDE_COOKIE_SUFFIX.includes(key) ? key : this.getSuffixedKey(key);
     _jsCookie.default.set(suffixedKey, value, _objectSpread(_objectSpread({}, (0, _utils.getDefaultCookieAttributes)()), options));
   }
   get(key) {
-    const suffixedKey = this.getSuffixedKey(key);
+    const suffixedKey = _constant.EXCLUDE_COOKIE_SUFFIX.includes(key) ? key : this.getSuffixedKey(key);
     let value = _jsCookie.default.get(suffixedKey) || '';
     if (value) {
       // Some values, like the access token, may be split
@@ -54,7 +55,7 @@ class CookieStorage extends _base.BaseStorage {
     return value;
   }
   delete(key, options) {
-    const suffixedKey = this.getSuffixedKey(key);
+    const suffixedKey = _constant.EXCLUDE_COOKIE_SUFFIX.includes(key) ? key : this.getSuffixedKey(key);
     _jsCookie.default.remove(suffixedKey, _objectSpread(_objectSpread({}, (0, _utils.getDefaultCookieAttributes)()), options));
 
     // Some values, like the access token, may be split

package/constant.d.ts

@@ -9,4 +9,6 @@ export declare const SLAS_PRIVATE_PROXY_PATH: string;
 export declare const SLAS_SECRET_WARNING_MSG = "You are potentially exposing SLAS secret on browser. Make sure to keep it safe and secure!";
 export declare const SLAS_SECRET_PLACEHOLDER = "_PLACEHOLDER_PROXY-PWA_KIT_SLAS_CLIENT_SECRET";
 export declare const SLAS_SECRET_OVERRIDE_MSG = "You have enabled PWA Kit Private Client mode which gets the SLAS secret from your environment variable. The SLAS secret you have set in the Auth provider will be ignored.";
+export declare const SERVER_AFFINITY_HEADER_KEY = "sfdc_dwsid";
+export declare const EXCLUDE_COOKIE_SUFFIX: string[];
 //# sourceMappingURL=constant.d.ts.map

package/constant.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.SLAS_SECRET_WARNING_MSG = exports.SLAS_SECRET_PLACEHOLDER = exports.SLAS_SECRET_OVERRIDE_MSG = exports.SLAS_PRIVATE_PROXY_PATH = exports.PROXY_PATH = exports.MOBIFY_PATH = exports.LOCAL_BUNDLE_PATH = exports.IFRAME_HOST_ALLOW_LIST = void 0;
+exports.SLAS_SECRET_WARNING_MSG = exports.SLAS_SECRET_PLACEHOLDER = exports.SLAS_SECRET_OVERRIDE_MSG = exports.SLAS_PRIVATE_PROXY_PATH = exports.SERVER_AFFINITY_HEADER_KEY = exports.PROXY_PATH = exports.MOBIFY_PATH = exports.LOCAL_BUNDLE_PATH = exports.IFRAME_HOST_ALLOW_LIST = exports.EXCLUDE_COOKIE_SUFFIX = void 0;
 /*
  * Copyright (c) 2023, Salesforce, Inc.
  * All rights reserved.
@@ -23,4 +23,9 @@ const LOCAL_BUNDLE_PATH = exports.LOCAL_BUNDLE_PATH = `${MOBIFY_PATH}/bundle/dev
 const SLAS_PRIVATE_PROXY_PATH = exports.SLAS_PRIVATE_PROXY_PATH = `${MOBIFY_PATH}/slas/private`;
 const SLAS_SECRET_WARNING_MSG = exports.SLAS_SECRET_WARNING_MSG = 'You are potentially exposing SLAS secret on browser. Make sure to keep it safe and secure!';
 const SLAS_SECRET_PLACEHOLDER = exports.SLAS_SECRET_PLACEHOLDER = '_PLACEHOLDER_PROXY-PWA_KIT_SLAS_CLIENT_SECRET';
-const SLAS_SECRET_OVERRIDE_MSG = exports.SLAS_SECRET_OVERRIDE_MSG = 'You have enabled PWA Kit Private Client mode which gets the SLAS secret from your environment variable. The SLAS secret you have set in the Auth provider will be ignored.';
+const SLAS_SECRET_OVERRIDE_MSG = exports.SLAS_SECRET_OVERRIDE_MSG = 'You have enabled PWA Kit Private Client mode which gets the SLAS secret from your environment variable. The SLAS secret you have set in the Auth provider will be ignored.';
+const SERVER_AFFINITY_HEADER_KEY = exports.SERVER_AFFINITY_HEADER_KEY = 'sfdc_dwsid';
+
+// commerce-sdk-react namespaces cookies with siteID as suffixes to allow multisite setups.
+// However some cookies are set and used outside of PWA Kit and must not be modified with suffixes.
+const EXCLUDE_COOKIE_SUFFIX = exports.EXCLUDE_COOKIE_SUFFIX = ['dwsid'];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforce/commerce-sdk-react",
-  "version": "3.0.0",
+  "version": "3.1.0-exp-server-affinity.1",
   "description": "A library that provides react hooks for fetching data from Commerce Cloud",
   "homepage": "https://github.com/SalesforceCommerceCloud/pwa-kit/tree/develop/packages/ecom-react-hooks#readme",
   "bugs": {
@@ -40,12 +40,12 @@
     "version": "node ./scripts/version.js"
   },
   "dependencies": {
-    "commerce-sdk-isomorphic": "^3.0.0",
+    "commerce-sdk-isomorphic": "^3.1.1",
     "js-cookie": "^3.0.1",
     "jwt-decode": "^4.0.0"
   },
   "devDependencies": {
-    "@salesforce/pwa-kit-dev": "3.7.0",
+    "@salesforce/pwa-kit-dev": "3.8.0-dev",
     "@tanstack/react-query": "^4.28.0",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^14.0.0",
@@ -60,7 +60,7 @@
     "@types/react-helmet": "~6.1.6",
     "@types/react-router-dom": "~5.3.3",
     "cross-env": "^5.2.1",
-    "internal-lib-build": "3.7.0",
+    "internal-lib-build": "3.8.0-dev",
     "jsonwebtoken": "^9.0.0",
     "nock": "^13.3.0",
     "nodemon": "^2.0.22",
@@ -90,5 +90,5 @@
   "publishConfig": {
     "directory": "dist"
   },
-  "gitHead": "7a47e6b91a5a0edc69c999115345b9bd5154935f"
+  "gitHead": "5d64e1caeee3e6d075bb574db61de8b48971d2e9"
 }

package/provider.d.ts

@@ -12,11 +12,11 @@ export interface CommerceApiProviderProps extends ApiClientConfigParams {
     fetchOptions?: ShopperBasketsTypes.FetchOptions;
     headers?: Record<string, string>;
     fetchedToken?: string;
-    OCAPISessionsURL?: string;
     enablePWAKitPrivateClient?: boolean;
     clientSecret?: string;
     silenceWarnings?: boolean;
     logger?: Logger;
+    defaultDnt?: boolean;
 }
 /**
  * @internal

package/provider.js

@@ -92,18 +92,40 @@ const CommerceApiProvider = props => {
     locale,
     currency,
     fetchedToken,
-    OCAPISessionsURL,
     enablePWAKitPrivateClient,
     clientSecret,
     silenceWarnings,
-    logger
+    logger,
+    defaultDnt
   } = props;
 
   // Set the logger based on provided configuration, or default to the console object if no logger is provided
   const configLogger = logger || console;
+  const auth = (0, _react.useMemo)(() => {
+    return new _auth.default({
+      clientId,
+      organizationId,
+      shortCode,
+      siteId,
+      proxy,
+      redirectURI,
+      fetchOptions,
+      fetchedToken,
+      enablePWAKitPrivateClient,
+      clientSecret,
+      silenceWarnings,
+      logger: configLogger,
+      defaultDnt
+    });
+  }, [clientId, organizationId, shortCode, siteId, proxy, redirectURI, fetchOptions, fetchedToken, enablePWAKitPrivateClient, clientSecret, silenceWarnings, configLogger]);
+  const dwsid = auth.get('dwsid');
+  const serverAffinityHeader = {};
+  if (dwsid) {
+    serverAffinityHeader[_constant.SERVER_AFFINITY_HEADER_KEY] = dwsid;
+  }
   const config = {
     proxy,
-    headers,
+    headers: _objectSpread(_objectSpread({}, headers), serverAffinityHeader),
     parameters: {
       clientId,
       organizationId,
@@ -135,23 +157,6 @@ const CommerceApiProvider = props => {
       shopperStores: new _commerceSdkIsomorphic.ShopperStores(config)
     };
   }, [clientId, organizationId, shortCode, siteId, proxy, fetchOptions, locale, currency, headers === null || headers === void 0 ? void 0 : headers['correlation-id']]);
-  const auth = (0, _react.useMemo)(() => {
-    return new _auth.default({
-      clientId,
-      organizationId,
-      shortCode,
-      siteId,
-      proxy,
-      redirectURI,
-      fetchOptions,
-      fetchedToken,
-      OCAPISessionsURL,
-      enablePWAKitPrivateClient,
-      clientSecret,
-      silenceWarnings,
-      logger: configLogger
-    });
-  }, [clientId, organizationId, shortCode, siteId, proxy, redirectURI, fetchOptions, fetchedToken, OCAPISessionsURL, enablePWAKitPrivateClient, clientSecret, silenceWarnings, configLogger]);
 
   // Initialize the session
   (0, _react.useEffect)(() => void auth.ready(), [auth]);
@@ -168,7 +173,8 @@ const CommerceApiProvider = props => {
       locale,
       currency,
       silenceWarnings,
-      logger: configLogger
+      logger: configLogger,
+      defaultDnt
     }
   }, /*#__PURE__*/_react.default.createElement(CommerceApiContext.Provider, {
     value: apiClients