@commercetools-frontend/application-shell 22.20.0 → 22.21.0

package/dist/{index-bcb52bd1.cjs.prod.js → index-2e98a616.cjs.prod.js}

@@ -24,7 +24,7 @@ var constants = require('@commercetools-frontend/constants');
 var i18n = require('@commercetools-frontend/i18n');
 var reactNotifications = require('@commercetools-frontend/react-notifications');
 var sentry = require('@commercetools-frontend/sentry');
-var oidc = require('./oidc-cfa56c46.cjs.prod.js');
+var oidc = require('./oidc-72a01b56.cjs.prod.js');
 require('@babel/runtime-corejs3/core-js-stable/url');
 var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
 var designSystem = require('@commercetools-uikit/design-system');
@@ -55,6 +55,7 @@ var _possibleConstructorReturn = require('@babel/runtime-corejs3/helpers/possibl
 var _getPrototypeOf = require('@babel/runtime-corejs3/helpers/getPrototypeOf');
 require('@babel/runtime-corejs3/core-js-stable/instance/index-of');
 var _sliceInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/slice');
+var _setTimeout = require('@babel/runtime-corejs3/core-js-stable/set-timeout');
 var _Object$fromEntries = require('@babel/runtime-corejs3/core-js-stable/object/from-entries');
 var _flagsInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/flags');
 var react$2 = require('@apollo/client/react');
@@ -102,6 +103,7 @@ var LoadingSpinner__default = /*#__PURE__*/_interopDefault(LoadingSpinner);
 var history__default = /*#__PURE__*/_interopDefault(history);
 var _Reflect$construct__default = /*#__PURE__*/_interopDefault(_Reflect$construct);
 var _sliceInstanceProperty__default = /*#__PURE__*/_interopDefault(_sliceInstanceProperty);
+var _setTimeout__default = /*#__PURE__*/_interopDefault(_setTimeout);
 var _Object$fromEntries__default = /*#__PURE__*/_interopDefault(_Object$fromEntries);
 var _flagsInstanceProperty__default = /*#__PURE__*/_interopDefault(_flagsInstanceProperty);
 var combineAdapters__default = /*#__PURE__*/_interopDefault(combineAdapters);
@@ -115,9 +117,9 @@ var _JSON$stringify__default = /*#__PURE__*/_interopDefault(_JSON$stringify);
 var _someInstanceProperty__default = /*#__PURE__*/_interopDefault(_someInstanceProperty);
 
 // NOTE: This string will be replaced on build time with the package version.
-var applicationShellVersion = "22.20.0";
+var applicationShellVersion = "22.21.0";
 
-const RequestsInFlightLoader = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./requests-in-flight-loader-7260582b.cjs.prod.js' /* webpackChunkName: "requests-in-flight-loader" */); }));
+const RequestsInFlightLoader = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./requests-in-flight-loader-ec05c2ad.cjs.prod.js' /* webpackChunkName: "requests-in-flight-loader" */); }));
 
 // Attempt to load the `projectKey` from localStorage
 function selectProjectKeyFromLocalStorage() {
@@ -392,7 +394,7 @@ ProjectSwitcher.displayName = 'ProjectSwitcher';
 // eslint-disable-next-line import/prefer-default-export
 const REQUESTS_IN_FLIGHT_LOADER_DOM_ID = 'loader-for-requests-in-flight';
 
-const UserSettingsMenu = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./user-settings-menu-daa096fd.cjs.prod.js' /* webpackChunkName: "user-settings-menu" */); }));
+const UserSettingsMenu = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./user-settings-menu-d4c4058d.cjs.prod.js' /* webpackChunkName: "user-settings-menu" */); }));
 
 var _ref$1 = {
   name: "zjik7",
@@ -585,9 +587,9 @@ FetchUser.propTypes = {
 };
 FetchUser.displayName = 'FetchUser';
 
-const Navbar = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./navbar-91d24894.cjs.prod.js' /* webpackChunkName: "navbar" */); }));
+const Navbar = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./navbar-a138be79.cjs.prod.js' /* webpackChunkName: "navbar" */); }));
 
-const ProjectContainer = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./project-container-143e5c11.cjs.prod.js' /* webpackChunkName: "project-container" */); }));
+const ProjectContainer = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./project-container-2f3f94fc.cjs.prod.js' /* webpackChunkName: "project-container" */); }));
 
 const getSelectedDataLocaleForProject = projectLocales => {
   const cachedDataLocale = window.localStorage.getItem(constants.STORAGE_KEYS.SELECTED_DATA_LOCALE);
@@ -699,7 +701,7 @@ var pimIndexerStates = {
   NOT_INDEXED: 'NOT_INDEXED'
 };
 
-const QuickAccess = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./quick-access-4536163d.cjs.prod.js' /* webpackChunkName: "quick-access" */); }));
+const QuickAccess = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./quick-access-02c8e115.cjs.prod.js' /* webpackChunkName: "quick-access" */); }));
 
 const QuickAccessTrigger = props => {
   const _useState = react.useState(false),
@@ -786,7 +788,7 @@ const QuickAccessTrigger = props => {
 QuickAccessTrigger.propTypes = {};
 QuickAccessTrigger.displayName = 'QuickAccessTrigger';
 
-const RedirectToLogout = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-logout-b18f9c37.cjs.prod.js' /* webpackChunkName: "redirect-to-logout" */); }));
+const RedirectToLogout = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-logout-cd454559.cjs.prod.js' /* webpackChunkName: "redirect-to-logout" */); }));
 
 const RedirectToProjectCreate = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-project-create-c962f72f.cjs.prod.js' /* webpackChunkName: "redirect-to-project-create" */); }));
 
@@ -822,6 +824,39 @@ const useAllMenuFeatureToggles = () => {
 function ownKeys$7(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$7(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$7(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$7(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
 var AllFeaturesQuery = { kind: "Document", definitions: [{ kind: "OperationDefinition", operation: "query", name: { kind: "Name", value: "AllFeatures" }, variableDefinitions: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "allFeatures" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "name" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "value" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "reason" }, arguments: [], directives: [] }] } }] } }], loc: { start: 0, end: 72, source: { body: "query AllFeatures {\n  allFeatures {\n    name\n    value\n    reason\n  }\n}\n", name: "GraphQL request", locationOffset: { line: 1, column: 1 } } } };
+const WAIT_FOR_REMOTE_FLAGS_TIMEOUT = 500; // milliseconds
+
+const StatusAwareRenderer = props => {
+  const _useState = react.useState(!props.shouldWaitForRemoteFlags),
+    _useState2 = _slicedToArray(_useState, 2),
+    shouldRender = _useState2[0],
+    setShouldRender = _useState2[1];
+  const _useAdapterStatus = reactBroadcast.useAdapterStatus(),
+    isReady = _useAdapterStatus.isReady;
+  const displayTimeout = react.useRef();
+  if (isReady && !shouldRender) {
+    setShouldRender(true);
+    clearTimeout(displayTimeout.current);
+  }
+  react.useEffect(() => {
+    displayTimeout.current = _setTimeout__default["default"](() => {
+      setShouldRender(true);
+    }, WAIT_FOR_REMOTE_FLAGS_TIMEOUT);
+    return () => {
+      clearTimeout(displayTimeout.current);
+    };
+  }, []);
+  return shouldRender ? jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: props.children
+  }) : null;
+};
+StatusAwareRenderer.propTypes = {
+  shouldWaitForRemoteFlags: _pt__default["default"].bool,
+  children: _pt__default["default"].node.isRequired
+};
+StatusAwareRenderer.defaultProps = {
+  shouldWaitForRemoteFlags: true
+};
 // This value is hard-coded here because we want to make sure that the
 // app uses our account of LD. The value is meant to be public, so there
 // is no need to be concerned about security.
@@ -901,24 +936,28 @@ const SetupFlopFlipProvider = props => {
     adapterArgs: adapterArgs,
     defaultFlags: defaultFlags,
     shouldDeferAdapterConfiguration: typeof props.shouldDeferAdapterConfiguration === 'boolean' ? props.shouldDeferAdapterConfiguration : !props.user || allMenuFeatureToggles.isLoading,
-    children: props.children
+    children: jsxRuntime.jsx(StatusAwareRenderer, {
+      shouldWaitForRemoteFlags: props.shouldWaitForRemoteFlags,
+      children: props.children
+    })
   });
 };
 SetupFlopFlipProvider.propTypes = {};
 SetupFlopFlipProvider.displayName = 'SetupFlopFlipProvider';
 
