@commercetools-frontend/application-shell 22.14.3 → 22.15.0

package/dist/redirect-to-login-5e148cff.esm.js

@@ -0,0 +1,118 @@
+import { useEffect } from 'react';
+import { useLocation } from 'react-router-dom';
+import { v4 } from 'uuid';
+import { oidcStorage } from '@commercetools-frontend/application-shell-connectors';
+import { LOGOUT_REASONS } from '@commercetools-frontend/constants';
+import { trimLeadingAndTrailingSlashes, joinPaths } from '@commercetools-frontend/url-utils';
+import { b as buildOidcScope, a as OIDC_RESPONSE_TYPES } from './oidc-da8526e3.esm.js';
+import { u as useIsServedByProxy } from './use-is-served-by-proxy-77984220.esm.js';
+import { g as getMcOrigin } from './get-mc-origin-fecfee07.esm.js';
+import { u as useRedirector } from './redirector-54a03b75.esm.js';
+import '@babel/runtime-corejs3/core-js-stable/instance/concat';
+import '@babel/runtime-corejs3/core-js-stable/instance/map';
+import '@babel/runtime-corejs3/core-js-stable/instance/for-each';
+import '@babel/runtime-corejs3/helpers/slicedToArray';
+import '@babel/runtime-corejs3/core-js-stable/url';
+import '@babel/runtime-corejs3/core-js-stable/instance/reverse';
+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/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 'prop-types';
+import 'qss';
+
+const generateAndCacheNonceWithState = state => {
+  const nonce = v4();
+  // We store additional information within the given `nonce`
+  // to then retrieve it later when the IdP redirects back
+  // to our application. The URL will contain the `nonce` within
+  // the id_token and, once validated, we can retrieve and use
+  // the state object.
+  // https://auth0.com/docs/protocols/oauth2/oauth-state#how-to-use-the-parameter-to-restore-application-state
+  oidcStorage.setSessionState(nonce, state);
+  return nonce;
+};
+const RedirectToLogin = () => {
+  const location = useLocation();
+  const servedByProxy = useIsServedByProxy();
+  const redirector = useRedirector();
+  useEffect(() => {
+    var _window$app$__DEVELOP;
+    if ((_window$app$__DEVELOP = window.app.__DEVELOPMENT__) !== null && _window$app$__DEVELOP !== void 0 && (_window$app$__DEVELOP = _window$app$__DEVELOP.oidc) !== null && _window$app$__DEVELOP !== void 0 && _window$app$__DEVELOP.authorizeUrl) {
+      var _window$app$__DEVELOP2, _window$app$__DEVELOP3, _window$app$__DEVELOP4, _window$app$__DEVELOP5, _window$app$__DEVELOP6;
+      // Remove the `sessionToken` from storage, so that the AppShell can initiate
+      // a new authorization flow.
+      oidcStorage.clearSession();
+
+      // We pick the project key from local storage. This assumes that the value
+      // as been previously set when the application starts up.
+      // This is necessary to allow switching projects and triggering a new login.
+      const nextProjectKey = oidcStorage.getActiveProjectKey();
+
+      // According to the OIDC spec, the `state` parameter is recommended to be sent
+      // to the authorization server to help mitigating Cross-Site Request Forgery.
+      // https://openid.net/specs/openid-connect-core-1_0.html#AuthRequest
+      // Using `state` or `nonce` is very similar but with subtle differences.
+      // Here we follow the approach described by Auth0 on how to use both, where
+      // we generate a `nonce`, store it in session storage together with some state,
+      // and send it to the authorization server as the `state` parameter.
+      // https://auth0.com/docs/protocols/oauth2/redirect-users
+      // Additionally, we still send the `nonce` parameter as well.
+      const sessionId = generateAndCacheNonceWithState({
+        applicationId: window.app.applicationId,
+        // Store query parameters to be used after the callback redirect
+        query: {
+          redirectTo: nextProjectKey ? "/".concat(nextProjectKey) : '/'
+        }
+      });
+      const requestedScope = buildOidcScope({
+        projectKey: nextProjectKey !== null && nextProjectKey !== void 0 ? nextProjectKey : undefined,
+        oAuthScopes: (_window$app$__DEVELOP2 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP2 === void 0 || (_window$app$__DEVELOP2 = _window$app$__DEVELOP2.oidc) === null || _window$app$__DEVELOP2 === void 0 ? void 0 : _window$app$__DEVELOP2.oAuthScopes,
+        additionalOAuthScopes: (_window$app$__DEVELOP3 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP3 === void 0 || (_window$app$__DEVELOP3 = _window$app$__DEVELOP3.oidc) === null || _window$app$__DEVELOP3 === void 0 ? void 0 : _window$app$__DEVELOP3.additionalOAuthScopes,
+        teamId: (_window$app$__DEVELOP4 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP4 === void 0 || (_window$app$__DEVELOP4 = _window$app$__DEVELOP4.oidc) === null || _window$app$__DEVELOP4 === void 0 ? void 0 : _window$app$__DEVELOP4.teamId,
+        applicationId: (_window$app$__DEVELOP5 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP5 === void 0 || (_window$app$__DEVELOP5 = _window$app$__DEVELOP5.oidc) === null || _window$app$__DEVELOP5 === void 0 ? void 0 : _window$app$__DEVELOP5.applicationId
+      });
+
+      // Store session scopes, to be able to detect if requested scopes changed
+      // in the application config and invalidate the session.
+      // This is only valid for local development.
+      oidcStorage.setSessionScope(requestedScope);
+      redirector({
+        to: '',
+        origin: (_window$app$__DEVELOP6 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP6 === void 0 || (_window$app$__DEVELOP6 = _window$app$__DEVELOP6.oidc) === null || _window$app$__DEVELOP6 === void 0 ? void 0 : _window$app$__DEVELOP6.authorizeUrl,
+        location: location,
+        queryParams: {
+          reason: LOGOUT_REASONS.UNAUTHORIZED,
+          // Query parameters for OIDC-lik workflow.
+          client_id: window.app.applicationId,
+          response_type: OIDC_RESPONSE_TYPES.ID_TOKEN,
+          scope: requestedScope,
+          state: sessionId,
+          nonce: sessionId
+        }
+      });
+      return;
+    }
+    const mcOrigin = servedByProxy ? getMcOrigin(window.app.mcApiUrl) : undefined;
+    redirector({
+      to: 'login',
+      origin: mcOrigin,
+      location: location,
+      queryParams: {
+        reason: LOGOUT_REASONS.UNAUTHORIZED,
+        redirectTo: trimLeadingAndTrailingSlashes(joinPaths(window.location.origin, location.pathname))
+      }
+    });
+
+    // Only execute once!
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  return null;
+};
+RedirectToLogin.displayName = 'RedirectToLogin';
+
+export { RedirectToLogin as default };

package/dist/redirect-to-login-d2287ced.cjs.dev.js

@@ -0,0 +1,120 @@
+'use strict';
+
+var react = require('react');
+var reactRouterDom = require('react-router-dom');
+var uuid = require('uuid');
+var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
+var constants = require('@commercetools-frontend/constants');
+var urlUtils = require('@commercetools-frontend/url-utils');
+var oidc = require('./oidc-7c48215c.cjs.dev.js');
+var useIsServedByProxy = require('./use-is-served-by-proxy-ed411f45.cjs.dev.js');
+var getMcOrigin = require('./get-mc-origin-a86dff20.cjs.dev.js');
+var redirector = require('./redirector-fcdeaba7.cjs.dev.js');
+require('@babel/runtime-corejs3/core-js-stable/instance/concat');
+require('@babel/runtime-corejs3/core-js-stable/instance/map');
+require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
+require('@babel/runtime-corejs3/helpers/slicedToArray');
+require('@babel/runtime-corejs3/core-js-stable/url');
+require('@babel/runtime-corejs3/core-js-stable/instance/reverse');
+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/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('prop-types');
+require('qss');
+
+const generateAndCacheNonceWithState = state => {
+  const nonce = uuid.v4();
+  // We store additional information within the given `nonce`
+  // to then retrieve it later when the IdP redirects back
+  // to our application. The URL will contain the `nonce` within
+  // the id_token and, once validated, we can retrieve and use
+  // the state object.
+  // https://auth0.com/docs/protocols/oauth2/oauth-state#how-to-use-the-parameter-to-restore-application-state
+  applicationShellConnectors.oidcStorage.setSessionState(nonce, state);
+  return nonce;
+};
+const RedirectToLogin = () => {
+  const location = reactRouterDom.useLocation();
+  const servedByProxy = useIsServedByProxy.useIsServedByProxy();
+  const redirector$1 = redirector.useRedirector();
+  react.useEffect(() => {
+    var _window$app$__DEVELOP;
+    if ((_window$app$__DEVELOP = window.app.__DEVELOPMENT__) !== null && _window$app$__DEVELOP !== void 0 && (_window$app$__DEVELOP = _window$app$__DEVELOP.oidc) !== null && _window$app$__DEVELOP !== void 0 && _window$app$__DEVELOP.authorizeUrl) {
+      var _window$app$__DEVELOP2, _window$app$__DEVELOP3, _window$app$__DEVELOP4, _window$app$__DEVELOP5, _window$app$__DEVELOP6;
+      // Remove the `sessionToken` from storage, so that the AppShell can initiate
+      // a new authorization flow.
+      applicationShellConnectors.oidcStorage.clearSession();
+
+      // We pick the project key from local storage. This assumes that the value
+      // as been previously set when the application starts up.
+      // This is necessary to allow switching projects and triggering a new login.
+      const nextProjectKey = applicationShellConnectors.oidcStorage.getActiveProjectKey();
+
+      // According to the OIDC spec, the `state` parameter is recommended to be sent
+      // to the authorization server to help mitigating Cross-Site Request Forgery.
+      // https://openid.net/specs/openid-connect-core-1_0.html#AuthRequest
+      // Using `state` or `nonce` is very similar but with subtle differences.
+      // Here we follow the approach described by Auth0 on how to use both, where
+      // we generate a `nonce`, store it in session storage together with some state,
+      // and send it to the authorization server as the `state` parameter.
+      // https://auth0.com/docs/protocols/oauth2/redirect-users
+      // Additionally, we still send the `nonce` parameter as well.
+      const sessionId = generateAndCacheNonceWithState({
+        applicationId: window.app.applicationId,
+        // Store query parameters to be used after the callback redirect
+        query: {
+          redirectTo: nextProjectKey ? "/".concat(nextProjectKey) : '/'
+        }
+      });
+      const requestedScope = oidc.buildOidcScope({
+        projectKey: nextProjectKey !== null && nextProjectKey !== void 0 ? nextProjectKey : undefined,
+        oAuthScopes: (_window$app$__DEVELOP2 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP2 === void 0 || (_window$app$__DEVELOP2 = _window$app$__DEVELOP2.oidc) === null || _window$app$__DEVELOP2 === void 0 ? void 0 : _window$app$__DEVELOP2.oAuthScopes,
+        additionalOAuthScopes: (_window$app$__DEVELOP3 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP3 === void 0 || (_window$app$__DEVELOP3 = _window$app$__DEVELOP3.oidc) === null || _window$app$__DEVELOP3 === void 0 ? void 0 : _window$app$__DEVELOP3.additionalOAuthScopes,
+        teamId: (_window$app$__DEVELOP4 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP4 === void 0 || (_window$app$__DEVELOP4 = _window$app$__DEVELOP4.oidc) === null || _window$app$__DEVELOP4 === void 0 ? void 0 : _window$app$__DEVELOP4.teamId,
+        applicationId: (_window$app$__DEVELOP5 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP5 === void 0 || (_window$app$__DEVELOP5 = _window$app$__DEVELOP5.oidc) === null || _window$app$__DEVELOP5 === void 0 ? void 0 : _window$app$__DEVELOP5.applicationId
+      });
+
+      // Store session scopes, to be able to detect if requested scopes changed
+      // in the application config and invalidate the session.
+      // This is only valid for local development.
+      applicationShellConnectors.oidcStorage.setSessionScope(requestedScope);
+      redirector$1({
+        to: '',
+        origin: (_window$app$__DEVELOP6 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP6 === void 0 || (_window$app$__DEVELOP6 = _window$app$__DEVELOP6.oidc) === null || _window$app$__DEVELOP6 === void 0 ? void 0 : _window$app$__DEVELOP6.authorizeUrl,
+        location: location,
+        queryParams: {
+          reason: constants.LOGOUT_REASONS.UNAUTHORIZED,
+          // Query parameters for OIDC-lik workflow.
+          client_id: window.app.applicationId,
+          response_type: oidc.OIDC_RESPONSE_TYPES.ID_TOKEN,
+          scope: requestedScope,
+          state: sessionId,
+          nonce: sessionId
+        }
+      });
+      return;
+    }
+    const mcOrigin = servedByProxy ? getMcOrigin.getMcOrigin(window.app.mcApiUrl) : undefined;
+    redirector$1({
+      to: 'login',
+      origin: mcOrigin,
+      location: location,
+      queryParams: {
+        reason: constants.LOGOUT_REASONS.UNAUTHORIZED,
+        redirectTo: urlUtils.trimLeadingAndTrailingSlashes(urlUtils.joinPaths(window.location.origin, location.pathname))
+      }
+    });
+
+    // Only execute once!
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  return null;
+};
+RedirectToLogin.displayName = 'RedirectToLogin';
+
+exports["default"] = RedirectToLogin;

package/dist/redirect-to-login-e4f2ca07.cjs.prod.js

@@ -0,0 +1,120 @@
+'use strict';
+
+var react = require('react');
+var reactRouterDom = require('react-router-dom');
+var uuid = require('uuid');
+var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
+var constants = require('@commercetools-frontend/constants');
+var urlUtils = require('@commercetools-frontend/url-utils');
+var oidc = require('./oidc-b070ff6c.cjs.prod.js');
+var useIsServedByProxy = require('./use-is-served-by-proxy-845cace5.cjs.prod.js');
+var getMcOrigin = require('./get-mc-origin-8f7a578c.cjs.prod.js');
+var redirector = require('./redirector-15844d9b.cjs.prod.js');
+require('@babel/runtime-corejs3/core-js-stable/instance/concat');
+require('@babel/runtime-corejs3/core-js-stable/instance/map');
+require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
+require('@babel/runtime-corejs3/helpers/slicedToArray');
+require('@babel/runtime-corejs3/core-js-stable/url');
+require('@babel/runtime-corejs3/core-js-stable/instance/reverse');
+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/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('prop-types');
+require('qss');
+
+const generateAndCacheNonceWithState = state => {
+  const nonce = uuid.v4();
+  // We store additional information within the given `nonce`
+  // to then retrieve it later when the IdP redirects back
+  // to our application. The URL will contain the `nonce` within
+  // the id_token and, once validated, we can retrieve and use
+  // the state object.
+  // https://auth0.com/docs/protocols/oauth2/oauth-state#how-to-use-the-parameter-to-restore-application-state
+  applicationShellConnectors.oidcStorage.setSessionState(nonce, state);
+  return nonce;
+};
+const RedirectToLogin = () => {
+  const location = reactRouterDom.useLocation();
+  const servedByProxy = useIsServedByProxy.useIsServedByProxy();
+  const redirector$1 = redirector.useRedirector();
+  react.useEffect(() => {
+    var _window$app$__DEVELOP;
+    if ((_window$app$__DEVELOP = window.app.__DEVELOPMENT__) !== null && _window$app$__DEVELOP !== void 0 && (_window$app$__DEVELOP = _window$app$__DEVELOP.oidc) !== null && _window$app$__DEVELOP !== void 0 && _window$app$__DEVELOP.authorizeUrl) {
+      var _window$app$__DEVELOP2, _window$app$__DEVELOP3, _window$app$__DEVELOP4, _window$app$__DEVELOP5, _window$app$__DEVELOP6;
+      // Remove the `sessionToken` from storage, so that the AppShell can initiate
+      // a new authorization flow.
+      applicationShellConnectors.oidcStorage.clearSession();
+
+      // We pick the project key from local storage. This assumes that the value
+      // as been previously set when the application starts up.
+      // This is necessary to allow switching projects and triggering a new login.
+      const nextProjectKey = applicationShellConnectors.oidcStorage.getActiveProjectKey();
+
+      // According to the OIDC spec, the `state` parameter is recommended to be sent
+      // to the authorization server to help mitigating Cross-Site Request Forgery.
+      // https://openid.net/specs/openid-connect-core-1_0.html#AuthRequest
+      // Using `state` or `nonce` is very similar but with subtle differences.
+      // Here we follow the approach described by Auth0 on how to use both, where
+      // we generate a `nonce`, store it in session storage together with some state,
+      // and send it to the authorization server as the `state` parameter.
+      // https://auth0.com/docs/protocols/oauth2/redirect-users
+      // Additionally, we still send the `nonce` parameter as well.
+      const sessionId = generateAndCacheNonceWithState({
+        applicationId: window.app.applicationId,
+        // Store query parameters to be used after the callback redirect
+        query: {
+          redirectTo: nextProjectKey ? "/".concat(nextProjectKey) : '/'
+        }
+      });
+      const requestedScope = oidc.buildOidcScope({
+        projectKey: nextProjectKey !== null && nextProjectKey !== void 0 ? nextProjectKey : undefined,
+        oAuthScopes: (_window$app$__DEVELOP2 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP2 === void 0 || (_window$app$__DEVELOP2 = _window$app$__DEVELOP2.oidc) === null || _window$app$__DEVELOP2 === void 0 ? void 0 : _window$app$__DEVELOP2.oAuthScopes,
+        additionalOAuthScopes: (_window$app$__DEVELOP3 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP3 === void 0 || (_window$app$__DEVELOP3 = _window$app$__DEVELOP3.oidc) === null || _window$app$__DEVELOP3 === void 0 ? void 0 : _window$app$__DEVELOP3.additionalOAuthScopes,
+        teamId: (_window$app$__DEVELOP4 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP4 === void 0 || (_window$app$__DEVELOP4 = _window$app$__DEVELOP4.oidc) === null || _window$app$__DEVELOP4 === void 0 ? void 0 : _window$app$__DEVELOP4.teamId,
+        applicationId: (_window$app$__DEVELOP5 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP5 === void 0 || (_window$app$__DEVELOP5 = _window$app$__DEVELOP5.oidc) === null || _window$app$__DEVELOP5 === void 0 ? void 0 : _window$app$__DEVELOP5.applicationId
+      });
+
+      // Store session scopes, to be able to detect if requested scopes changed
+      // in the application config and invalidate the session.
+      // This is only valid for local development.
+      applicationShellConnectors.oidcStorage.setSessionScope(requestedScope);
+      redirector$1({
+        to: '',
+        origin: (_window$app$__DEVELOP6 = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP6 === void 0 || (_window$app$__DEVELOP6 = _window$app$__DEVELOP6.oidc) === null || _window$app$__DEVELOP6 === void 0 ? void 0 : _window$app$__DEVELOP6.authorizeUrl,
+        location: location,
+        queryParams: {
+          reason: constants.LOGOUT_REASONS.UNAUTHORIZED,
+          // Query parameters for OIDC-lik workflow.
+          client_id: window.app.applicationId,
+          response_type: oidc.OIDC_RESPONSE_TYPES.ID_TOKEN,
+          scope: requestedScope,
+          state: sessionId,
+          nonce: sessionId
+        }
+      });
+      return;
+    }
+    const mcOrigin = servedByProxy ? getMcOrigin.getMcOrigin(window.app.mcApiUrl) : undefined;
+    redirector$1({
+      to: 'login',
+      origin: mcOrigin,
+      location: location,
+      queryParams: {
+        reason: constants.LOGOUT_REASONS.UNAUTHORIZED,
+        redirectTo: urlUtils.trimLeadingAndTrailingSlashes(urlUtils.joinPaths(window.location.origin, location.pathname))
+      }
+    });
+
+    // Only execute once!
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  return null;
+};
+RedirectToLogin.displayName = 'RedirectToLogin';
+
+exports["default"] = RedirectToLogin;

package/dist/{redirect-to-logout-8cbbf5b3.cjs.dev.js → redirect-to-logout-a4bc80a6.cjs.dev.js}

@@ -10,13 +10,13 @@ var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/ob
 var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
 var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
 var reactRouterDom = require('react-router-dom');
-var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
 var constants = require('@commercetools-frontend/constants');
 var useIsServedByProxy = require('./use-is-served-by-proxy-ed411f45.cjs.dev.js');
 var getMcOrigin = require('./get-mc-origin-a86dff20.cjs.dev.js');
-var dist_commercetoolsFrontendApplicationShell = require('./index-0d0e6d8b.cjs.dev.js');
-var redirector = require('./redirector-5daa8baa.cjs.dev.js');
+var dist_commercetoolsFrontendApplicationShell = require('./index-97ddc7b1.cjs.dev.js');
+var redirector = require('./redirector-fcdeaba7.cjs.dev.js');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
+require('@commercetools-frontend/application-shell-connectors');
 require('@babel/runtime-corejs3/helpers/slicedToArray');
 require('@babel/runtime-corejs3/core-js-stable/url');
 require('@babel/runtime-corejs3/core-js-stable/instance/reverse');
@@ -107,9 +107,6 @@ const RedirectToLogout = props => {
   const location = reactRouterDom.useLocation();
   const servedByProxy = useIsServedByProxy.useIsServedByProxy();
   if ((_window$app$__DEVELOP = window.app.__DEVELOPMENT__) !== null && _window$app$__DEVELOP !== void 0 && (_window$app$__DEVELOP = _window$app$__DEVELOP.oidc) !== null && _window$app$__DEVELOP !== void 0 && _window$app$__DEVELOP.authorizeUrl) {
-    // Remove the `sessionToken` from storage, so that the AppShell can initiate
-    // a new authorization flow.
-    applicationShellConnectors.oidcStorage.clearSession();
     return jsxRuntime.jsx(dist_commercetoolsFrontendApplicationShell.RedirectToLogin, {});
   }
   const mcOrigin = servedByProxy ? getMcOrigin.getMcOrigin(window.app.mcApiUrl) : undefined;

package/dist/{redirect-to-logout-2418d058.cjs.prod.js → redirect-to-logout-cdcb00b1.cjs.prod.js}

@@ -10,13 +10,13 @@ var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/ob
 var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
 var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
 var reactRouterDom = require('react-router-dom');
-var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
 var constants = require('@commercetools-frontend/constants');
 var useIsServedByProxy = require('./use-is-served-by-proxy-845cace5.cjs.prod.js');
 var getMcOrigin = require('./get-mc-origin-8f7a578c.cjs.prod.js');
-var dist_commercetoolsFrontendApplicationShell = require('./index-c29f8aa0.cjs.prod.js');
-var redirector = require('./redirector-752b4efc.cjs.prod.js');
+var dist_commercetoolsFrontendApplicationShell = require('./index-08c8fcb3.cjs.prod.js');
+var redirector = require('./redirector-15844d9b.cjs.prod.js');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
+require('@commercetools-frontend/application-shell-connectors');
 require('@babel/runtime-corejs3/helpers/slicedToArray');
 require('@babel/runtime-corejs3/core-js-stable/url');
 require('@babel/runtime-corejs3/core-js-stable/instance/reverse');
@@ -107,9 +107,6 @@ const RedirectToLogout = props => {
   const location = reactRouterDom.useLocation();
   const servedByProxy = useIsServedByProxy.useIsServedByProxy();
   if ((_window$app$__DEVELOP = window.app.__DEVELOPMENT__) !== null && _window$app$__DEVELOP !== void 0 && (_window$app$__DEVELOP = _window$app$__DEVELOP.oidc) !== null && _window$app$__DEVELOP !== void 0 && _window$app$__DEVELOP.authorizeUrl) {
-    // Remove the `sessionToken` from storage, so that the AppShell can initiate
-    // a new authorization flow.
-    applicationShellConnectors.oidcStorage.clearSession();
     return jsxRuntime.jsx(dist_commercetoolsFrontendApplicationShell.RedirectToLogin, {});
   }
   const mcOrigin = servedByProxy ? getMcOrigin.getMcOrigin(window.app.mcApiUrl) : undefined;

package/dist/{redirect-to-logout-7fb8c085.esm.js → redirect-to-logout-ed7cd66d.esm.js}

@@ -8,13 +8,13 @@ import _Object$defineProperties from '@babel/runtime-corejs3/core-js-stable/obje
 import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object/define-property';
 import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
 import { useLocation } from 'react-router-dom';
-import { oidcStorage } from '@commercetools-frontend/application-shell-connectors';
 import { LOGOUT_REASONS } from '@commercetools-frontend/constants';
 import { u as useIsServedByProxy } from './use-is-served-by-proxy-77984220.esm.js';
 import { g as getMcOrigin } from './get-mc-origin-fecfee07.esm.js';
-import { R as RedirectToLogin } from './index-35f9f7c2.esm.js';
-import { R as Redirector } from './redirector-db8b5cd2.esm.js';
+import { R as RedirectToLogin } from './index-4eee2222.esm.js';
+import { R as Redirector } from './redirector-54a03b75.esm.js';
 import { jsx } from '@emotion/react/jsx-runtime';
+import '@commercetools-frontend/application-shell-connectors';
 import '@babel/runtime-corejs3/helpers/slicedToArray';
 import '@babel/runtime-corejs3/core-js-stable/url';
 import '@babel/runtime-corejs3/core-js-stable/instance/reverse';
@@ -94,9 +94,6 @@ const RedirectToLogout = props => {
   const location = useLocation();
   const servedByProxy = useIsServedByProxy();
   if ((_window$app$__DEVELOP = window.app.__DEVELOPMENT__) !== null && _window$app$__DEVELOP !== void 0 && (_window$app$__DEVELOP = _window$app$__DEVELOP.oidc) !== null && _window$app$__DEVELOP !== void 0 && _window$app$__DEVELOP.authorizeUrl) {
-    // Remove the `sessionToken` from storage, so that the AppShell can initiate
-    // a new authorization flow.
-    oidcStorage.clearSession();
     return jsx(RedirectToLogin, {});
   }
   const mcOrigin = servedByProxy ? getMcOrigin(window.app.mcApiUrl) : undefined;

package/dist/redirect-to-project-create-1d0c6b01.esm.js

@@ -0,0 +1,59 @@
+import { useEffect } from 'react';
+import { PageContentNarrow } from '@commercetools-frontend/application-components';
+import { ContentNotification } from '@commercetools-uikit/notifications';
+import Spacings from '@commercetools-uikit/spacings';
+import Text from '@commercetools-uikit/text';
+import { u as useIsServedByProxy, l as location } from './use-is-served-by-proxy-77984220.esm.js';
+import { g as getMcOrigin } from './get-mc-origin-fecfee07.esm.js';
+import { jsx, jsxs } from '@emotion/react/jsx-runtime';
+import '@commercetools-frontend/application-shell-connectors';
+import '@babel/runtime-corejs3/helpers/slicedToArray';
+import '@babel/runtime-corejs3/core-js-stable/url';
+import '@babel/runtime-corejs3/core-js-stable/instance/reverse';
+
+const RedirectToProjectCreate = () => {
+  const servedByProxy = useIsServedByProxy();
+  useEffect(() => {
+    if (servedByProxy === true) {
+      location.replace('/account/projects/new');
+      return;
+    }
+  }, [servedByProxy]);
+  if (servedByProxy) {
+    return null;
+  }
+  const mcUrl = getMcOrigin(window.app.mcApiUrl);
+  return jsx("div", {
+    children: jsx(Spacings.Inset, {
+      scale: "xl",
+      children: jsx(PageContentNarrow, {
+        children: jsxs(Spacings.Stack, {
+          children: [jsx(Text.Headline, {
+            as: "h1",
+            children: "Please create a project!"
+          }), jsx(ContentNotification, {
+            type: "warning",
+            children: "You are running in development mode"
+          }), jsxs(Text.Body, {
+            children: ["The application is not running behind the", ' ', jsx("a", {
+              href: "https://docs.commercetools.com/custom-applications/concepts/merchant-center-proxy-router",
+              target: "_blank",
+              rel: "noopener noreferrer",
+              children: "Merchant Center Proxy"
+            }), ' ', "in production and thus cannot be redirected to the account section to create a new project."]
+          }), jsxs(Text.Body, {
+            children: ["Instead, we recommend to go to the", ' ', jsx("a", {
+              href: mcUrl,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              children: "Merchant Center production URL"
+            }), ' ', "and create a project there. After that, you can access your new project from your local environment."]
+          })]
+        })
+      })
+    })
+  });
+};
+RedirectToProjectCreate.displayName = 'RedirectToProjectCreate';
+
+export { RedirectToProjectCreate, RedirectToProjectCreate as default };

package/dist/redirect-to-project-create-67d7cd03.cjs.dev.js

@@ -0,0 +1,67 @@
+'use strict';
+
+var react = require('react');
+var applicationComponents = require('@commercetools-frontend/application-components');
+var notifications = require('@commercetools-uikit/notifications');
+var Spacings = require('@commercetools-uikit/spacings');
+var Text = require('@commercetools-uikit/text');
+var useIsServedByProxy = require('./use-is-served-by-proxy-ed411f45.cjs.dev.js');
+var getMcOrigin = require('./get-mc-origin-a86dff20.cjs.dev.js');
+var jsxRuntime = require('@emotion/react/jsx-runtime');
+require('@commercetools-frontend/application-shell-connectors');
+require('@babel/runtime-corejs3/helpers/slicedToArray');
+require('@babel/runtime-corejs3/core-js-stable/url');
+require('@babel/runtime-corejs3/core-js-stable/instance/reverse');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+
+var Spacings__default = /*#__PURE__*/_interopDefault(Spacings);
+var Text__default = /*#__PURE__*/_interopDefault(Text);
+
+const RedirectToProjectCreate = () => {
+  const servedByProxy = useIsServedByProxy.useIsServedByProxy();
+  react.useEffect(() => {
+    if (servedByProxy === true) {
+      useIsServedByProxy.location.replace('/account/projects/new');
+      return;
+    }
+  }, [servedByProxy]);
+  if (servedByProxy) {
+    return null;
+  }
+  const mcUrl = getMcOrigin.getMcOrigin(window.app.mcApiUrl);
+  return jsxRuntime.jsx("div", {
+    children: jsxRuntime.jsx(Spacings__default["default"].Inset, {
+      scale: "xl",
+      children: jsxRuntime.jsx(applicationComponents.PageContentNarrow, {
+        children: jsxRuntime.jsxs(Spacings__default["default"].Stack, {
+          children: [jsxRuntime.jsx(Text__default["default"].Headline, {
+            as: "h1",
+            children: "Please create a project!"
+          }), jsxRuntime.jsx(notifications.ContentNotification, {
+            type: "warning",
+            children: "You are running in development mode"
+          }), jsxRuntime.jsxs(Text__default["default"].Body, {
+            children: ["The application is not running behind the", ' ', jsxRuntime.jsx("a", {
+              href: "https://docs.commercetools.com/custom-applications/concepts/merchant-center-proxy-router",
+              target: "_blank",
+              rel: "noopener noreferrer",
+              children: "Merchant Center Proxy"
+            }), ' ', "in production and thus cannot be redirected to the account section to create a new project."]
+          }), jsxRuntime.jsxs(Text__default["default"].Body, {
+            children: ["Instead, we recommend to go to the", ' ', jsxRuntime.jsx("a", {
+              href: mcUrl,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              children: "Merchant Center production URL"
+            }), ' ', "and create a project there. After that, you can access your new project from your local environment."]
+          })]
+        })
+      })
+    })
+  });
+};
+RedirectToProjectCreate.displayName = 'RedirectToProjectCreate';
+
+exports.RedirectToProjectCreate = RedirectToProjectCreate;
+exports["default"] = RedirectToProjectCreate;

package/dist/redirect-to-project-create-c962f72f.cjs.prod.js

@@ -0,0 +1,67 @@
+'use strict';
+
+var react = require('react');
+var applicationComponents = require('@commercetools-frontend/application-components');
+var notifications = require('@commercetools-uikit/notifications');
+var Spacings = require('@commercetools-uikit/spacings');
+var Text = require('@commercetools-uikit/text');
+var useIsServedByProxy = require('./use-is-served-by-proxy-845cace5.cjs.prod.js');
+var getMcOrigin = require('./get-mc-origin-8f7a578c.cjs.prod.js');
+var jsxRuntime = require('@emotion/react/jsx-runtime');
+require('@commercetools-frontend/application-shell-connectors');
+require('@babel/runtime-corejs3/helpers/slicedToArray');
+require('@babel/runtime-corejs3/core-js-stable/url');
+require('@babel/runtime-corejs3/core-js-stable/instance/reverse');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+
+var Spacings__default = /*#__PURE__*/_interopDefault(Spacings);
+var Text__default = /*#__PURE__*/_interopDefault(Text);
+
+const RedirectToProjectCreate = () => {
+  const servedByProxy = useIsServedByProxy.useIsServedByProxy();
+  react.useEffect(() => {
+    if (servedByProxy === true) {
+      useIsServedByProxy.location.replace('/account/projects/new');
+      return;
+    }
+  }, [servedByProxy]);
+  if (servedByProxy) {
+    return null;
+  }
+  const mcUrl = getMcOrigin.getMcOrigin(window.app.mcApiUrl);
+  return jsxRuntime.jsx("div", {
+    children: jsxRuntime.jsx(Spacings__default["default"].Inset, {
+      scale: "xl",
+      children: jsxRuntime.jsx(applicationComponents.PageContentNarrow, {
+        children: jsxRuntime.jsxs(Spacings__default["default"].Stack, {
+          children: [jsxRuntime.jsx(Text__default["default"].Headline, {
+            as: "h1",
+            children: "Please create a project!"
+          }), jsxRuntime.jsx(notifications.ContentNotification, {
+            type: "warning",
+            children: "You are running in development mode"
+          }), jsxRuntime.jsxs(Text__default["default"].Body, {
+            children: ["The application is not running behind the", ' ', jsxRuntime.jsx("a", {
+              href: "https://docs.commercetools.com/custom-applications/concepts/merchant-center-proxy-router",
+              target: "_blank",
+              rel: "noopener noreferrer",
+              children: "Merchant Center Proxy"
+            }), ' ', "in production and thus cannot be redirected to the account section to create a new project."]
+          }), jsxRuntime.jsxs(Text__default["default"].Body, {
+            children: ["Instead, we recommend to go to the", ' ', jsxRuntime.jsx("a", {
+              href: mcUrl,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              children: "Merchant Center production URL"
+            }), ' ', "and create a project there. After that, you can access your new project from your local environment."]
+          })]
+        })
+      })
+    })
+  });
+};
+RedirectToProjectCreate.displayName = 'RedirectToProjectCreate';
+
+exports.RedirectToProjectCreate = RedirectToProjectCreate;
+exports["default"] = RedirectToProjectCreate;