@salesforce/commerce-sdk-react 1.0.0-preview.0

package/hooks/utils.js

@@ -0,0 +1,125 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.updateCache = exports.pick = exports.pathStartsWith = exports.omitNullableParameters = exports.omitNullable = exports.mergeOptions = exports.isObject = exports.hasAllKeys = exports.clone = exports.and = exports.NotImplementedError = void 0;
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+/*
+ * Copyright (c) 2023, Salesforce, Inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: BSD-3-Clause
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
+ */
+
+/** Applies the set of cache updates to the query client. */
+const updateCache = (queryClient, cacheUpdates, data) => {
+  var _cacheUpdates$invalid, _cacheUpdates$remove, _cacheUpdates$update;
+  (_cacheUpdates$invalid = cacheUpdates.invalidate) === null || _cacheUpdates$invalid === void 0 ? void 0 : _cacheUpdates$invalid.forEach(invalidate => {
+    // TODO: Fix floating promises (convert updateCache to async)
+    // eslint-disable-next-line @typescript-eslint/no-floating-promises
+    queryClient.invalidateQueries(invalidate);
+  });
+  (_cacheUpdates$remove = cacheUpdates.remove) === null || _cacheUpdates$remove === void 0 ? void 0 : _cacheUpdates$remove.forEach(remove => {
+    queryClient.removeQueries(remove);
+  });
+  (_cacheUpdates$update = cacheUpdates.update) === null || _cacheUpdates$update === void 0 ? void 0 : _cacheUpdates$update.forEach(({
+    queryKey,
+    updater
+  }) =>
+  // If an updater isn't given, fall back to just setting the data
+  queryClient.setQueryData(queryKey, updater ?? data));
+};
+
+/** Error thrown when a method is not implemented. */
+exports.updateCache = updateCache;
+class NotImplementedError extends Error {
+  constructor(method = 'This method') {
+    super(`${method} is not implemented.`);
+  }
+}
+
+/** Determines whether a value is an object. */
+exports.NotImplementedError = NotImplementedError;
+const isObject = obj => typeof obj === 'object' && obj !== null;
+
+/** Determines whether a value has all of the given keys. */
+exports.isObject = isObject;
+const hasAllKeys = (object, keys) => keys.every(key => object[key] !== undefined && object[key] !== null);
+
+/** Creates a query predicate that determines whether a query key starts with the given path segments. */
+exports.hasAllKeys = hasAllKeys;
+const pathStartsWith = search => ({
+  queryKey
+}) => queryKey.length >= search.length && search.every((lookup, idx) => queryKey[idx] === lookup);
+
+/** Creates a query predicate that returns true if all of the given predicates return true. */
+exports.pathStartsWith = pathStartsWith;
+const and = (...funcs) => (...args) => funcs.every(fn => fn(...args));
+
+/**
+ * Merges headers and parameters from client config into the options, mimicking the behavior
+ * of commerce-sdk-isomorphic.
+ */
+exports.and = and;
+const mergeOptions = (client, options) => {
+  const merged = _objectSpread(_objectSpread({}, 'body' in options ?
+  // I'm not entirely sure why these type assertions are necessary. It seems likely that
+  // the type definitions are more complex than they need to be.
+  {
+    body: options.body
+  } : {}), {}, {
+    parameters: _objectSpread(_objectSpread({}, client.clientConfig.parameters), options.parameters ? omitNullable(options.parameters) : {}),
+    headers: _objectSpread(_objectSpread({}, client.clientConfig.parameters), options.parameters)
+  });
+  return merged;
+};
+
+/** Constructs a subset of the given object containing only the given keys. */
+exports.mergeOptions = mergeOptions;
+const pick = (obj, keys) => {
+  // Assertion is not true, yet, but we make it so!
+  const picked = {};
+  keys.forEach(key => {
+    if (key in obj) {
+      // Skip assigning optional/missing parameters
+      picked[key] = obj[key];
+    }
+  });
+  return picked;
+};
+
+/** Removes keys with `null` or `undefined` values from the given object. */
+exports.pick = pick;
+const omitNullable = obj => {
+  // Assertion is not true, yet, but we make it so!
+  const stripped = {};
+  // Assertion because `Object.entries` is limited :\
+  const entries = Object.entries(obj);
+  for (const [key, value] of entries) {
+    if (value !== null && value !== undefined) stripped[key] = value;
+  }
+  return stripped;
+};
+
+/** Removes keys with `null` or `undefined` values from the `parameters` of the given object. */
+exports.omitNullable = omitNullable;
+const omitNullableParameters = obj => _objectSpread(_objectSpread({}, obj), {}, {
+  // Without the explicit generic parameter, the generic is inferred as `object`,
+  // the connection to `T` is lost, and TypeScript complains.
+  parameters: omitNullable(obj.parameters)
+});
+
+/** Simple deep clone utility */
+exports.omitNullableParameters = omitNullableParameters;
+const clone = val => {
+  if (typeof val !== 'object' || val === null) return val;
+  if (Array.isArray(val)) return val.map(clone);
+  const entries = Object.entries(val).map(([k, v]) => [k, clone(v)]);
+  return Object.fromEntries(entries);
+};
+exports.clone = clone;

