@saleor/app-sdk/app-bridge/index.js

SDK for building great Saleor Apps

"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }









var _chunkU6FNFVM3js = require('../chunk-U6FNFVM3.js');
require('../chunk-EJ6YJ4BD.js');



var _chunkODMQWUGYjs = require('../chunk-ODMQWUGY.js');



var _chunkNYP6GB3Qjs = require('../chunk-NYP6GB3Q.js');

// src/app-bridge/fetch.ts
var _react = require('react'); var React = _interopRequireWildcard(_react);
var createAuthenticatedFetch = (appBridge, fetch = global.fetch) => (input, init) => {
  const { token, saleorApiUrl } = appBridge.getState();
  const headers = new Headers(_optionalChain([init, 'optionalAccess', _ => _.headers]));
  headers.set(_chunkODMQWUGYjs.SALEOR_AUTHORIZATION_BEARER_HEADER, _nullishCoalesce(token, () => ( "")));
  headers.set(_chunkODMQWUGYjs.SALEOR_API_URL_HEADER, _nullishCoalesce(saleorApiUrl, () => ( "")));
  const clonedInit = {
    ..._nullishCoalesce(init, () => ( {})),
    headers
  };
  return fetch(input, clonedInit);
};
var useAuthenticatedFetch = (fetch = window.fetch) => {
  const { appBridge } = _chunkU6FNFVM3js.useAppBridge.call(void 0, );
  if (!appBridge) {
    throw new Error("useAuthenticatedFetch can be used only in browser context");
  }
  return _react.useMemo.call(void 0, () => createAuthenticatedFetch(appBridge, fetch), [appBridge, fetch]);
};

// src/app-bridge/use-dashboard-token.ts
var _debug = require('debug'); var _debug2 = _interopRequireDefault(_debug);
var _jose = require('jose'); var jose = _interopRequireWildcard(_jose);

var debug = _debug2.default.debug("app-sdk:AppBridge:useDashboardToken");
var useDashboardToken = () => {
  const { appBridgeState } = _chunkU6FNFVM3js.useAppBridge.call(void 0, );
  const tokenClaims = _react.useMemo.call(void 0, () => {
    try {
      if (_optionalChain([appBridgeState, 'optionalAccess', _2 => _2.token])) {
        debug("Trying to decode JWT token from dashboard");
        return jose.decodeJwt(_optionalChain([appBridgeState, 'optionalAccess', _3 => _3.token]));
      }
    } catch (e) {
      debug("Failed decoding JWT token");
      console.error(e);
    }
    return null;
  }, [_optionalChain([appBridgeState, 'optionalAccess', _4 => _4.token])]);
  return {
    /**
     * TODO: Add tokenClaims.iss validation, when added to Saleor
     * @see: https://github.com/saleor/saleor/pull/10852
     */
    isTokenValid: !!tokenClaims,
    tokenClaims,
    hasAppToken: Boolean(_optionalChain([appBridgeState, 'optionalAccess', _5 => _5.token]))
  };
};

// src/app-bridge/with-authorization.tsx

function SimpleError({ children }) {
  return /* @__PURE__ */ React.createElement("div", { style: { padding: 32, color: "red" } }, /* @__PURE__ */ React.createElement("p", null, children));
}
var defaultProps = {
  dashboardTokenInvalid: /* @__PURE__ */ React.createElement(SimpleError, null, "Dashboard token is invalid"),
  noDashboardToken: /* @__PURE__ */ React.createElement(SimpleError, null, 'Dashboard token doesn"t exist'),
  notIframe: /* @__PURE__ */ React.createElement(SimpleError, null, "The view can only be displayed inside iframe."),
  unmounted: /* @__PURE__ */ React.createElement("p", null, "Loading")
};
var withAuthorization = (props = defaultProps) => (BaseComponent) => {
  const { dashboardTokenInvalid, noDashboardToken, notIframe, unmounted } = {
    ...defaultProps,
    ...props
  };
  function AuthorizedPage(innerProps) {
    const mounted = _chunkNYP6GB3Qjs.useIsMounted.call(void 0, );
    const { isTokenValid, hasAppToken } = useDashboardToken();
    if (!mounted) {
      return unmounted;
    }
    if (!_chunkNYP6GB3Qjs.isInIframe.call(void 0, )) {
      return notIframe;
    }
    if (!hasAppToken) {
      return noDashboardToken;
    }
    if (!isTokenValid) {
      return dashboardTokenInvalid;
    }
    return /* @__PURE__ */ React.createElement(BaseComponent, { ...innerProps });
  }
  return AuthorizedPage;
};














exports.ActionType = _chunkU6FNFVM3js.ActionType; exports.AppBridge = _chunkU6FNFVM3js.AppBridge; exports.AppBridgeProvider = _chunkU6FNFVM3js.AppBridgeProvider; exports.AppContext = _chunkU6FNFVM3js.AppContext; exports.AppIframeParams = _chunkU6FNFVM3js.AppIframeParams; exports.DashboardEventFactory = _chunkU6FNFVM3js.DashboardEventFactory; exports.EventType = _chunkU6FNFVM3js.EventType; exports.actions = _chunkU6FNFVM3js.actions; exports.createAuthenticatedFetch = createAuthenticatedFetch; exports.useAppBridge = _chunkU6FNFVM3js.useAppBridge; exports.useAuthenticatedFetch = useAuthenticatedFetch; exports.useDashboardToken = useDashboardToken; exports.withAuthorization = withAuthorization;