@commercetools-frontend/application-shell 27.10.0 → 27.11.0

package/dist/{index-245e2980.cjs.prod.js → application-entry-point-516fd72c.cjs.prod.js}

@@ -31,6 +31,12 @@ var sentry = require('@commercetools-frontend/sentry');
 var reactNotifications = require('@commercetools-frontend/react-notifications');
 var _startsWithInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/starts-with');
 var reduxLogger = require('redux-logger');
+var reactRouterDom = require('react-router-dom');
+var invariant = require('tiny-invariant');
+var applicationComponents = require('@commercetools-frontend/application-components');
+var ssr = require('@commercetools-frontend/application-config/ssr');
+var permissions = require('@commercetools-frontend/permissions');
+var jsxRuntime = require('@emotion/react/jsx-runtime');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -52,6 +58,7 @@ var _indexOfInstanceProperty__default = /*#__PURE__*/_interopDefault(_indexOfIns
 var _sliceInstanceProperty__default = /*#__PURE__*/_interopDefault(_sliceInstanceProperty);
 var _includesInstanceProperty__default = /*#__PURE__*/_interopDefault(_includesInstanceProperty);
 var _startsWithInstanceProperty__default = /*#__PURE__*/_interopDefault(_startsWithInstanceProperty);
+var invariant__default = /*#__PURE__*/_interopDefault(invariant);
 
 const isShowRequestInFlightAction = action => action.type === constants.SHOW_LOADING;
 const isHideRequestInFlightAction = action => action.type === constants.HIDE_LOADING;
@@ -125,14 +132,14 @@ const loggerMiddleware = reduxLogger.createLogger({
   }
 });
 