package/index.d.ts

@@ -0,0 +1,5 @@
+import CommerceApiProvider from './provider';
+export * from './hooks/types';
+export * from './hooks';
+export { CommerceApiProvider };
+//# sourceMappingURL=index.d.ts.map

package/index.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  CommerceApiProvider: true
+};
+Object.defineProperty(exports, "CommerceApiProvider", {
+  enumerable: true,
+  get: function () {
+    return _provider.default;
+  }
+});
+var _provider = _interopRequireDefault(require("./provider"));
+var _types = require("./hooks/types");
+Object.keys(_types).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _types[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _types[key];
+    }
+  });
+});
+var _hooks = require("./hooks");
+Object.keys(_hooks).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _hooks[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _hooks[key];
+    }
+  });
+});
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/package.json

@@ -0,0 +1,88 @@
+{
+  "name": "@salesforce/commerce-sdk-react",
+  "version": "1.0.0-preview.0",
+  "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": {
+    "url": "https://github.com/SalesforceCommerceCloud/pwa-kit/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/SalesforceCommerceCloud/pwa-kit.git"
+  },
+  "license": "See license in LICENSE",
+  "author": "cc-pwa-kit@salesforce.com",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "CHANGELOG.md",
+    "LICENSE",
+    "+(auth|components|hooks|scripts)/**/!(*.test*).{ts,js}",
+    "*.{js,d.ts}",
+    "!*.test*.{js,d.ts}",
+    "!test*.*",
+    "!+(jest|babel).config.js",
+    "!setup-jest.js"
+  ],
+  "scripts": {
+    "build": "cross-env NODE_ENV=production internal-lib-build build && tsc --emitDeclarationOnly",
+    "build:docs": "typedoc",
+    "build:watch": "nodemon --watch 'src/**' --ext 'tsx,ts' --exec  'npm run build'",
+    "format": "internal-lib-build format \"**/*.{js,jsx,ts,tsx}\"",
+    "lint": "npm run lint:js && tsc --noEmit",
+    "lint:fix": "npm run lint:js -- --fix",
+    "lint:js": "pwa-kit-dev lint \"**/*.{js,jsx,ts,tsx}\"",
+    "prepare": "npm run build",
+    "test": "internal-lib-build test",
+    "test:inspect": "node --inspect-brk jest --runInBand",
+    "test:watch": "npm test -- --watch",
+    "typecheck": "tsc --noEmit",
+    "version": "node ./scripts/version.js"
+  },
+  "dependencies": {
+    "commerce-sdk-isomorphic": "^1.10.1",
+    "js-cookie": "^3.0.1",
+    "jwt-decode": "^3.1.2"
+  },
+  "devDependencies": {
+    "@salesforce/pwa-kit-dev": "3.0.0-preview.0",
+    "@tanstack/react-query": "^4.28.0",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^14.0.0",
+    "@types/js-cookie": "^3.0.3",
+    "@types/jsonwebtoken": "^8.5.9",
+    "@types/jwt-decode": "^3.1.0",
+    "@types/node": "^14.18.40",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.1",
+    "@types/react-helmet": "^6.1.6",
+    "cross-env": "^5.2.1",
+    "internal-lib-build": "3.0.0-preview.0",
+    "jsonwebtoken": "^8.5.1",
+    "nock": "^13.3.0",
+    "nodemon": "^2.0.22",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-helmet": "^6.1.0",
+    "semver": "^7.3.8",
+    "shelljs": "^0.8.5",
+    "typedoc": "^0.23.28",
+    "typescript": "4.8.3"
+  },
+  "peerDependencies": {
+    "@tanstack/react-query": "^4",
+    "react": "^18",
+    "react-helmet": "6"
+  },
+  "optionalDependencies": {
+    "prop-types": "^15.8.1"
+  },
+  "engines": {
+    "node": "^16.11.0 || ^18.0.0",
+    "npm": "^8.0.0 || ^9.0.0"
+  },
+  "publishConfig": {
+    "directory": "dist"
+  },
+  "gitHead": "a9f820893b7714244a0af509a5aefecc1344153c"
+}