+const NewColoursSchemaAnnouncementDialog = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./new-colors-schema-announcement-dialog-661fb5e5.cjs.prod.js'); }));
 const ThemeSwitcher = () => {
   const isRecolouringThemeEnabled = reactBroadcast.useFeatureToggle(constants.featureFlags.RECOLOURING);
   const theme = isRecolouringThemeEnabled ? 'recolouring' : 'default';
-  return jsxRuntime.jsx(jsxRuntime.Fragment, {
-    children: jsxRuntime.jsx(designSystem.ThemeProvider, {
+  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [jsxRuntime.jsx(designSystem.ThemeProvider, {
       theme: theme,
       themeOverrides: applicationComponents.themesOverrides[theme]
-    })
+    }), isRecolouringThemeEnabled && jsxRuntime.jsx(NewColoursSchemaAnnouncementDialog, {})]
   });
 };
 
-const VersionTracker = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./version-tracker-cfc94c34.cjs.prod.js' /* webpackChunkName: "version-tracker" */); }));
+const VersionTracker = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./version-tracker-d0e2442f.cjs.prod.js' /* webpackChunkName: "version-tracker" */); }));
 
 function ownKeys$6(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$6(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$6(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$6(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
@@ -1396,7 +1435,7 @@ const hasCachedAuthenticationState = () => {
   return window.localStorage.getItem(constants.STORAGE_KEYS.IS_AUTHENTICATED) === 'true';
 };
 
-const OidcCallback = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./oidc-callback-81e4d37c.cjs.prod.js' /* webpackChunkName: "oidc-callback" */); }));
+const OidcCallback = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./oidc-callback-42f86d32.cjs.prod.js' /* webpackChunkName: "oidc-callback" */); }));
 
 function ownKeys$4(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$4(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$4(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$4(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
@@ -1546,7 +1585,7 @@ const ApplicationShellProvider = props => {
 ApplicationShellProvider.propTypes = {};
 ApplicationShellProvider.displayName = 'ApplicationShellProvider';
 
-const RedirectToLogin = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-login-ad874fb5.cjs.prod.js' /* webpackChunkName: "redirect-to-login" */); }));
+const RedirectToLogin = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-login-4d8f6f3c.cjs.prod.js' /* webpackChunkName: "redirect-to-login" */); }));
 
 const styles = {
   name: "gx7yk8",
@@ -1594,6 +1633,7 @@ const ApplicationShell = props => {
               children: jsxRuntime.jsx(ApplicationShellAuthenticated, {
                 defaultFeatureFlags: props.defaultFeatureFlags,
                 featureFlags: props.featureFlags,
+                shouldWaitForRemoteFlags: props.shouldWaitForRemoteFlags,
                 render: props.render,
                 applicationMessages: props.applicationMessages,
                 onMenuItemClick: props.onMenuItemClick,
@@ -1612,7 +1652,7 @@ ApplicationShell.propTypes = {};
 ApplicationShell.displayName = 'ApplicationShell';
 ApplicationShell.version = applicationShellVersion;
 
-const CustomViewDevHost = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./custom-view-dev-host-f81ab446.cjs.prod.js' /* webpackChunkName: "custom-view-dev-host" */); }));
+const CustomViewDevHost = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./custom-view-dev-host-c66c139d.cjs.prod.js' /* webpackChunkName: "custom-view-dev-host" */); }));
 
 function CustomViewFlopFlipProvider(props) {
   var _props$user2;