-function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context3, _context4; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context3 = ownKeys(Object(t), !0)).call(_context3, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context4 = ownKeys(Object(t))).call(_context4, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
+function ownKeys$1(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var _context3, _context4; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context3 = ownKeys$1(Object(t), !0)).call(_context3, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context4 = ownKeys$1(Object(t))).call(_context4, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
 const mergeObjectValues = object => {
   var _context;
   return _reduceInstanceProperty__default["default"](_context = _Object$entries__default["default"](object)).call(_context, (acc, _ref) => {
     let _ref2 = _slicedToArray(_ref, 2),
       value = _ref2[1];
-    return _objectSpread(_objectSpread({}, acc), value);
+    return _objectSpread$1(_objectSpread$1({}, acc), value);
   }, {});
 };
 const patchedGetCorrelationId = () => applicationShellConnectors.getCorrelationId({
@@ -174,7 +181,7 @@ const createInternalReducer = function () {
 
   // NOTE: since we don't know in advance which reducers will be injected,
   // we let TypeScript infer the type from the reducer map.
-  return toolkit.combineReducers(_objectSpread(_objectSpread({
+  return toolkit.combineReducers(_objectSpread$1(_objectSpread$1({
     requestsInFlight: requestsInFlightReducer,
     notifications: notifications.reducer
   }, injectedReducers), preloadedStateReducers));
@@ -231,6 +238,65 @@ var internalReduxStore = createReduxStore();
 
 const RouteCatchAll = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./route-catch-all-8e71a93c.cjs.prod.js' /* webpackChunkName: "route-catch-all" */); }));
 
+function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
+const ApplicationRouteWithPermissionCheck = props => {
+  const permissionKeys = ssr.entryPointUriPathToPermissionKeys(props.environment.entryPointUriPath);
+  // Require View permission to render the application.
+  const canView = permissions.useIsAuthorized({
+    demandedPermissions: [permissionKeys.View]
+  });
+  if (canView) {
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: react.Children.only(props.children)
+    });
+  }
+  return jsxRuntime.jsx(applicationComponents.PageUnauthorized, {});
+};
+const ApplicationRoute = props => {
+  if (props.disableRoutePermissionCheck) {
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: react.Children.only(props.children)
+    });
+  }
+  return jsxRuntime.jsx(ApplicationRouteWithPermissionCheck, _objectSpread({}, props));
+};
+const ApplicationEntryPoint = props => {
+  // If the `children` prop is used (instead of the `render` prop),
+  // we pre-configure the application entry point routes to avoid
+  // users to do so on their own.
+  if (props.children) {
+    const entryPointUriPath = props.environment.entryPointUriPath;
+    // Applications like `agent-sphere` run in a project context but do not
+    // carry the `projectKey` in the URL, so their routes live at the root.
+    const isProjectKeylessApplication = constants.isProjectKeylessApplicationEntryPointInProjectContext(entryPointUriPath);
+    return jsxRuntime.jsxs(reactRouterDom.Switch, {
+      children: [
+      // For development, it's useful to redirect to the actual
+      // application routes when you open the browser at http://localhost:3001.
+      // For project-keyless applications this must be skipped, as `/:projectKey`
+      // would match their own entry point route.
+      null , jsxRuntime.jsx(reactRouterDom.Route, {
+        path: isProjectKeylessApplication ? `/${entryPointUriPath}` : `/:projectKey/${entryPointUriPath}`,
+        children: jsxRuntime.jsx(ApplicationRoute, _objectSpread({}, props))
+      }), jsxRuntime.jsx(RouteCatchAll, {})]
+    });
+  }
+
+  // We still support the `render` prop, for backwards compatibility
+  // and for having more control in certain cases (mostly to some of our internal apps).
+  if (props.render && typeof props.render === 'function') {
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: props.render()
+    });
+  }
+
+  // The `render` prop function is still required (backwards compatibility).
+  !!props.render ? invariant__default["default"](false) : void 0;
+  return null;
+};
+
+exports.ApplicationEntryPoint = ApplicationEntryPoint;
 exports.RouteCatchAll = RouteCatchAll;
 exports.applyDefaultMiddlewares = applyDefaultMiddlewares;
 exports.createReduxStore = createReduxStore;

package/dist/{index-86039df7.esm.js → application-entry-point-e20cafdb.esm.js}

@@ -18,10 +18,10 @@ import omitEmpty from 'omit-empty-es';
 import { applyMiddleware } from 'redux';
 import { thunk } from 'redux-thunk';
 import { logger, selectProjectKeyFromUrl, getCorrelationId, selectUserId, oidcStorage, selectTeamIdFromStorage } from '@commercetools-frontend/application-shell-connectors';
-import { SHOW_LOADING, HIDE_LOADING, NOTIFICATION_KINDS_PAGE, HIDE_ALL_PAGE_NOTIFICATIONS, SUPPORTED_HEADERS } from '@commercetools-frontend/constants';
+import { SHOW_LOADING, HIDE_LOADING, NOTIFICATION_KINDS_PAGE, HIDE_ALL_PAGE_NOTIFICATIONS, SUPPORTED_HEADERS, isProjectKeylessApplicationEntryPointInProjectContext } from '@commercetools-frontend/constants';
 import { removeNotification, ADD_NOTIFICATION, REMOVE_NOTIFICATION, middleware, reducer } from '@commercetools-frontend/notifications';
 import { createMiddleware } from '@commercetools-frontend/sdk';
-import { lazy } from 'react';
+import { lazy, Children } from 'react';
 import _indexOfInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/index-of';
 import _sliceInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/slice';
 import _includesInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/includes';
@@ -29,6 +29,12 @@ import { reportErrorToSentry } from '@commercetools-frontend/sentry';
 import { selectPageNotifications } from '@commercetools-frontend/react-notifications';
 import _startsWithInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/starts-with';
 import { createLogger } from 'redux-logger';
+import { Switch, Route, Redirect } from 'react-router-dom';
+import invariant from 'tiny-invariant';
+import { PageUnauthorized } from '@commercetools-frontend/application-components';
+import { entryPointUriPathToPermissionKeys } from '@commercetools-frontend/application-config/ssr';
+import { useIsAuthorized } from '@commercetools-frontend/permissions';
+import { jsxs, jsx, Fragment } from '@emotion/react/jsx-runtime';
 
 const isShowRequestInFlightAction = action => action.type === SHOW_LOADING;
 const isHideRequestInFlightAction = action => action.type === HIDE_LOADING;
@@ -102,14 +108,14 @@ const loggerMiddleware = createLogger({
   }
 });
 
-function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, 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 _context3, _context4; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context3 = ownKeys(Object(t), !0)).call(_context3, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context4 = ownKeys(Object(t))).call(_context4, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$1(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var _context3, _context4; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context3 = ownKeys$1(Object(t), !0)).call(_context3, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context4 = ownKeys$1(Object(t))).call(_context4, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
 const mergeObjectValues = object => {
   var _context;
   return _reduceInstanceProperty(_context = _Object$entries(object)).call(_context, (acc, _ref) => {
     let _ref2 = _slicedToArray(_ref, 2),
       value = _ref2[1];
-    return _objectSpread(_objectSpread({}, acc), value);
+    return _objectSpread$1(_objectSpread$1({}, acc), value);
   }, {});
 };
 const patchedGetCorrelationId = () => getCorrelationId({
@@ -151,7 +157,7 @@ const createInternalReducer = function () {
 
   // NOTE: since we don't know in advance which reducers will be injected,
   // we let TypeScript infer the type from the reducer map.
-  return combineReducers(_objectSpread(_objectSpread({
+  return combineReducers(_objectSpread$1(_objectSpread$1({
     requestsInFlight: requestsInFlightReducer,
     notifications: reducer
   }, injectedReducers), preloadedStateReducers));
@@ -208,4 +214,72 @@ var internalReduxStore = createReduxStore();
 
 const RouteCatchAll = /*#__PURE__*/lazy(() => import('./route-catch-all-7803b1fd.esm.js' /* webpackChunkName: "route-catch-all" */));
 
-export { RouteCatchAll as R, applyDefaultMiddlewares as a, createReduxStore as c, internalReduxStore as i };
+function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, 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 _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+const ApplicationRouteWithPermissionCheck = props => {
+  const permissionKeys = entryPointUriPathToPermissionKeys(props.environment.entryPointUriPath);
+  // Require View permission to render the application.
+  const canView = useIsAuthorized({
+    demandedPermissions: [permissionKeys.View]
+  });
+  if (canView) {
+    return jsx(Fragment, {
+      children: Children.only(props.children)
+    });
+  }
+  return jsx(PageUnauthorized, {});
+};
+const ApplicationRoute = props => {
+  if (props.disableRoutePermissionCheck) {
+    return jsx(Fragment, {
+      children: Children.only(props.children)
+    });
+  }
+  return jsx(ApplicationRouteWithPermissionCheck, _objectSpread({}, props));
+};
+const ApplicationEntryPoint = props => {
+  // If the `children` prop is used (instead of the `render` prop),
+  // we pre-configure the application entry point routes to avoid
+  // users to do so on their own.
+  if (props.children) {
+    const entryPointUriPath = props.environment.entryPointUriPath;
+    // Applications like `agent-sphere` run in a project context but do not
+    // carry the `projectKey` in the URL, so their routes live at the root.
+    const isProjectKeylessApplication = isProjectKeylessApplicationEntryPointInProjectContext(entryPointUriPath);
+    return jsxs(Switch, {
+      children: [
+      // For development, it's useful to redirect to the actual
+      // application routes when you open the browser at http://localhost:3001.
+      // For project-keyless applications this must be skipped, as `/:projectKey`
+      // would match their own entry point route.
+      process.env.NODE_ENV === 'production' || isProjectKeylessApplication ? null : jsx(Route, {
+        exact: true,
+        path: "/:projectKey",
+        render: _ref => {
+          let match = _ref.match;
+          const projectKey = match.params.projectKey;
+          return jsx(Redirect, {
+            to: `/${projectKey}/${entryPointUriPath}`
+          });
+        }
+      }), jsx(Route, {
+        path: isProjectKeylessApplication ? `/${entryPointUriPath}` : `/:projectKey/${entryPointUriPath}`,
+        children: jsx(ApplicationRoute, _objectSpread({}, props))
+      }), jsx(RouteCatchAll, {})]
+    });
+  }
+
+  // We still support the `render` prop, for backwards compatibility
+  // and for having more control in certain cases (mostly to some of our internal apps).
+  if (props.render && typeof props.render === 'function') {
+    return jsx(Fragment, {
+      children: props.render()
+    });
+  }
+
+  // The `render` prop function is still required (backwards compatibility).
+  !!props.render ? process.env.NODE_ENV !== "production" ? invariant(false, '@commercetools-frontend/application-shell: Missing required function prop "render".') : invariant(false) : void 0;
+  return null;
+};
+
+export { ApplicationEntryPoint as A, RouteCatchAll as R, applyDefaultMiddlewares as a, createReduxStore as c, internalReduxStore as i };

package/dist/{index-614accc4.cjs.dev.js → application-entry-point-e5623556.cjs.dev.js}

@@ -31,6 +31,12 @@ var sentry = require('@commercetools-frontend/sentry');
 var reactNotifications = require('@commercetools-frontend/react-notifications');
 var _startsWithInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/starts-with');
 var reduxLogger = require('redux-logger');
+var reactRouterDom = require('react-router-dom');
+var invariant = require('tiny-invariant');
+var applicationComponents = require('@commercetools-frontend/application-components');
+var ssr = require('@commercetools-frontend/application-config/ssr');
+var permissions = require('@commercetools-frontend/permissions');
+var jsxRuntime = require('@emotion/react/jsx-runtime');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -52,6 +58,7 @@ var _indexOfInstanceProperty__default = /*#__PURE__*/_interopDefault(_indexOfIns
 var _sliceInstanceProperty__default = /*#__PURE__*/_interopDefault(_sliceInstanceProperty);
 var _includesInstanceProperty__default = /*#__PURE__*/_interopDefault(_includesInstanceProperty);
 var _startsWithInstanceProperty__default = /*#__PURE__*/_interopDefault(_startsWithInstanceProperty);
+var invariant__default = /*#__PURE__*/_interopDefault(invariant);
 
 const isShowRequestInFlightAction = action => action.type === constants.SHOW_LOADING;
 const isHideRequestInFlightAction = action => action.type === constants.HIDE_LOADING;
@@ -125,14 +132,14 @@ const loggerMiddleware = reduxLogger.createLogger({
   }
 });
 
-function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context3, _context4; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context3 = ownKeys(Object(t), !0)).call(_context3, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context4 = ownKeys(Object(t))).call(_context4, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
+function ownKeys$1(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var _context3, _context4; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context3 = ownKeys$1(Object(t), !0)).call(_context3, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context4 = ownKeys$1(Object(t))).call(_context4, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
 const mergeObjectValues = object => {
   var _context;
   return _reduceInstanceProperty__default["default"](_context = _Object$entries__default["default"](object)).call(_context, (acc, _ref) => {
     let _ref2 = _slicedToArray(_ref, 2),
       value = _ref2[1];
-    return _objectSpread(_objectSpread({}, acc), value);
+    return _objectSpread$1(_objectSpread$1({}, acc), value);
   }, {});
 };
 const patchedGetCorrelationId = () => applicationShellConnectors.getCorrelationId({
@@ -174,7 +181,7 @@ const createInternalReducer = function () {
 
   // NOTE: since we don't know in advance which reducers will be injected,
   // we let TypeScript infer the type from the reducer map.
-  return toolkit.combineReducers(_objectSpread(_objectSpread({
+  return toolkit.combineReducers(_objectSpread$1(_objectSpread$1({
     requestsInFlight: requestsInFlightReducer,
     notifications: notifications.reducer
   }, injectedReducers), preloadedStateReducers));
@@ -231,6 +238,75 @@ var internalReduxStore = createReduxStore();
 
 const RouteCatchAll = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./route-catch-all-b979e1fd.cjs.dev.js' /* webpackChunkName: "route-catch-all" */); }));
 
+function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
+const ApplicationRouteWithPermissionCheck = props => {
+  const permissionKeys = ssr.entryPointUriPathToPermissionKeys(props.environment.entryPointUriPath);
+  // Require View permission to render the application.
+  const canView = permissions.useIsAuthorized({
+    demandedPermissions: [permissionKeys.View]
+  });
+  if (canView) {
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: react.Children.only(props.children)
+    });
+  }
+  return jsxRuntime.jsx(applicationComponents.PageUnauthorized, {});
+};
+const ApplicationRoute = props => {
+  if (props.disableRoutePermissionCheck) {
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: react.Children.only(props.children)
+    });
+  }
+  return jsxRuntime.jsx(ApplicationRouteWithPermissionCheck, _objectSpread({}, props));
+};
+const ApplicationEntryPoint = props => {
+  // If the `children` prop is used (instead of the `render` prop),
+  // we pre-configure the application entry point routes to avoid
+  // users to do so on their own.
+  if (props.children) {
+    const entryPointUriPath = props.environment.entryPointUriPath;
+    // Applications like `agent-sphere` run in a project context but do not
+    // carry the `projectKey` in the URL, so their routes live at the root.
+    const isProjectKeylessApplication = constants.isProjectKeylessApplicationEntryPointInProjectContext(entryPointUriPath);
+    return jsxRuntime.jsxs(reactRouterDom.Switch, {
+      children: [
+      // For development, it's useful to redirect to the actual
+      // application routes when you open the browser at http://localhost:3001.
+      // For project-keyless applications this must be skipped, as `/:projectKey`
+      // would match their own entry point route.
+      process.env.NODE_ENV === 'production' || isProjectKeylessApplication ? null : jsxRuntime.jsx(reactRouterDom.Route, {
+        exact: true,
+        path: "/:projectKey",
+        render: _ref => {
+          let match = _ref.match;
+          const projectKey = match.params.projectKey;
+          return jsxRuntime.jsx(reactRouterDom.Redirect, {
+            to: `/${projectKey}/${entryPointUriPath}`
+          });
+        }
+      }), jsxRuntime.jsx(reactRouterDom.Route, {
+        path: isProjectKeylessApplication ? `/${entryPointUriPath}` : `/:projectKey/${entryPointUriPath}`,
+        children: jsxRuntime.jsx(ApplicationRoute, _objectSpread({}, props))
+      }), jsxRuntime.jsx(RouteCatchAll, {})]
+    });
+  }
+
+  // We still support the `render` prop, for backwards compatibility
+  // and for having more control in certain cases (mostly to some of our internal apps).
+  if (props.render && typeof props.render === 'function') {
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: props.render()
+    });
+  }
+
+  // The `render` prop function is still required (backwards compatibility).
+  !!props.render ? process.env.NODE_ENV !== "production" ? invariant__default["default"](false, '@commercetools-frontend/application-shell: Missing required function prop "render".') : invariant__default["default"](false) : void 0;
+  return null;
+};
+
+exports.ApplicationEntryPoint = ApplicationEntryPoint;
 exports.RouteCatchAll = RouteCatchAll;
 exports.applyDefaultMiddlewares = applyDefaultMiddlewares;
 exports.createReduxStore = createReduxStore;

package/dist/commercetools-frontend-application-shell.cjs.dev.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var dist_commercetoolsFrontendApplicationShell = require('./index-c7140b1c.cjs.dev.js');
-var index = require('./index-614accc4.cjs.dev.js');
+var dist_commercetoolsFrontendApplicationShell = require('./index-3244236c.cjs.dev.js');
+var applicationEntryPoint = require('./application-entry-point-e5623556.cjs.dev.js');
 var oidc = require('./oidc-b9e7297c.cjs.dev.js');
 var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
 var ssr = require('@commercetools-frontend/application-config/ssr');
@@ -11,26 +11,28 @@ var reactBroadcast = require('@flopflip/react-broadcast');
 var launchdarklyAdapter = require('@flopflip/launchdarkly-adapter');
 require('react');
 require('react-router-dom');
-require('@babel/runtime-corejs3/helpers/defineProperty');
-require('@emotion/styled/base');
-require('@babel/runtime-corejs3/core-js-stable/instance/find');
-require('@babel/runtime-corejs3/core-js-stable/instance/includes');
-require('@babel/runtime-corejs3/core-js-stable/array/is-array');
+require('@commercetools-frontend/constants');
 require('@babel/runtime-corejs3/core-js-stable/object/keys');
 require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
-require('@babel/runtime-corejs3/core-js-stable/instance/filter');
 require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
 require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
 require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
 require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
 require('@babel/runtime-corejs3/core-js-stable/object/define-property');
+require('@babel/runtime-corejs3/helpers/defineProperty');
+require('@emotion/styled/base');
+require('@babel/runtime-corejs3/core-js-stable/instance/find');
+require('@babel/runtime-corejs3/core-js-stable/instance/includes');
+require('@babel/runtime-corejs3/core-js-stable/array/is-array');
+require('@babel/runtime-corejs3/core-js-stable/instance/map');
+require('@babel/runtime-corejs3/core-js-stable/instance/filter');
 require('@emotion/react');
 require('@commercetools-frontend/application-components');
-require('@commercetools-frontend/constants');
 require('@commercetools-frontend/i18n');
 require('@commercetools-frontend/react-notifications');
 require('@commercetools-frontend/sentry');
 require('@babel/runtime-corejs3/core-js-stable/url');
+require('@babel/runtime-corejs3/helpers/slicedToArray');
 require('@babel/runtime-corejs3/core-js-stable/set');
 require('@commercetools-uikit/design-system');
 require('@commercetools-uikit/spacings');
@@ -40,7 +42,6 @@ require('@commercetools-uikit/icons');
 require('./location-c835b8df.cjs.dev.js');
 require('@emotion/react/jsx-runtime');
 require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
-require('@babel/runtime-corejs3/core-js-stable/instance/map');
 require('memoize-one');
 require('react-select');
 require('@commercetools-uikit/accessible-hidden');
@@ -59,7 +60,6 @@ require('@flopflip/combine-adapters');
 require('@flopflip/http-adapter');
 require('@flopflip/types');
 require('react-redux');
-require('@babel/runtime-corejs3/helpers/slicedToArray');
 require('@babel/runtime-corejs3/core-js-stable/instance/starts-with');
 require('@babel/runtime-corejs3/core-js-stable/reflect/construct');
 require('@babel/runtime-corejs3/helpers/classCallCheck');
@@ -85,6 +85,7 @@ require('redux-thunk');
 require('@commercetools-frontend/notifications');
 require('@commercetools-frontend/sdk');
 require('redux-logger');
+require('tiny-invariant');
 
 
 
@@ -108,8 +109,8 @@ exports.getPreviousProjectKey = dist_commercetoolsFrontendApplicationShell.getPr
 exports.setupGlobalErrorListener = dist_commercetoolsFrontendApplicationShell.setupGlobalErrorListener;
 exports.useRoutesCreator = dist_commercetoolsFrontendApplicationShell.useRoutesCreator;
 exports.version = dist_commercetoolsFrontendApplicationShell.version;
-exports.RouteCatchAll = index.RouteCatchAll;
-exports.applyDefaultMiddlewares = index.applyDefaultMiddlewares;
+exports.RouteCatchAll = applicationEntryPoint.RouteCatchAll;
+exports.applyDefaultMiddlewares = applicationEntryPoint.applyDefaultMiddlewares;
 exports.REGIONS = oidc.REGIONS;
 Object.defineProperty(exports, 'buildApiUrl', {
 	enumerable: true,

package/dist/commercetools-frontend-application-shell.cjs.prod.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var dist_commercetoolsFrontendApplicationShell = require('./index-ce507805.cjs.prod.js');
-var index = require('./index-245e2980.cjs.prod.js');
+var dist_commercetoolsFrontendApplicationShell = require('./index-fc58c6bb.cjs.prod.js');
+var applicationEntryPoint = require('./application-entry-point-516fd72c.cjs.prod.js');
 var oidc = require('./oidc-0cba182b.cjs.prod.js');
 var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
 var ssr = require('@commercetools-frontend/application-config/ssr');
@@ -11,26 +11,28 @@ var reactBroadcast = require('@flopflip/react-broadcast');
 var launchdarklyAdapter = require('@flopflip/launchdarkly-adapter');
 require('react');
 require('react-router-dom');
-require('@babel/runtime-corejs3/helpers/defineProperty');
-require('@emotion/styled/base');
-require('@babel/runtime-corejs3/core-js-stable/instance/find');
-require('@babel/runtime-corejs3/core-js-stable/instance/includes');
-require('@babel/runtime-corejs3/core-js-stable/array/is-array');
+require('@commercetools-frontend/constants');
 require('@babel/runtime-corejs3/core-js-stable/object/keys');
 require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
-require('@babel/runtime-corejs3/core-js-stable/instance/filter');
 require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
 require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
 require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
 require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
 require('@babel/runtime-corejs3/core-js-stable/object/define-property');
+require('@babel/runtime-corejs3/helpers/defineProperty');
+require('@emotion/styled/base');
+require('@babel/runtime-corejs3/core-js-stable/instance/find');
+require('@babel/runtime-corejs3/core-js-stable/instance/includes');
+require('@babel/runtime-corejs3/core-js-stable/array/is-array');
+require('@babel/runtime-corejs3/core-js-stable/instance/map');
+require('@babel/runtime-corejs3/core-js-stable/instance/filter');
 require('@emotion/react');
 require('@commercetools-frontend/application-components');
-require('@commercetools-frontend/constants');
 require('@commercetools-frontend/i18n');
 require('@commercetools-frontend/react-notifications');
 require('@commercetools-frontend/sentry');
 require('@babel/runtime-corejs3/core-js-stable/url');
+require('@babel/runtime-corejs3/helpers/slicedToArray');
 require('@babel/runtime-corejs3/core-js-stable/set');
 require('@commercetools-uikit/design-system');
 require('@commercetools-uikit/spacings');
@@ -40,7 +42,6 @@ require('@commercetools-uikit/icons');
 require('./location-537e0660.cjs.prod.js');
 require('@emotion/react/jsx-runtime');
 require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
-require('@babel/runtime-corejs3/core-js-stable/instance/map');
 require('memoize-one');
 require('react-select');
 require('@commercetools-uikit/accessible-hidden');
@@ -59,7 +60,6 @@ require('@flopflip/combine-adapters');
 require('@flopflip/http-adapter');
 require('@flopflip/types');
 require('react-redux');
-require('@babel/runtime-corejs3/helpers/slicedToArray');
 require('@babel/runtime-corejs3/core-js-stable/instance/starts-with');
 require('@babel/runtime-corejs3/core-js-stable/reflect/construct');
 require('@babel/runtime-corejs3/helpers/classCallCheck');
@@ -85,6 +85,7 @@ require('redux-thunk');
 require('@commercetools-frontend/notifications');
 require('@commercetools-frontend/sdk');
 require('redux-logger');
+require('tiny-invariant');
 
 
 
@@ -108,8 +109,8 @@ exports.getPreviousProjectKey = dist_commercetoolsFrontendApplicationShell.getPr
 exports.setupGlobalErrorListener = dist_commercetoolsFrontendApplicationShell.setupGlobalErrorListener;
 exports.useRoutesCreator = dist_commercetoolsFrontendApplicationShell.useRoutesCreator;
 exports.version = dist_commercetoolsFrontendApplicationShell.version;
-exports.RouteCatchAll = index.RouteCatchAll;
-exports.applyDefaultMiddlewares = index.applyDefaultMiddlewares;
+exports.RouteCatchAll = applicationEntryPoint.RouteCatchAll;
+exports.applyDefaultMiddlewares = applicationEntryPoint.applyDefaultMiddlewares;
 exports.REGIONS = oidc.REGIONS;
 Object.defineProperty(exports, 'buildApiUrl', {
 	enumerable: true,

package/dist/commercetools-frontend-application-shell.esm.js

@@ -1,5 +1,5 @@
-export { e as ApplicationPageTitle, A as ApplicationShell, d as ApplicationShellProvider, C as ConfigureIntlProvider, f as CustomViewShell, i as ErrorApologizer, h as FetchUser, I as InjectReducers, o as PERFORMANCE_MARKS, l as ProtectedRoute, R as RedirectToLogin, j as RedirectToLogout, S as SetupFlopFlipProvider, m as SuspendedProtectedRoute, k as SuspendedRoute, g as getBrowserLocale, n as getPreviousProjectKey, s as setupGlobalErrorListener, u as useRoutesCreator, v as version } from './index-ac7ed4f7.esm.js';
-export { R as RouteCatchAll, a as applyDefaultMiddlewares } from './index-86039df7.esm.js';
+export { e as ApplicationPageTitle, A as ApplicationShell, d as ApplicationShellProvider, C as ConfigureIntlProvider, f as CustomViewShell, i as ErrorApologizer, h as FetchUser, I as InjectReducers, o as PERFORMANCE_MARKS, l as ProtectedRoute, R as RedirectToLogin, j as RedirectToLogout, S as SetupFlopFlipProvider, m as SuspendedProtectedRoute, k as SuspendedRoute, g as getBrowserLocale, n as getPreviousProjectKey, s as setupGlobalErrorListener, u as useRoutesCreator, v as version } from './index-177f89cf.esm.js';
+export { R as RouteCatchAll, a as applyDefaultMiddlewares } from './application-entry-point-e20cafdb.esm.js';
 export { R as REGIONS } from './oidc-cb344fae.esm.js';
 export { buildApiUrl, createApolloClient, createApolloContextForProxyForwardTo, createHttpClientOptions, executeHttpClientRequest, getMcApiUrl, selectProjectKeyFromUrl, selectUserId, useMcLazyQuery, useMcMutation, useMcQuery } from '@commercetools-frontend/application-shell-connectors';
 export { entryPointUriPathToPermissionKeys, entryPointUriPathToResourceAccesses } from '@commercetools-frontend/application-config/ssr';
@@ -7,26 +7,28 @@ export { ConfigureFlopFlip, ReconfigureFlopFlip, ToggleFeature, branchOnFeatureT
 export { adapter as ldAdapter } from '@flopflip/launchdarkly-adapter';
 import 'react';
 import 'react-router-dom';
-import '@babel/runtime-corejs3/helpers/defineProperty';
-import '@emotion/styled/base';
-import '@babel/runtime-corejs3/core-js-stable/instance/find';
-import '@babel/runtime-corejs3/core-js-stable/instance/includes';
-import '@babel/runtime-corejs3/core-js-stable/array/is-array';
+import '@commercetools-frontend/constants';
 import '@babel/runtime-corejs3/core-js-stable/object/keys';
 import '@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols';
-import '@babel/runtime-corejs3/core-js-stable/instance/filter';
 import '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor';
 import '@babel/runtime-corejs3/core-js-stable/instance/for-each';
 import '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors';
 import '@babel/runtime-corejs3/core-js-stable/object/define-properties';
 import '@babel/runtime-corejs3/core-js-stable/object/define-property';
+import '@babel/runtime-corejs3/helpers/defineProperty';
+import '@emotion/styled/base';
+import '@babel/runtime-corejs3/core-js-stable/instance/find';
+import '@babel/runtime-corejs3/core-js-stable/instance/includes';
+import '@babel/runtime-corejs3/core-js-stable/array/is-array';
+import '@babel/runtime-corejs3/core-js-stable/instance/map';
+import '@babel/runtime-corejs3/core-js-stable/instance/filter';
 import '@emotion/react';
 import '@commercetools-frontend/application-components';
-import '@commercetools-frontend/constants';
 import '@commercetools-frontend/i18n';
 import '@commercetools-frontend/react-notifications';
 import '@commercetools-frontend/sentry';
 import '@babel/runtime-corejs3/core-js-stable/url';
+import '@babel/runtime-corejs3/helpers/slicedToArray';
 import '@babel/runtime-corejs3/core-js-stable/set';
 import '@commercetools-uikit/design-system';
 import '@commercetools-uikit/spacings';
@@ -36,7 +38,6 @@ import '@commercetools-uikit/icons';
 import './location-f21dbc25.esm.js';
 import '@emotion/react/jsx-runtime';
 import '@babel/runtime-corejs3/helpers/objectWithoutProperties';
-import '@babel/runtime-corejs3/core-js-stable/instance/map';
 import 'memoize-one';
 import 'react-select';
 import '@commercetools-uikit/accessible-hidden';
@@ -55,7 +56,6 @@ import '@flopflip/combine-adapters';
 import '@flopflip/http-adapter';
 import '@flopflip/types';
 import 'react-redux';
-import '@babel/runtime-corejs3/helpers/slicedToArray';
 import '@babel/runtime-corejs3/core-js-stable/instance/starts-with';
 import '@babel/runtime-corejs3/core-js-stable/reflect/construct';
 import '@babel/runtime-corejs3/helpers/classCallCheck';
@@ -81,3 +81,4 @@ import 'redux-thunk';
 import '@commercetools-frontend/notifications';
 import '@commercetools-frontend/sdk';
 import 'redux-logger';
+import 'tiny-invariant';