package/provider.d.ts

@@ -0,0 +1,36 @@
+import React, { ReactElement } from 'react';
+import { ShopperBasketsTypes } from 'commerce-sdk-isomorphic';
+import Auth from './auth';
+import { ApiClientConfigParams, ApiClients } from './hooks/types';
+export interface CommerceApiProviderProps extends ApiClientConfigParams {
+    children: React.ReactNode;
+    proxy: string;
+    locale: string;
+    currency: string;
+    redirectURI: string;
+    fetchOptions?: ShopperBasketsTypes.FetchOptions;
+    headers?: Record<string, string>;
+    fetchedToken?: string;
+    OCAPISessionsURL?: string;
+}
+/**
+ * @internal
+ */
+export declare const CommerceApiContext: React.Context<ApiClients>;
+/**
+ * @internal
+ */
+export declare const ConfigContext: React.Context<Omit<CommerceApiProviderProps, "children">>;
+/**
+ * @internal
+ */
+export declare const AuthContext: React.Context<Auth>;
+/**
+ * Initialize a set of Commerce API clients and make it available to all of descendant components
+ *
+ * @param props
+ * @returns Provider to wrap your app with
+ */
+declare const CommerceApiProvider: (props: CommerceApiProviderProps) => ReactElement;
+export default CommerceApiProvider;
+//# sourceMappingURL=provider.d.ts.map

package/provider.js

