@commercetools-frontend/application-shell 20.10.6 → 20.12.1

package/dist/{index-f012b7bd.cjs.prod.js → index-473958c5.cjs.prod.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var applicationEntryPoint = require('./application-entry-point-9247fc63.cjs.prod.js');
+var applicationEntryPoint = require('./application-entry-point-aa870890.cjs.prod.js');
 var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
 var _styled = require('@emotion/styled/base');
 var _pt = require('prop-types');
@@ -1856,8 +1856,10 @@ var UserSettingsMenuBody = function UserSettingsMenuBody(props) {
           })]
         })
       }), applicationsAppBarMenu === null || applicationsAppBarMenu === void 0 ? void 0 : _mapInstanceProperty__default["default"](applicationsAppBarMenu).call(applicationsAppBarMenu, function (menu) {
+        var _menu$featureToggle;
+
         return jsxRuntime.jsx(OptionalFeatureToggle, {
-          featureToggle: menu.featureToggle,
+          featureToggle: (_menu$featureToggle = menu.featureToggle) !== null && _menu$featureToggle !== void 0 ? _menu$featureToggle : undefined,
           children: jsxRuntime.jsx(reactRouterDom.Link, {
             css: getUserSettingsMenuItemLinkStyles(),
             to: "/account/".concat(menu.uriPath),
@@ -2291,7 +2293,9 @@ var _ref2$1 = {
 } ;
 
 var AppBar = function AppBar(props) {
-  var previousProjectKey = getPreviousProjectKey(props.user && props.user.defaultProjectKey);
+  var _props$user$defaultPr, _props$user;
+
+  var previousProjectKey = getPreviousProjectKey((_props$user$defaultPr = (_props$user = props.user) === null || _props$user === void 0 ? void 0 : _props$user.defaultProjectKey) !== null && _props$user$defaultPr !== void 0 ? _props$user$defaultPr : undefined);
   return jsxRuntime.jsxs("div", {
     css: /*#__PURE__*/react$2.css("box-shadow:", designSystem.customProperties.shadow1, ";min-height:43px;position:relative;width:100%;z-index:20000;display:flex;align-items:center;justify-content:space-between;" + ("" ), "" ),
     "data-test": "top-navigation",
@@ -2431,27 +2435,25 @@ var LocaleSwitcher = function LocaleSwitcher(props) {
 LocaleSwitcher.propTypes = {};
 
 var ProjectNotFound = /*#__PURE__*/react.lazy(function () {
-  return Promise.resolve().then(function () { return require('./project-not-found-0baa83dc.cjs.prod.js'
+  return Promise.resolve().then(function () { return require('./project-not-found-6bdfc28d.cjs.prod.js'
   /* webpackChunkName: "project-not-found" */
   ); });
 });
 
 var ProjectExpired = /*#__PURE__*/react.lazy(function () {
-  return Promise.resolve().then(function () { return require('./project-expired-0c4726a5.cjs.prod.js'
+  return Promise.resolve().then(function () { return require('./project-expired-a0163148.cjs.prod.js'
   /* webpackChunkName: "project-expired" */
   ); });
 });
 
 var ProjectNotInitialized = /*#__PURE__*/react.lazy(function () {
-  return Promise.resolve().then(function () { return require('./project-not-initialized-429473b1.cjs.prod.js'
+  return Promise.resolve().then(function () { return require('./project-not-initialized-e07d2b6b.cjs.prod.js'
   /* webpackChunkName: "project-not-initialized" */
   ); });
 });
 
 var RedirectToProjectCreate = function RedirectToProjectCreate() {
-  var servedByProxy = applicationShellConnectors.useApplicationContext(function (context) {
-    return context.environment.servedByProxy;
-  });
+  var servedByProxy = applicationEntryPoint.useIsServedByProxy();
   /**
    * NOTE:
    *   This looks a bit unusual: redirecting in render.
@@ -2492,7 +2494,7 @@ var RedirectToProjectCreate = function RedirectToProjectCreate() {
 RedirectToProjectCreate.displayName = 'RedirectToProjectCreate';
 
 var ProjectSuspended = /*#__PURE__*/react.lazy(function () {
-  return Promise.resolve().then(function () { return require('./project-suspended-9bc132ab.cjs.prod.js'
+  return Promise.resolve().then(function () { return require('./project-suspended-08625b77.cjs.prod.js'
   /* webpackChunkName: "project-suspended" */
   ); });
 });
@@ -2594,6 +2596,8 @@ var ProjectContainer = function ProjectContainer(props) {
           return jsxRuntime.jsx(ProjectDataLocale, {
             locales: project.languages,
             children: function children(_ref2) {
+              var _project$expiry$daysL;
+
               var locale = _ref2.locale,
                   setProjectDataLocale = _ref2.setProjectDataLocale;
               return jsxRuntime.jsx(applicationShellConnectors.ApplicationContextProvider, {
@@ -2602,7 +2606,7 @@ var ProjectContainer = function ProjectContainer(props) {
                 projectDataLocale: locale,
                 environment: props.environment,
                 children: jsxRuntime.jsxs(jsxRuntime.Fragment, {
-                  children: [shouldShowNotificationForTrialExpired(project.expiry.daysLeft) && jsxRuntime.jsx(reactNotifications.Notifier, {
+                  children: [shouldShowNotificationForTrialExpired((_project$expiry$daysL = project.expiry.daysLeft) !== null && _project$expiry$daysL !== void 0 ? _project$expiry$daysL : undefined) && jsxRuntime.jsx(reactNotifications.Notifier, {
                     kind: "warning",
                     domain: constants.DOMAINS.GLOBAL,
                     text: intl.formatMessage(messages$1.trialDaysLeft, {
@@ -2646,9 +2650,7 @@ var getDefaultedFeatureToggles = function getDefaultedFeatureToggles(allFeatureT
 };
 
 var useAllMenuFeatureToggles = function useAllMenuFeatureToggles() {
-  var servedByProxy = applicationShellConnectors.useApplicationContext(function (applicationContext) {
-    return applicationContext.environment.servedByProxy;
-  });
+  var servedByProxy = applicationEntryPoint.useIsServedByProxy();
   var mcProxyApiUrl = applicationShellConnectors.useApplicationContext(function (applicationContext) {
     return applicationContext.environment.mcProxyApiUrl;
   });
@@ -3426,7 +3428,7 @@ MenuLabel.propTypes = {
 };
 
 var ApplicationMenu = function ApplicationMenu(props) {
-  var _context5, _context6, _context7;
+  var _context5, _props$menu$featureTo, _props$menu$actionRig, _props$menu$dataFence, _context6, _context7;
 
   var isMainMenuRouteActive = Boolean(reactRouterDom.matchPath(props.location.pathname, {
     path: _concatInstanceProperty__default["default"](_context5 = "/".concat(props.projectKey, "/")).call(_context5, props.menu.uriPath),
@@ -3451,10 +3453,10 @@ var ApplicationMenu = function ApplicationMenu(props) {
   return jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [props.menu.shouldRenderDivider && jsxRuntime.jsx(MenuItemDivider, {}), jsxRuntime.jsx(RestrictedMenuItem, {
       keyOfMenuItem: props.menu.key,
-      featureToggle: props.menu.featureToggle,
+      featureToggle: (_props$menu$featureTo = props.menu.featureToggle) !== null && _props$menu$featureTo !== void 0 ? _props$menu$featureTo : undefined,
       permissions: props.menu.permissions,
-      actionRights: props.menu.actionRights,
-      dataFences: props.menu.dataFences,
+      actionRights: (_props$menu$actionRig = props.menu.actionRights) !== null && _props$menu$actionRig !== void 0 ? _props$menu$actionRig : undefined,
+      dataFences: (_props$menu$dataFence = props.menu.dataFences) !== null && _props$menu$dataFence !== void 0 ? _props$menu$dataFence : undefined,
       projectPermissions: props.projectPermissions,
       menuVisibilities: props.menuVisibilities,
       namesOfMenuVisibilities: namesOfMenuVisibilitiesOfAllSubmenus,
@@ -3494,14 +3496,14 @@ var ApplicationMenu = function ApplicationMenu(props) {
           isActive: props.isActive,
           isExpanded: props.isMenuOpen,
           children: hasSubmenu ? _mapInstanceProperty__default["default"](_context7 = props.menu.submenu).call(_context7, function (submenu) {
-            var _context8, _context9;
+            var _context8, _submenu$featureToggl, _submenu$actionRights, _submenu$dataFences, _context9;
 
             return jsxRuntime.jsx(RestrictedMenuItem, {
               keyOfMenuItem: submenu.key,
-              featureToggle: submenu.featureToggle,
+              featureToggle: (_submenu$featureToggl = submenu.featureToggle) !== null && _submenu$featureToggl !== void 0 ? _submenu$featureToggl : undefined,
               permissions: submenu.permissions,
-              actionRights: submenu.actionRights,
-              dataFences: submenu.dataFences,
+              actionRights: (_submenu$actionRights = submenu.actionRights) !== null && _submenu$actionRights !== void 0 ? _submenu$actionRights : undefined,
+              dataFences: (_submenu$dataFences = submenu.dataFences) !== null && _submenu$dataFences !== void 0 ? _submenu$dataFences : undefined,
               projectPermissions: props.projectPermissions,
               menuVisibilities: props.menuVisibilities,
               namesOfMenuVisibilities: submenu.menuVisibility ? [submenu.menuVisibility] : undefined,
@@ -3516,6 +3518,7 @@ var ApplicationMenu = function ApplicationMenu(props) {
                     onClick: props.onMenuItemClick,
                     children: jsxRuntime.jsx(MenuLabel, {
                       labelAllLocales: submenu.labelAllLocales,
+                      defaultLabel: submenu.defaultLabel,
                       applicationLocale: props.applicationLocale
                     })
                   })
@@ -3705,7 +3708,7 @@ var pimIndexerStates = {
 };
 
 var QuickAccess = /*#__PURE__*/react.lazy(function () {
-  return Promise.resolve().then(function () { return require('./quick-access-821643e7.cjs.prod.js'
+  return Promise.resolve().then(function () { return require('./quick-access-0a31b56f.cjs.prod.js'
   /* webpackChunkName: "quick-access" */
   ); });
 });
@@ -3802,6 +3805,51 @@ var QuickAccessTrigger = function QuickAccessTrigger(props) {
 QuickAccessTrigger.propTypes = {};
 QuickAccessTrigger.displayName = 'QuickAccessTrigger';
 
+/**
+ * Get the "real" Merchant Center frontend URL to redirect the user
+ * to the login page.
+ * We use an explicit full URL so that if a user tries to access the
+ * Custom Applications directly to its domain, it will always redirect
+ * the user to the login page.
+ *
+ * To determine the "real" URL, we need to check if the current location
+ * is a Merchant Center domain, or if it's a custom user domain.
+ * For the latter, we can derive the URL from the Merchant Center API URL.
+ *
+ * A Merchant Center hostname is composed by the following parts:
+ *    https://<mc-prefix>.<region>.<provider>.<ct-domain>.<tld>
+ * We neeed to check if at least the first 4 parts (right-to-left) are
+ * the same.
+ */
+function getMcOrigin(mcApiUrl) {
+  var _context, _context2;
+
+  var actualWindow = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : window;
+  var mcApiUrlObject = new _URL__default["default"](mcApiUrl);
+
+  var _mcApiUrlObject$hostn = _reverseInstanceProperty__default["default"](_context = mcApiUrlObject.hostname.split('.')).call(_context),
+      _mcApiUrlObject$hostn2 = _slicedToArray(_mcApiUrlObject$hostn, 4),
+      tldMcApi = _mcApiUrlObject$hostn2[0],
+      ctDomainMcApi = _mcApiUrlObject$hostn2[1],
+      providerMcApi = _mcApiUrlObject$hostn2[2],
+      regionMcApi = _mcApiUrlObject$hostn2[3];
+
+  var _actualWindow$locatio = _reverseInstanceProperty__default["default"](_context2 = actualWindow.location.hostname.split('.')).call(_context2),
+      _actualWindow$locatio2 = _slicedToArray(_actualWindow$locatio, 4),
+      tldMc = _actualWindow$locatio2[0],
+      ctDomainMc = _actualWindow$locatio2[1],
+      providerMc = _actualWindow$locatio2[2],
+      regionMc = _actualWindow$locatio2[3];
+
+  var isMatching = tldMcApi === tldMc && ctDomainMcApi === ctDomainMc && providerMcApi === providerMc && regionMcApi === regionMc;
+
+  if (isMatching) {
+    return actualWindow.location.origin;
+  }
+
+  return mcApiUrlObject.origin.replace('mc-api', 'mc');
+}
+
 var generateAndCacheNonceWithState = function generateAndCacheNonceWithState(state) {
   var nonce = uuid.v4(); // We store additional information within the given `nonce`
   // to then retrieve it later when the IdP redirects back
@@ -3818,6 +3866,7 @@ var RedirectToLogin = function RedirectToLogin() {
   var _window$app$__DEVELOP, _window$app$__DEVELOP2;
 
   var location = reactRouterDom.useLocation();
+  var servedByProxy = applicationEntryPoint.useIsServedByProxy();
 
   if ((_window$app$__DEVELOP = window.app.__DEVELOPMENT__) !== null && _window$app$__DEVELOP !== void 0 && (_window$app$__DEVELOP2 = _window$app$__DEVELOP.oidc) !== null && _window$app$__DEVELOP2 !== void 0 && _window$app$__DEVELOP2.authorizeUrl) {
     var _window$app$__DEVELOP3, _window$app$__DEVELOP4, _window$app$__DEVELOP5, _window$app$__DEVELOP6, _window$app$__DEVELOP7, _window$app$__DEVELOP8;
@@ -3868,8 +3917,10 @@ var RedirectToLogin = function RedirectToLogin() {
     });
   }
 
+  var mcOrigin = servedByProxy ? getMcOrigin(window.app.mcApiUrl) : undefined;
   return jsxRuntime.jsx(Redirector, {
     to: "login",
+    origin: mcOrigin,
     location: location,
     queryParams: {
       reason: constants.LOGOUT_REASONS.UNAUTHORIZED,
@@ -3890,9 +3941,7 @@ var RedirectToLogout = function RedirectToLogout(props) {
   var _window$app$__DEVELOP, _window$app$__DEVELOP2, _props$reason;
 
   var location = reactRouterDom.useLocation();
-  var servedByProxy = applicationShellConnectors.useApplicationContext(function (context) {
-    return context.environment.servedByProxy;
-  });
+  var servedByProxy = applicationEntryPoint.useIsServedByProxy();
 
   if ((_window$app$__DEVELOP = window.app.__DEVELOPMENT__) !== null && _window$app$__DEVELOP !== void 0 && (_window$app$__DEVELOP2 = _window$app$__DEVELOP.oidc) !== null && _window$app$__DEVELOP2 !== void 0 && _window$app$__DEVELOP2.authorizeUrl) {
     // Remove the `sessionToken` from storage, so that the AppShell can initiate
@@ -3901,8 +3950,10 @@ var RedirectToLogout = function RedirectToLogout(props) {
     return jsxRuntime.jsx(RedirectToLogin, {});
   }
 
+  var mcOrigin = servedByProxy ? getMcOrigin(window.app.mcApiUrl) : undefined;
   return jsxRuntime.jsx(Redirector, {
     to: "logout",
+    origin: mcOrigin,
     location: location,
     queryParams: _objectSpread$1({
       reason: (_props$reason = props.reason) !== null && _props$reason !== void 0 ? _props$reason : constants.LOGOUT_REASONS.USER
@@ -4023,9 +4074,11 @@ var RestrictedApplication = function RestrictedApplication(props) {
         user: user,
         environment: applicationEnvironment,
         children: jsxRuntime.jsx(i18n.AsyncLocaleData, {
-          locale: user && user.language,
+          locale: user === null || user === void 0 ? void 0 : user.language,
           applicationMessages: props.applicationMessages,
           children: function children(_ref9) {
+            var _user$businessRole;
+
             var isLoadingLocaleData = _ref9.isLoading,
                 locale = _ref9.locale,
                 messages = _ref9.messages;
@@ -4043,13 +4096,13 @@ var RestrictedApplication = function RestrictedApplication(props) {
                 defaultFlags: props.defaultFeatureFlags,
                 children: jsxRuntime.jsxs(jsxRuntime.Fragment, {
                   children: [jsxRuntime.jsx(VersionTracker, {}), jsxRuntime.jsx(applicationEntryPoint.RequestsInFlightLoader, {}), jsxRuntime.jsx(sentry.SentryUserTracker, {
-                    user: user
+                    user: user !== null && user !== void 0 ? user : undefined
                   }), jsxRuntime.jsx(GtmUserTracker, {
                     user: user
                   }), jsxRuntime.jsx(GtmApplicationTracker, {
                     applicationName: applicationEnvironment.applicationName,
                     projectKey: projectKeyFromUrl,
-                    userBusinessRole: user === null || user === void 0 ? void 0 : user.businessRole
+                    userBusinessRole: (_user$businessRole = user === null || user === void 0 ? void 0 : user.businessRole) !== null && _user$businessRole !== void 0 ? _user$businessRole : undefined
                   }), jsxRuntime.jsxs("div", {
                     role: "application-layout",
                     css: _ref6,
@@ -4174,7 +4227,9 @@ var RestrictedApplication = function RestrictedApplication(props) {
                             exact: true,
                             path: "/",
                             render: function render() {
-                              var previousProjectKey = getPreviousProjectKey(user && user.defaultProjectKey);
+                              var _user$defaultProjectK;
+
+                              var previousProjectKey = getPreviousProjectKey((_user$defaultProjectK = user === null || user === void 0 ? void 0 : user.defaultProjectKey) !== null && _user$defaultProjectK !== void 0 ? _user$defaultProjectK : undefined);
                               /**
                                * NOTE:
                                *   Given the user has not been loaded a loading spinner is shown.