@@ -0,0 +1,124 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ConfigContext = exports.CommerceApiContext = exports.AuthContext = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _commerceSdkIsomorphic = require("commerce-sdk-isomorphic");
+var _auth = _interopRequireDefault(require("./auth"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/*
+ * Copyright (c) 2022, salesforce.com, inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: BSD-3-Clause
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
+ */
+
+/**
+ * @internal
+ */
+const CommerceApiContext = /*#__PURE__*/_react.default.createContext({});
+
+/**
+ * @internal
+ */
+exports.CommerceApiContext = CommerceApiContext;
+const ConfigContext = /*#__PURE__*/_react.default.createContext({});
+
+/**
+ * @internal
+ */
+exports.ConfigContext = ConfigContext;
+const AuthContext = /*#__PURE__*/_react.default.createContext({});
+
+/**
+ * Initialize a set of Commerce API clients and make it available to all of descendant components
+ *
+ * @param props
+ * @returns Provider to wrap your app with
+ */
+exports.AuthContext = AuthContext;
+const CommerceApiProvider = props => {
+  const {
+    children,
+    clientId,
+    headers = {},
+    organizationId,
+    proxy,
+    redirectURI,
+    fetchOptions,
+    siteId,
+    shortCode,
+    locale,
+    currency,
+    fetchedToken,
+    OCAPISessionsURL
+  } = props;
+  const config = {
+    proxy,
+    headers,
+    parameters: {
+      clientId,
+      organizationId,
+      shortCode,
+      siteId,
+      locale,
+      currency
+    },
+    throwOnBadResponse: true,
+    fetchOptions
+  };
+  const apiClients = (0, _react.useMemo)(() => {
+    return {
+      shopperBaskets: new _commerceSdkIsomorphic.ShopperBaskets(config),
+      shopperContexts: new _commerceSdkIsomorphic.ShopperContexts(config),
+      shopperCustomers: new _commerceSdkIsomorphic.ShopperCustomers(config),
+      shopperExperience: new _commerceSdkIsomorphic.ShopperExperience(config),
+      shopperGiftCertificates: new _commerceSdkIsomorphic.ShopperGiftCertificates(config),
+      shopperLogin: new _commerceSdkIsomorphic.ShopperLogin(config),
+      shopperOrders: new _commerceSdkIsomorphic.ShopperOrders(config),
+      shopperProducts: new _commerceSdkIsomorphic.ShopperProducts(config),
+      shopperPromotions: new _commerceSdkIsomorphic.ShopperPromotions(config),
+      shopperSearch: new _commerceSdkIsomorphic.ShopperSearch(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
+    });
+  }, [clientId, organizationId, shortCode, siteId, proxy, redirectURI, fetchOptions, fetchedToken, OCAPISessionsURL]);
+
+  // Initialize the session
+  (0, _react.useEffect)(() => void auth.ready(), [auth]);
+  return /*#__PURE__*/_react.default.createElement(ConfigContext.Provider, {
+    value: {
+      clientId,
+      headers,
+      organizationId,
+      proxy,
+      redirectURI,
+      fetchOptions,
+      siteId,
+      shortCode,
+      locale,
+      currency
+    }
+  }, /*#__PURE__*/_react.default.createElement(CommerceApiContext.Provider, {
+    value: apiClients
+  }, /*#__PURE__*/_react.default.createElement(AuthContext.Provider, {
+    value: auth
+  }, children)));
+};
+var _default = CommerceApiProvider;
+exports.default = _default;

package/scripts/build-and-release-docs.js

@@ -0,0 +1,48 @@
+/*
+ * Copyright (c) 2023, Salesforce, Inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: BSD-3-Clause
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
+ */
+/* eslint-disable @typescript-eslint/no-var-requires */
+const packageJSON = require('../package.json')
+const sh = require('shelljs')
+const semver = require('semver')
+
+// this script is expected to run on release branch.
+const main = () => {
+    // get the version number from package json
+    const currentVersion = packageJSON.version
+    const isPrerelease = semver.prerelease(currentVersion.trim())
+    // if it is a pre-release version, do nothing
+    if (isPrerelease) {
+        return
+    }
+
+    let latestVersion
+    let isNewPackage
+    const {stdout, stderr} = sh.exec(`npm view ${packageJSON.name} version`, {silent: true})
+    if (stderr) {
+        isNewPackage = stderr.includes(`'${packageJSON.name}' is not in the npm registry`)
+        if (!isNewPackage) {
+            console.log('stderr', stderr)
+            process.exit(0)
+        }
+    } else {
+        latestVersion = stdout
+    }
+
+    const isLatest = isNewPackage || semver.gt(currentVersion, latestVersion)
+    if (isLatest) {
+        console.log(`Publish docs for version ${currentVersion} to gh-pages branch`)
+        // build the docs
+        sh.exec('npm run build:docs')
+
+        // release the docs
+        sh.exec(
+            'npx gh-pages --dotfiles --message "[skip ci] Pushing docs to gh-pages" --dist docs'
+        )
+    }
+}
+
+main()

package/scripts/version.js

@@ -0,0 +1,22 @@
+#!/usr/bin/env node
+/*
+ * Copyright (c) 2023, Salesforce, Inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: BSD-3-Clause
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
+ */
+/* eslint-disable @typescript-eslint/no-var-requires */
+// Update Change Log heading
+const pkg = require('../package.json')
+const path = require('path')
+const os = require('os')
+const fs = require('fs')
+
+const date = new Date().toString().split(' ').slice(1, 4)
+const heading = `## v${pkg.version} (${date[0]} ${date[1]}, ${date[2]})\n`
+
+const changelog = path.resolve(os.tmpdir(), 'CHANGELOG.md')
+
+fs.writeFileSync(changelog, heading, 'utf8')
+fs.appendFileSync(changelog, fs.readFileSync('CHANGELOG.md'), 'utf8')
+fs.copyFileSync(changelog, 'CHANGELOG.md')

package/utils.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Utility to determine if you are on the browser (client) or not.
+ */
+export declare const onClient: () => boolean;
+//# sourceMappingURL=utils.d.ts.map

package/utils.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.onClient = void 0;
+/*
+ * Copyright (c) 2023, Salesforce, Inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: BSD-3-Clause
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
+ */
+
+/**
+ * Utility to determine if you are on the browser (client) or not.
+ */
+const onClient = () => typeof window !== 'undefined';
+exports.onClient = onClient;