@commercetools-frontend/staff-bar 0.0.0

package/dist/staff-bar-cd682dc4.esm.js

@@ -0,0 +1,1014 @@
+import _Object$keys from '@babel/runtime-corejs3/core-js-stable/object/keys';
+import _Object$getOwnPropertySymbols from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols';
+import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
+import _Object$getOwnPropertyDescriptor from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor';
+import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/for-each';
+import _Object$getOwnPropertyDescriptors from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors';
+import _Object$defineProperties from '@babel/runtime-corejs3/core-js-stable/object/define-properties';
+import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object/define-property';
+import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
+import _slicedToArray from '@babel/runtime-corejs3/helpers/esm/slicedToArray';
+import { useState, useEffect, useMemo, useCallback } from 'react';
+import { css } from '@emotion/react';
+import ReactDOM from 'react-dom';
+import { Marking } from '@commercetools-frontend/fullstory';
+import { Spacings, Text, SelectInput, IconButton, FlatButton, SecondaryButton, Constraints, ToggleInput, Stamp, CheckboxInput, InformationIcon, AngleUpIcon, AngleDownIcon } from '@commercetools-frontend/ui-kit';
+import _includesInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/includes';
+import _findInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/find';
+import _flatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/flat';
+import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
+import { jsxs, jsx, Fragment } from '@emotion/react/jsx-runtime';
+import _Object$entries from '@babel/runtime-corejs3/core-js-stable/object/entries';
+import _sliceInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/slice';
+import isEqual from 'lodash/isEqual';
+import { useModalState, InfoDialog } from '@commercetools-frontend/application-components';
+import { useMcQuery } from '@commercetools-frontend/application-shell';
+import { GRAPHQL_TARGETS } from '@commercetools-frontend/constants';
+import _someInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/some';
+import { useApplicationContext } from '@commercetools-frontend/application-shell-connectors';
+import _JSON$stringify from '@babel/runtime-corejs3/core-js-stable/json/stringify';
+import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
+import '@babel/runtime-corejs3/core-js-stable/reflect/construct';
+import '@babel/runtime-corejs3/helpers/classCallCheck';
+import '@babel/runtime-corejs3/helpers/createClass';
+import '@babel/runtime-corejs3/helpers/possibleConstructorReturn';
+import '@babel/runtime-corejs3/helpers/getPrototypeOf';
+import '@babel/runtime-corejs3/helpers/inherits';
+import _URLSearchParams from '@babel/runtime-corejs3/core-js-stable/url-search-params';
+import { useHistory, useLocation } from 'react-router-dom';
+import sortBy from 'lodash/sortBy';
+
+var config = {
+	AmazonWebServicesATT: {
+		MerchantCenterFrontend: {
+			url: "https://mc.att.us-east-1.aws.commercetools.com"
+		}
+	},
+	AmazonWebServicesChina: {
+		MerchantCenterFrontend: {
+			url: "https://mc.cn-northwest-1.aws.commercetools.cn"
+		}
+	},
+	AmazonWebServicesChinaStaging: {
+		MerchantCenterFrontend: {
+			url: "https://mc.cn-northwest-1.aws.commercetoolscn.cn"
+		}
+	},
+	AmazonWebServicesFrankfurt: {
+		MerchantCenterFrontend: {
+			url: "https://mc.eu-central-1.aws.commercetools.com"
+		}
+	},
+	AmazonWebServicesOhio: {
+		MerchantCenterFrontend: {
+			url: "https://mc.us-east-2.aws.commercetools.com"
+		}
+	},
+	AmazonWebServicesVolkswagen: {
+		MerchantCenterFrontend: {
+			url: "https://mc.vw.eu-central-1.aws.commercetools.com"
+		}
+	},
+	AmazonWebServicesVolkswagenStaging: {
+		MerchantCenterFrontend: {
+			url: "https://mc.vw-stage.eu-central-1.aws.commercetools.com"
+		}
+	},
+	AzureEuropeStaging: {
+		MerchantCenterFrontend: {
+			url: "https://mc.northeurope.azure.escemo.com"
+		}
+	},
+	GoogleCloudPlatformAustralia: {
+		MerchantCenterFrontend: {
+			url: "https://mc.australia-southeast1.gcp.commercetools.com"
+		}
+	},
+	GoogleCloudPlatformEurope: {
+		MerchantCenterFrontend: {
+			url: "https://mc.europe-west1.gcp.commercetools.com"
+		}
+	},
+	GoogleCloudPlatformEuropeStaging: {
+		MerchantCenterFrontend: {
+			url: "https://mc.europe-west1.gcp.escemo.com"
+		}
+	},
+	GoogleCloudPlatformUnitedStates: {
+		MerchantCenterFrontend: {
+			url: "https://mc.us-central1.gcp.commercetools.com"
+		}
+	}
+};
+
+var _context, _context2, _context3, _context4;
+const LOCAL_ENV = {
+  label: 'Local Dev',
+  value: 'http://localhost:3001'
+};
+const PREVIEW_BRANCH = {
+  label: 'Preview Branch',
+  value: ''
+};
+const IS_STAFFBAR_OPEN = 'isStaffBarOpen';
+
+// Type guard to help with filtering arrays for nullish elements.
+function nonNullable(value) {
+  return value !== null && value !== undefined;
+}
+const getOptionsForEnvironment = (label, config) => {
+  return {
+    label,
+    value: config.MerchantCenterFrontend.url
+  };
+};
+const GCP = _filterInstanceProperty(_context = [getOptionsForEnvironment('GCP Australia', config.GoogleCloudPlatformAustralia), getOptionsForEnvironment('GCP Europe', config.GoogleCloudPlatformEurope), getOptionsForEnvironment('GCP USA', config.GoogleCloudPlatformUnitedStates), getOptionsForEnvironment('GCP Europe (Staging)', config.GoogleCloudPlatformEuropeStaging)]).call(_context, nonNullable);
+const AWS = _filterInstanceProperty(_context2 = [getOptionsForEnvironment('AWS China', config.AmazonWebServicesChina), getOptionsForEnvironment('AWS Frankfurt', config.AmazonWebServicesFrankfurt), getOptionsForEnvironment('AWS Ohio', config.AmazonWebServicesOhio), getOptionsForEnvironment('AWS China (Staging)', config.AmazonWebServicesChinaStaging)]).call(_context2, nonNullable);
+const Azure = _filterInstanceProperty(_context3 = [getOptionsForEnvironment('Azure Europe (Staging)', config.AzureEuropeStaging)]).call(_context3, nonNullable);
+const PRIVATE = _filterInstanceProperty(_context4 = [getOptionsForEnvironment('AWS AT&T', config.AmazonWebServicesATT), getOptionsForEnvironment('AWS Volkswagen', config.AmazonWebServicesVolkswagen), getOptionsForEnvironment('AWS Volkswagen (Staging)', config.AmazonWebServicesVolkswagenStaging)]).call(_context4, nonNullable);
+const ENV = [{
+  options: GCP,
+  group: 'GCP'
+}, {
+  options: AWS,
+  group: 'AWS'
+}, {
+  options: Azure,
+  group: 'Azure'
+}, {
+  options: PRIVATE,
+  group: 'Private'
+}];
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__$5() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var _ref$5 = process.env.NODE_ENV === "production" ? {
+  name: "10r8dle",
+  styles: "width:206px"
+} : {
+  name: "mnd5nn-EnvironmentSwitcher",
+  styles: "width:206px;label:EnvironmentSwitcher;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImVudmlyb25tZW50LXN3aXRjaGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQ2dCIiwiZmlsZSI6ImVudmlyb25tZW50LXN3aXRjaGVyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IHVzZUVmZmVjdCwgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBTZWxlY3RJbnB1dCwgU3BhY2luZ3MsIFRleHQgfSBmcm9tICdAY29tbWVyY2V0b29scy1mcm9udGVuZC91aS1raXQnO1xuaW1wb3J0IHsgRU5WLCBMT0NBTF9FTlYsIFBSRVZJRVdfQlJBTkNIIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuXG5jb25zdCBFbnZpcm9ubWVudFN3aXRjaGVyID0gKCkgPT4ge1xuICBjb25zdCBbdmFsdWUsIHNldFZhbHVlXSA9IHVzZVN0YXRlPHN0cmluZyB8IG51bGw+KCk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBjb25zdCBjdXJyZW50VVJMID0gd2luZG93Py5sb2NhdGlvbj8ub3JpZ2luO1xuICAgIGlmIChjdXJyZW50VVJMID09PSBMT0NBTF9FTlYudmFsdWUpIHtcbiAgICAgIEVOVlswXT8ub3B0aW9ucy51bnNoaWZ0KExPQ0FMX0VOVik7XG4gICAgfVxuICAgIGlmIChjdXJyZW50VVJMLmluY2x1ZGVzKCdwcmV2aWV3JykpIHtcbiAgICAgIEVOVlswXT8ub3B0aW9ucy51bnNoaWZ0KFBSRVZJRVdfQlJBTkNIKTtcbiAgICB9XG4gICAgaWYgKGN1cnJlbnRVUkwuaW5jbHVkZXMoJ3ByZXZpZXcnKSkge1xuICAgICAgc2V0VmFsdWUoJycpO1xuICAgIH0gZWxzZSB7XG4gICAgICBzZXRWYWx1ZShcbiAgICAgICAgRU5WLm1hcCgoeyBvcHRpb25zIH0pID0+IG9wdGlvbnMpXG4gICAgICAgICAgLmZsYXQoKVxuICAgICAgICAgIC5maW5kKCh7IHZhbHVlIH0pID0+IHZhbHVlID09PSBjdXJyZW50VVJMKT8udmFsdWVcbiAgICAgICk7XG4gICAgfVxuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSByZWFjdC1ob29rcy9leGhhdXN0aXZlLWRlcHNcbiAgfSwgW10pO1xuXG4gIHJldHVybiAoXG4gICAgPFNwYWNpbmdzLklubGluZSBhbGlnbkl0ZW1zPVwiY2VudGVyXCI+XG4gICAgICA8VGV4dC5EZXRhaWw+RW52aXJvbm1lbnQ8L1RleHQuRGV0YWlsPlxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICB3aWR0aDogMjA2cHg7XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxTZWxlY3RJbnB1dFxuICAgICAgICAgIGlkPXsnZW52LXNlbGVjdG9yJ31cbiAgICAgICAgICBuYW1lPXsnZW52IHNlbGVjdG9yJ31cbiAgICAgICAgICBpc1NlYXJjaGFibGU9e2ZhbHNlfVxuICAgICAgICAgIGhvcml6b250YWxDb25zdHJhaW50PXs1fVxuICAgICAgICAgIG1lbnVQb3J0YWxUYXJnZXQ9e2RvY3VtZW50LmJvZHl9XG4gICAgICAgICAgbWVudVBvcnRhbFpJbmRleD17MzAwMDB9XG4gICAgICAgICAgb25DaGFuZ2U9eyhldmVudCkgPT4ge1xuICAgICAgICAgICAgc2V0VmFsdWUoZXZlbnQudGFyZ2V0LnZhbHVlIGFzIHN0cmluZyk7XG4gICAgICAgICAgICBpZiAoZXZlbnQudGFyZ2V0LnZhbHVlKSB7XG4gICAgICAgICAgICAgIHdpbmRvdy5vcGVuKGV2ZW50LnRhcmdldC52YWx1ZSBhcyBzdHJpbmcsICdfc2VsZicpO1xuICAgICAgICAgICAgfVxuICAgICAgICAgIH19XG4gICAgICAgICAgdmFsdWU9e3ZhbHVlfVxuICAgICAgICAgIG9wdGlvbnM9e0VOVn1cbiAgICAgICAgICBzaG93T3B0aW9uR3JvdXBEaXZpZGVyXG4gICAgICAgIC8+XG4gICAgICA8L2Rpdj5cbiAgICA8L1NwYWNpbmdzLklubGluZT5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IEVudmlyb25tZW50U3dpdGNoZXI7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$5
+};
+const EnvironmentSwitcher = () => {
+  const _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    value = _useState2[0],
+    setValue = _useState2[1];
+  useEffect(() => {
+    var _window;
+    const currentURL = (_window = window) === null || _window === void 0 || (_window = _window.location) === null || _window === void 0 ? void 0 : _window.origin;
+    if (currentURL === LOCAL_ENV.value) {
+      var _ENV$;
+      (_ENV$ = ENV[0]) === null || _ENV$ === void 0 || _ENV$.options.unshift(LOCAL_ENV);
+    }
+    if (_includesInstanceProperty(currentURL).call(currentURL, 'preview')) {
+      var _ENV$2;
+      (_ENV$2 = ENV[0]) === null || _ENV$2 === void 0 || _ENV$2.options.unshift(PREVIEW_BRANCH);
+    }
+    if (_includesInstanceProperty(currentURL).call(currentURL, 'preview')) {
+      setValue('');
+    } else {
+      var _ENV$map$flat$find, _context, _context2;
+      setValue((_ENV$map$flat$find = _findInstanceProperty(_context = _flatInstanceProperty(_context2 = _mapInstanceProperty(ENV).call(ENV, _ref2 => {
+        let options = _ref2.options;
+        return options;
+      })).call(_context2)).call(_context, _ref3 => {
+        let value = _ref3.value;
+        return value === currentURL;
+      })) === null || _ENV$map$flat$find === void 0 ? void 0 : _ENV$map$flat$find.value);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  return jsxs(Spacings.Inline, {
+    alignItems: "center",
+    children: [jsx(Text.Detail, {
+      children: "Environment"
+    }), jsx("div", {
+      css: _ref$5,
+      children: jsx(SelectInput, {
+        id: 'env-selector',
+        name: 'env selector',
+        isSearchable: false,
+        horizontalConstraint: 5,
+        menuPortalTarget: document.body,
+        menuPortalZIndex: 30000,
+        onChange: event => {
+          setValue(event.target.value);
+          if (event.target.value) {
+            window.open(event.target.value, '_self');
+          }
+        },
+        value: value,
+        options: ENV,
+        showOptionGroupDivider: true
+      })
+    })]
+  });
+};
+
+const GITHUB_PR_URL = 'https://github.com/commercetools/merchant-center-frontend/pull/';
+// Session storage keys
+const FEATURE_FLAG_KEY = 'toggled-feature-flags';
+const ACTIVE_TEAM_ID_KEY = 'activeTeamId';
+const ENABLE_LOG_KEY = 'enable-log';
+const USER_ROLES_WITH_ALLOWED_ACCESS = ['Engineer', 'ProductProjectManagerOrOwner'];
+
+var FetchStaffBarUser = { kind: "Document", definitions: [{ kind: "OperationDefinition", operation: "query", name: { kind: "Name", value: "FetchStaffBarUser" }, variableDefinitions: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", alias: { kind: "Name", value: "user" }, name: { kind: "Name", value: "me" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "id" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "launchdarklyTrackingGroup" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "launchdarklyTrackingSubgroup" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "businessRole" }, arguments: [], directives: [] }] } }] } }], loc: { start: 0, end: 132, source: { body: "query FetchStaffBarUser {\n  user: me {\n    id\n    launchdarklyTrackingGroup\n    launchdarklyTrackingSubgroup\n    businessRole\n  }\n}\n", name: "GraphQL request", locationOffset: { line: 1, column: 1 } } } };
+const useStaffBarUser = () => {
+  var _data$user, _data$user2, _data$user3;
+  const _useMcQuery = useMcQuery(FetchStaffBarUser, {
+      context: {
+        target: GRAPHQL_TARGETS.MERCHANT_CENTER_BACKEND
+      },
+      // Use cache to avoid users from mocking response in browser to enable staffbar
+      fetchPolicy: 'cache-only'
+    }),
+    data = _useMcQuery.data,
+    error = _useMcQuery.error;
+  return {
+    userId: data === null || data === void 0 || (_data$user = data.user) === null || _data$user === void 0 ? void 0 : _data$user.id,
+    isStaffMember: (data === null || data === void 0 || (_data$user2 = data.user) === null || _data$user2 === void 0 ? void 0 : _data$user2.launchdarklyTrackingGroup) === 'commercetools',
+    isDevMember: _includesInstanceProperty(USER_ROLES_WITH_ALLOWED_ACCESS).call(USER_ROLES_WITH_ALLOWED_ACCESS, data === null || data === void 0 || (_data$user3 = data.user) === null || _data$user3 === void 0 ? void 0 : _data$user3.businessRole),
+    error
+  };
+};
+
+const getActiveTeamId = () => window.sessionStorage.getItem(ACTIVE_TEAM_ID_KEY);
+const setActiveTeamId = teamId => window.sessionStorage.setItem(ACTIVE_TEAM_ID_KEY, teamId);
+const removeActiveTeamId = () => window.sessionStorage.removeItem(ACTIVE_TEAM_ID_KEY);
+
+var FetchTeamsByProjectQuery = { kind: "Document", definitions: [{ kind: "OperationDefinition", operation: "query", name: { kind: "Name", value: "FetchTeamsByProjectQuery" }, variableDefinitions: [{ kind: "VariableDefinition", variable: { kind: "Variable", name: { kind: "Name", value: "where" } }, type: { kind: "NonNullType", type: { kind: "NamedType", name: { kind: "Name", value: "String" } } }, directives: [] }], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "myProjects" }, arguments: [{ kind: "Argument", name: { kind: "Name", value: "where" }, value: { kind: "Variable", name: { kind: "Name", value: "where" } } }], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "results" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "id" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "key" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "name" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "owner" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "id" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "name" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "teams" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "id" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "name" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "membersRef" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "id" }, arguments: [], directives: [] }] } }] } }] } }] } }] } }] } }], loc: { start: 0, end: 286, source: { body: "query FetchTeamsByProjectQuery($where: String!) {\n  myProjects(where: $where) {\n    results {\n      id\n      key\n      name\n      owner {\n        id\n        name\n        teams {\n          id\n          name\n          membersRef {\n            id\n          }\n        }\n      }\n    }\n  }\n}\n", name: "GraphQL request", locationOffset: { line: 1, column: 1 } } } };
+const defaultTeam = {
+  label: 'Default',
+  value: ''
+};
+const onlyTeamsWithMembership = function (userId) {
+  let teams = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+  return teams.length ? _filterInstanceProperty(teams).call(teams, team => {
+    var _team$membersRef;
+    return (_team$membersRef = team.membersRef) === null || _team$membersRef === void 0 ? void 0 : _someInstanceProperty(_team$membersRef).call(_team$membersRef, memberRef => memberRef.id === userId);
+  }) : [];
+};
+const getAdminTeamId = function () {
+  var _teams$find;
+  let teams = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  return (_teams$find = _findInstanceProperty(teams).call(teams, team => team.name === 'Administrators')) === null || _teams$find === void 0 ? void 0 : _teams$find.id;
+};
+const getStoredTeamId = function (storedId) {
+  let teams = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+  return _findInstanceProperty(teams).call(teams, team => team.id === storedId);
+};
+const transformTeamsToOptions = function () {
+  let teams = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  const hasAdminTeam = Boolean(getAdminTeamId(teams));
+  const options = _mapInstanceProperty(teams).call(teams, team => ({
+    label: team === null || team === void 0 ? void 0 : team.name,
+    value: team === null || team === void 0 ? void 0 : team.id
+  }));
+  if (hasAdminTeam) {
+    return options;
+  } else if (options.length) {
+    return [defaultTeam, ...options];
+  } else {
+    return [];
+  }
+};
+const useTeams = () => {
+  var _data$myProjects, _ref;
+  const projectKey = useApplicationContext(applicationContext => {
+    var _applicationContext$p;
+    return (_applicationContext$p = applicationContext.project) === null || _applicationContext$p === void 0 ? void 0 : _applicationContext$p.key;
+  });
+  const _useStaffBarUser = useStaffBarUser(),
+    userId = _useStaffBarUser.userId;
+  const _useMcQuery = useMcQuery(FetchTeamsByProjectQuery, {
+      skip: !projectKey,
+      variables: {
+        where: "key=\"".concat(projectKey, "\"")
+      },
+      context: {
+        target: GRAPHQL_TARGETS.ADMINISTRATION_SERVICE
+      }
+    }),
+    data = _useMcQuery.data,
+    error = _useMcQuery.error,
+    loading = _useMcQuery.loading;
+  const teams = data === null || data === void 0 || (_data$myProjects = data.myProjects) === null || _data$myProjects === void 0 || (_data$myProjects = _data$myProjects.results) === null || _data$myProjects === void 0 || (_data$myProjects = _data$myProjects[0]) === null || _data$myProjects === void 0 || (_data$myProjects = _data$myProjects.owner) === null || _data$myProjects === void 0 ? void 0 : _data$myProjects.teams;
+  useEffect(() => {
+    if (loading) {
+      return;
+    }
+
+    // If user already simulated the permission and tries to change project then we need to clear the stored teamId
+    // otherwise the newly selected project might be from different organization and user will see 404 page.
+    const storedId = getActiveTeamId();
+    if (storedId && !getStoredTeamId(storedId, teams)) {
+      removeActiveTeamId();
+      window.location.reload();
+    }
+  }, [loading, teams]);
+  const options = transformTeamsToOptions(onlyTeamsWithMembership(userId || '', teams));
+  const adminTeamId = getAdminTeamId(onlyTeamsWithMembership(userId || '', teams));
+  const storedId = getActiveTeamId();
+  const activeTeamId = (_ref = storedId !== null && storedId !== void 0 ? storedId : adminTeamId) !== null && _ref !== void 0 ? _ref : defaultTeam.value;
+  return {
+    data,
+    options,
+    activeTeamId,
+    isLimitedPermission: storedId && storedId !== adminTeamId,
+    error,
+    loading
+  };
+};
+
+var _window$__flopflip__;
+const launchdarklyAdapter = (_window$__flopflip__ = window.__flopflip__) === null || _window$__flopflip__ === void 0 ? void 0 : _window$__flopflip__.launchdarkly;
+function getFlagValue(flag, defaultValue) {
+  // @ts-expect-error: getFlag exists not on all adapters and hence
+  // not the generic type. For ours it exists.
+  const result = launchdarklyAdapter === null || launchdarklyAdapter === void 0 ? void 0 : launchdarklyAdapter.getFlag(flag);
+  if (typeof result === 'boolean') {
+    return result;
+  } else if (typeof (result === null || result === void 0 ? void 0 : result.value) === 'boolean') {
+    return result;
+  }
+  return defaultValue;
+}
+function setFlag(flagName, flagValue) {
+  let lockFlags = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+  launchdarklyAdapter === null || launchdarklyAdapter === void 0 || launchdarklyAdapter.updateFlags({
+    [flagName]: flagValue
+  }, {
+    lockFlags
+  });
+}
+
+const getFromSessionStorage = key => {
+  const storedValue = window.sessionStorage.getItem(key);
+  return storedValue ? JSON.parse(storedValue) : {};
+};
+const setToSessionStorage = (key, value) => window.sessionStorage.setItem(key, _JSON$stringify(value));
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__$4() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var _ref$4 = process.env.NODE_ENV === "production" ? {
+  name: "mdo41b",
+  styles: "box-sizing:border-box;width:100%;margin:0;border:0;border-top-width:1px;border-style:solid;border-top-color:var(--color-neutral-90)"
+} : {
+  name: "p3joim-Divider",
+  styles: "box-sizing:border-box;width:100%;margin:0;border:0;border-top-width:1px;border-style:solid;border-top-color:var(--color-neutral-90);label:Divider;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRpdmlkZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUtjIiwiZmlsZSI6ImRpdmlkZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG5leHBvcnQgZGVmYXVsdCBmdW5jdGlvbiBEaXZpZGVyKCkge1xuICByZXR1cm4gKFxuICAgIDxoclxuICAgICAgY3NzPXtjc3NgXG4gICAgICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gICAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgICBtYXJnaW46IDA7XG4gICAgICAgIGJvcmRlcjogMDtcbiAgICAgICAgYm9yZGVyLXRvcC13aWR0aDogMXB4O1xuICAgICAgICBib3JkZXItc3R5bGU6IHNvbGlkO1xuICAgICAgICBib3JkZXItdG9wLWNvbG9yOiB2YXIoLS1jb2xvci1uZXV0cmFsLTkwKTtcbiAgICAgIGB9XG4gICAgLz5cbiAgKTtcbn1cbiJdfQ== */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$4
+};
+function Divider() {
+  return jsx("hr", {
+    css: _ref$4
+  });
+}
+
+function ownKeys$2(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$2(e) { for (var r = 1; r < arguments.length; r++) { var _context4, _context5; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context4 = ownKeys$2(Object(t), !0)).call(_context4, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context5 = ownKeys$2(Object(t))).call(_context5, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+var FeatureFlagTogglerIllustration = function FeatureFlagTogglerIllustration(props) {
+  return jsx("svg", _objectSpread$2(_objectSpread$2({}, props), {}, {
+    children: jsx("path", {
+      d: "M4.91 9.818c-1.365 0-2.524-.477-3.478-1.432C.477 7.432 0 6.273 0 4.91c0-1.364.477-2.523 1.432-3.477C2.386.477 3.545 0 4.909 0h8.182c1.364 0 2.523.477 3.477 1.432C17.523 2.386 18 3.545 18 4.909c0 1.364-.477 2.523-1.432 3.477-.954.955-2.114 1.432-3.477 1.432H4.909Zm0-1.227h8.18c1.024 0 1.893-.358 2.609-1.074.716-.716 1.074-1.585 1.074-2.608 0-1.023-.358-1.892-1.074-2.608-.716-.716-1.585-1.074-2.608-1.074H4.909c-1.023 0-1.892.358-2.608 1.074-.716.716-1.074 1.585-1.074 2.608 0 1.023.358 1.892 1.074 2.608.716.716 1.585 1.074 2.608 1.074Zm-.023-1.616c.574 0 1.062-.2 1.464-.602a1.99 1.99 0 0 0 .604-1.463c0-.573-.201-1.061-.603-1.463a1.99 1.99 0 0 0-1.462-.604c-.574 0-1.062.2-1.464.602a1.99 1.99 0 0 0-.603 1.463c0 .573.2 1.061.602 1.464a1.99 1.99 0 0 0 1.462.603Z",
+      fill: "#000"
+    })
+  }));
+};
+FeatureFlagTogglerIllustration.defaultProps = {
+  width: "18",
+  height: "10",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+function toggleFeatureFlag(flag, value) {
+  const cachedFeatureFlag = getFromSessionStorage(FEATURE_FLAG_KEY);
+  setToSessionStorage(FEATURE_FLAG_KEY, _objectSpread$2(_objectSpread$2({}, cachedFeatureFlag), {}, {
+    [flag]: value
+  }));
+  setFlag(flag, value);
+}
+const FeatureFlagToggler = props => {
+  var _context, _props$featureFlags;
+  const modalState = useModalState();
+  const _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    toggleAll = _useState2[0],
+    setToggleAll = _useState2[1];
+  const cachedFeatureFlag = getFromSessionStorage(FEATURE_FLAG_KEY);
+  const _useStaffBarUser = useStaffBarUser(),
+    isDevMember = _useStaffBarUser.isDevMember;
+  const _useState3 = useState(_mapInstanceProperty(_context = _Object$entries((_props$featureFlags = props.featureFlags) !== null && _props$featureFlags !== void 0 ? _props$featureFlags : {})).call(_context, _ref => {
+      var _cachedFeatureFlag$fe;
+      let _ref2 = _slicedToArray(_ref, 2),
+        featureName = _ref2[0],
+        toggleValue = _ref2[1];
+      return {
+        featureName,
+        toggleValue: (_cachedFeatureFlag$fe = cachedFeatureFlag[featureName]) !== null && _cachedFeatureFlag$fe !== void 0 ? _cachedFeatureFlag$fe : getFlagValue(featureName, toggleValue)
+      };
+    })),
+    _useState4 = _slicedToArray(_useState3, 2),
+    options = _useState4[0],
+    setOptions = _useState4[1];
+  const originalValues = useMemo(() => {
+    var _context2, _props$featureFlags2;
+    return _mapInstanceProperty(_context2 = _Object$entries((_props$featureFlags2 = props.featureFlags) !== null && _props$featureFlags2 !== void 0 ? _props$featureFlags2 : {})).call(_context2, _ref3 => {
+      var _getFlagValue;
+      let _ref4 = _slicedToArray(_ref3, 2),
+        featureName = _ref4[0],
+        toggleValue = _ref4[1];
+      return {
+        featureName,
+        toggleValue: (_getFlagValue = getFlagValue(featureName, toggleValue)) !== null && _getFlagValue !== void 0 ? _getFlagValue : 'false'
+      };
+    });
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  []);
+  const isTouched = useMemo(() => !isEqual(originalValues, options), [originalValues, options]);
+  useEffect(() => {
+    // Persist toggled flags from other application
+    if (_Object$keys(cachedFeatureFlag).length) {
+      var _context3;
+      _forEachInstanceProperty(_context3 = _Object$entries(cachedFeatureFlag)).call(_context3, _ref5 => {
+        let _ref6 = _slicedToArray(_ref5, 2),
+          featureName = _ref6[0],
+          value = _ref6[1];
+        if (_findInstanceProperty(options).call(options, option => option.featureName === featureName)) {
+          toggleFeatureFlag(featureName, value);
+        }
+      });
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  const isToggled = toggleValue => {
+    if (typeof toggleValue === 'object' && toggleValue.value !== undefined) {
+      return toggleValue.value;
+    }
+    return toggleValue;
+  };
+  const toTitleCase = function () {
+    let value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+    const result = value.replace(/([A-Z])/g, ' $1');
+    return result.charAt(0).toUpperCase() + _sliceInstanceProperty(result).call(result, 1);
+  };
+  const toggleAndGenerateNewOption = _ref7 => {
+    let featureName = _ref7.featureName,
+      toggleValue = _ref7.toggleValue,
+      options = _ref7.options,
+      index = _ref7.index;
+    const newOptions = [...options];
+    if (typeof toggleValue === 'boolean') {
+      toggleFeatureFlag(featureName, !toggleValue);
+      newOptions[index] = _objectSpread$2(_objectSpread$2({}, newOptions[index]), {}, {
+        toggleValue: !toggleValue
+      });
+    } else {
+      toggleFeatureFlag(featureName, {
+        value: !(toggleValue !== null && toggleValue !== void 0 && toggleValue.value)
+      });
+      newOptions[index] = _objectSpread$2(_objectSpread$2({}, newOptions[index]), {}, {
+        toggleValue: {
+          value: !(toggleValue !== null && toggleValue !== void 0 && toggleValue.value)
+        }
+      });
+    }
+    return newOptions;
+  };
+  const handleToggleAll = useCallback(() => {
+    let newOptions = [...options];
+    _forEachInstanceProperty(options).call(options, (_ref8, index) => {
+      let featureName = _ref8.featureName,
+        toggleValue = _ref8.toggleValue;
+      newOptions = toggleAndGenerateNewOption({
+        featureName,
+        toggleValue: typeof toggleValue === 'boolean' ? toggleAll : {
+          value: toggleAll
+        },
+        index,
+        options: [...newOptions]
+      });
+    });
+    setOptions(newOptions);
+    setToggleAll(!toggleAll);
+  }, [toggleAll, options]);
+  const handleToggle = useCallback(_ref9 => {
+    let featureName = _ref9.featureName,
+      toggleValue = _ref9.toggleValue,
+      index = _ref9.index;
+    const newOptions = toggleAndGenerateNewOption({
+      featureName,
+      toggleValue,
+      index,
+      options: [...options]
+    });
+    setOptions(newOptions);
+  }, [options]);
+  const handleRevert = () => {
+    _forEachInstanceProperty(originalValues).call(originalValues, (_ref10, index) => {
+      let featureName = _ref10.featureName,
+        toggleValue = _ref10.toggleValue;
+      toggleAndGenerateNewOption({
+        featureName,
+        toggleValue: typeof toggleValue === 'boolean' ? !toggleValue : {
+          value: !toggleValue.value
+        },
+        index,
+        options: [...options]
+      });
+    });
+    setOptions(originalValues);
+    setToggleAll(false);
+    window.sessionStorage.removeItem(FEATURE_FLAG_KEY);
+  };
+  if (!isDevMember) return null;
+  if (!options.length) return null;
+  return jsxs(Fragment, {
+    children: [jsx(IconButton, {
+      label: "Toggle Feature Flags",
+      icon: jsx(FeatureFlagTogglerIllustration, {}),
+      onClick: modalState.openModal,
+      color: "info"
+    }), jsx(InfoDialog, {
+      title: 'Feature flags',
+      isOpen: modalState.isModalOpen,
+      onClose: modalState.closeModal,
+      zIndex: 30000,
+      getParentSelector: () => document.body,
+      children: jsxs(Spacings.Stack, {
+        scale: "m",
+        children: [jsxs(Spacings.Inline, {
+          justifyContent: "flex-end",
+          scale: "m",
+          alignItems: "center",
+          children: [jsx(FlatButton, {
+            onClick: handleToggleAll,
+            label: "Toggle All"
+          }), jsx(SecondaryButton, {
+            label: "Revert",
+            onClick: handleRevert,
+            isDisabled: !isTouched
+          })]
+        }), jsx(Spacings.Stack, {
+          scale: "m",
+          children: _mapInstanceProperty(options).call(options, (_ref11, index) => {
+            let featureName = _ref11.featureName,
+              toggleValue = _ref11.toggleValue;
+            return jsx(Constraints.Horizontal, {
+              max: 'scale',
+              children: jsxs(Spacings.Stack, {
+                scale: "m",
+                children: [jsxs(Spacings.Inline, {
+                  justifyContent: "space-between",
+                  alignItems: "center",
+                  children: [jsxs("div", {
+                    children: [jsx(Text.Body, {
+                      children: toTitleCase(featureName)
+                    }), jsxs(Text.Detail, {
+                      tone: "secondary",
+                      children: ["flag key: ", featureName]
+                    })]
+                  }), jsx(ToggleInput, {
+                    size: "small",
+                    isChecked: isToggled(toggleValue),
+                    onChange: () => handleToggle({
+                      featureName,
+                      toggleValue,
+                      index
+                    })
+                  })]
+                }), jsx(Divider, {})]
+              })
+            }, featureName);
+          })
+        })]
+      })
+    })]
+  });
+};
+
+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 _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context2 = ownKeys$1(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context3 = ownKeys$1(Object(t))).call(_context3, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+var GitHubIcon = function GitHubIcon(props) {
+  return jsx("svg", _objectSpread$1(_objectSpread$1({}, props), {}, {
+    children: jsx("path", {
+      d: "M12 0C5.374 0 0 5.373 0 12c0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.509 11.509 0 0 1 12 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576C20.566 21.797 24 17.3 24 12c0-6.627-5.373-12-12-12z"
+    })
+  }));
+};
+GitHubIcon.defaultProps = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "24",
+  height: "24"
+};
+function GitHubPullRequestLink() {
+  const previewUrl = window.location.hostname.match(/mc-(\d+)\.mc-preview/);
+  if (!previewUrl) return null;
+  const _previewUrl = _slicedToArray(previewUrl, 2),
+    PRNumber = _previewUrl[1];
+  return jsx(IconButton, {
+    label: "GitHub Pull Request",
+    icon: jsx(GitHubIcon, {}),
+    onClick: () => {
+      var _context;
+      window.open(_concatInstanceProperty(_context = "".concat(GITHUB_PR_URL)).call(_context, PRNumber));
+    }
+  });
+}
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__$3() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var _ref$3 = process.env.NODE_ENV === "production" ? {
+  name: "1jeqx8",
+  styles: "width:242px"
+} : {
+  name: "959kup-TeamSwitcher",
+  styles: "width:242px;label:TeamSwitcher;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRlYW0tc3dpdGNoZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXdEa0IiLCJmaWxlIjoidGVhbS1zd2l0Y2hlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgUmVhY3RET00gZnJvbSAncmVhY3QtZG9tJztcbmltcG9ydCB7XG4gIFNlbGVjdElucHV0LFxuICBUZXh0LFxuICBTcGFjaW5ncyxcbiAgU3RhbXAsXG59IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL3VpLWtpdCc7XG5pbXBvcnQgeyB1c2VUZWFtcyB9IGZyb20gJy4uLy4uL2hvb2tzJztcbmltcG9ydCB7IHJlbW92ZUFjdGl2ZVRlYW1JZCwgc2V0QWN0aXZlVGVhbUlkIH0gZnJvbSAnLi4vLi4vdXRpbHMvYWN0aXZlLXRlYW0nO1xuXG5jb25zdCBUZWFtU3dpdGNoZXIgPSAoKSA9PiB7XG4gIGNvbnN0IHsgb3B0aW9ucywgYWN0aXZlVGVhbUlkLCBpc0xpbWl0ZWRQZXJtaXNzaW9uIH0gPSB1c2VUZWFtcygpO1xuXG4gIGlmICghb3B0aW9ucz8ubGVuZ3RoKSB7XG4gICAgcmV0dXJuIG51bGw7XG4gIH1cblxuICBjb25zdCBib3R0b21PcHRpb24gPSB7XG4gICAgb3B0aW9uczogW1xuICAgICAge1xuICAgICAgICBsYWJlbDogJ1NlbGVjdCBhIHRlYW0gdG8gbGltaXQgcGVybWlzc2lvbnMgdG8gdGhvc2Ugb2YgdGhhdCB0ZWFtLicsXG4gICAgICAgIHZhbHVlOiAnJyxcbiAgICAgICAgaXNEaXNhYmxlZDogdHJ1ZSxcbiAgICAgIH0sXG4gICAgXSxcbiAgfTtcbiAgY29uc3Qgb3B0aW9uc1dpdGhCb3R0b21PcHRpb24gPSBbXG4gICAge1xuICAgICAgb3B0aW9ucyxcbiAgICB9LFxuICAgIGJvdHRvbU9wdGlvbixcbiAgXTtcblxuICBjb25zdCBwb3J0YWxDb250YWluZXIgPSBkb2N1bWVudC5xdWVyeVNlbGVjdG9yKFwiW2lkPSdsZWZ0LW9mLXByb2ZpbGUnXVwiKTtcblxuICBjb25zdCBjb250YWluZXIgPSAoXG4gICAgPGRpdlxuICAgICAgZGF0YS10ZXN0aWQ9XCJsaW1pdGVkLXBlcm1pc3Npb25cIlxuICAgICAgY3NzPXtjc3NgXG4gICAgICAgIHotaW5kZXg6IDIwMDAxO1xuICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgICBtYXJnaW4tcmlnaHQ6IDE2cHg7XG4gICAgICAgIGhlaWdodDogMTAwJTtcbiAgICAgIGB9XG4gICAgPlxuICAgICAgPFN0YW1wIHRvbmU9XCJ3YXJuaW5nXCIgbGFiZWw9XCJMaW1pdGVkIFBlcm1pc3Npb25cIiAvPlxuICAgIDwvZGl2PlxuICApO1xuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIDxTcGFjaW5ncy5JbmxpbmUgYWxpZ25JdGVtcz1cImNlbnRlclwiPlxuICAgICAgICA8VGV4dC5EZXRhaWw+VGVhbTwvVGV4dC5EZXRhaWw+XG4gICAgICAgIDxkaXZcbiAgICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICAgIHdpZHRoOiAyNDJweDtcbiAgICAgICAgICBgfVxuICAgICAgICA+XG4gICAgICAgICAgPFNlbGVjdElucHV0XG4gICAgICAgICAgICBpZD1cInRlYW0tc2VsZWN0b3JcIlxuICAgICAgICAgICAgbmFtZT1cIlRlYW0gU2VsZWN0b3JcIlxuICAgICAgICAgICAgaXNTZWFyY2hhYmxlPXt0cnVlfVxuICAgICAgICAgICAgaG9yaXpvbnRhbENvbnN0cmFpbnQ9ezV9XG4gICAgICAgICAgICBtZW51UG9ydGFsVGFyZ2V0PXtkb2N1bWVudC5ib2R5fVxuICAgICAgICAgICAgbWVudVBvcnRhbFpJbmRleD17MzAwMDB9XG4gICAgICAgICAgICBvbkNoYW5nZT17KGV2ZW50KSA9PiB7XG4gICAgICAgICAgICAgIGlmIChldmVudC50YXJnZXQudmFsdWUpIHtcbiAgICAgICAgICAgICAgICBzZXRBY3RpdmVUZWFtSWQoZXZlbnQudGFyZ2V0LnZhbHVlIGFzIHN0cmluZyk7XG4gICAgICAgICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgICAgICAgcmVtb3ZlQWN0aXZlVGVhbUlkKCk7XG4gICAgICAgICAgICAgIH1cblxuICAgICAgICAgICAgICB3aW5kb3cubG9jYXRpb24ucmVsb2FkKCk7XG4gICAgICAgICAgICB9fVxuICAgICAgICAgICAgdmFsdWU9e2FjdGl2ZVRlYW1JZH1cbiAgICAgICAgICAgIG9wdGlvbnM9e29wdGlvbnNXaXRoQm90dG9tT3B0aW9ufVxuICAgICAgICAgICAgc2hvd09wdGlvbkdyb3VwRGl2aWRlclxuICAgICAgICAgIC8+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9TcGFjaW5ncy5JbmxpbmU+XG4gICAgICB7aXNMaW1pdGVkUGVybWlzc2lvbiAmJlxuICAgICAgICBwb3J0YWxDb250YWluZXIgJiZcbiAgICAgICAgUmVhY3RET00uY3JlYXRlUG9ydGFsKGNvbnRhaW5lciwgcG9ydGFsQ29udGFpbmVyKX1cbiAgICA8Lz5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IFRlYW1Td2l0Y2hlcjtcbiJdfQ== */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$3
+};
+var _ref2$2 = process.env.NODE_ENV === "production" ? {
+  name: "14ronv",
+  styles: "z-index:20001;display:flex;align-items:center;margin-right:16px;height:100%"
+} : {
+  name: "1d9e80f-container",
+  styles: "z-index:20001;display:flex;align-items:center;margin-right:16px;height:100%;label:container;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRlYW0tc3dpdGNoZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXVDYyIsImZpbGUiOiJ0ZWFtLXN3aXRjaGVyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nO1xuaW1wb3J0IHtcbiAgU2VsZWN0SW5wdXQsXG4gIFRleHQsXG4gIFNwYWNpbmdzLFxuICBTdGFtcCxcbn0gZnJvbSAnQGNvbW1lcmNldG9vbHMtZnJvbnRlbmQvdWkta2l0JztcbmltcG9ydCB7IHVzZVRlYW1zIH0gZnJvbSAnLi4vLi4vaG9va3MnO1xuaW1wb3J0IHsgcmVtb3ZlQWN0aXZlVGVhbUlkLCBzZXRBY3RpdmVUZWFtSWQgfSBmcm9tICcuLi8uLi91dGlscy9hY3RpdmUtdGVhbSc7XG5cbmNvbnN0IFRlYW1Td2l0Y2hlciA9ICgpID0+IHtcbiAgY29uc3QgeyBvcHRpb25zLCBhY3RpdmVUZWFtSWQsIGlzTGltaXRlZFBlcm1pc3Npb24gfSA9IHVzZVRlYW1zKCk7XG5cbiAgaWYgKCFvcHRpb25zPy5sZW5ndGgpIHtcbiAgICByZXR1cm4gbnVsbDtcbiAgfVxuXG4gIGNvbnN0IGJvdHRvbU9wdGlvbiA9IHtcbiAgICBvcHRpb25zOiBbXG4gICAgICB7XG4gICAgICAgIGxhYmVsOiAnU2VsZWN0IGEgdGVhbSB0byBsaW1pdCBwZXJtaXNzaW9ucyB0byB0aG9zZSBvZiB0aGF0IHRlYW0uJyxcbiAgICAgICAgdmFsdWU6ICcnLFxuICAgICAgICBpc0Rpc2FibGVkOiB0cnVlLFxuICAgICAgfSxcbiAgICBdLFxuICB9O1xuICBjb25zdCBvcHRpb25zV2l0aEJvdHRvbU9wdGlvbiA9IFtcbiAgICB7XG4gICAgICBvcHRpb25zLFxuICAgIH0sXG4gICAgYm90dG9tT3B0aW9uLFxuICBdO1xuXG4gIGNvbnN0IHBvcnRhbENvbnRhaW5lciA9IGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoXCJbaWQ9J2xlZnQtb2YtcHJvZmlsZSddXCIpO1xuXG4gIGNvbnN0IGNvbnRhaW5lciA9IChcbiAgICA8ZGl2XG4gICAgICBkYXRhLXRlc3RpZD1cImxpbWl0ZWQtcGVybWlzc2lvblwiXG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgei1pbmRleDogMjAwMDE7XG4gICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgICAgIG1hcmdpbi1yaWdodDogMTZweDtcbiAgICAgICAgaGVpZ2h0OiAxMDAlO1xuICAgICAgYH1cbiAgICA+XG4gICAgICA8U3RhbXAgdG9uZT1cIndhcm5pbmdcIiBsYWJlbD1cIkxpbWl0ZWQgUGVybWlzc2lvblwiIC8+XG4gICAgPC9kaXY+XG4gICk7XG5cbiAgcmV0dXJuIChcbiAgICA8PlxuICAgICAgPFNwYWNpbmdzLklubGluZSBhbGlnbkl0ZW1zPVwiY2VudGVyXCI+XG4gICAgICAgIDxUZXh0LkRldGFpbD5UZWFtPC9UZXh0LkRldGFpbD5cbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgd2lkdGg6IDI0MnB4O1xuICAgICAgICAgIGB9XG4gICAgICAgID5cbiAgICAgICAgICA8U2VsZWN0SW5wdXRcbiAgICAgICAgICAgIGlkPVwidGVhbS1zZWxlY3RvclwiXG4gICAgICAgICAgICBuYW1lPVwiVGVhbSBTZWxlY3RvclwiXG4gICAgICAgICAgICBpc1NlYXJjaGFibGU9e3RydWV9XG4gICAgICAgICAgICBob3Jpem9udGFsQ29uc3RyYWludD17NX1cbiAgICAgICAgICAgIG1lbnVQb3J0YWxUYXJnZXQ9e2RvY3VtZW50LmJvZHl9XG4gICAgICAgICAgICBtZW51UG9ydGFsWkluZGV4PXszMDAwMH1cbiAgICAgICAgICAgIG9uQ2hhbmdlPXsoZXZlbnQpID0+IHtcbiAgICAgICAgICAgICAgaWYgKGV2ZW50LnRhcmdldC52YWx1ZSkge1xuICAgICAgICAgICAgICAgIHNldEFjdGl2ZVRlYW1JZChldmVudC50YXJnZXQudmFsdWUgYXMgc3RyaW5nKTtcbiAgICAgICAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICAgICAgICByZW1vdmVBY3RpdmVUZWFtSWQoKTtcbiAgICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICAgIHdpbmRvdy5sb2NhdGlvbi5yZWxvYWQoKTtcbiAgICAgICAgICAgIH19XG4gICAgICAgICAgICB2YWx1ZT17YWN0aXZlVGVhbUlkfVxuICAgICAgICAgICAgb3B0aW9ucz17b3B0aW9uc1dpdGhCb3R0b21PcHRpb259XG4gICAgICAgICAgICBzaG93T3B0aW9uR3JvdXBEaXZpZGVyXG4gICAgICAgICAgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L1NwYWNpbmdzLklubGluZT5cbiAgICAgIHtpc0xpbWl0ZWRQZXJtaXNzaW9uICYmXG4gICAgICAgIHBvcnRhbENvbnRhaW5lciAmJlxuICAgICAgICBSZWFjdERPTS5jcmVhdGVQb3J0YWwoY29udGFpbmVyLCBwb3J0YWxDb250YWluZXIpfVxuICAgIDwvPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgVGVhbVN3aXRjaGVyO1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$3
+};
+const TeamSwitcher = () => {
+  const _useTeams = useTeams(),
+    options = _useTeams.options,
+    activeTeamId = _useTeams.activeTeamId,
+    isLimitedPermission = _useTeams.isLimitedPermission;
+  if (!(options !== null && options !== void 0 && options.length)) {
+    return null;
+  }
+  const bottomOption = {
+    options: [{
+      label: 'Select a team to limit permissions to those of that team.',
+      value: '',
+      isDisabled: true
+    }]
+  };
+  const optionsWithBottomOption = [{
+    options
+  }, bottomOption];
+  const portalContainer = document.querySelector("[id='left-of-profile']");
+  const container = jsx("div", {
+    "data-testid": "limited-permission",
+    css: _ref2$2,
+    children: jsx(Stamp, {
+      tone: "warning",
+      label: "Limited Permission"
+    })
+  });
+  return jsxs(Fragment, {
+    children: [jsxs(Spacings.Inline, {
+      alignItems: "center",
+      children: [jsx(Text.Detail, {
+        children: "Team"
+      }), jsx("div", {
+        css: _ref$3,
+        children: jsx(SelectInput, {
+          id: "team-selector",
+          name: "Team Selector",
+          isSearchable: true,
+          horizontalConstraint: 5,
+          menuPortalTarget: document.body,
+          menuPortalZIndex: 30000,
+          onChange: event => {
+            if (event.target.value) {
+              setActiveTeamId(event.target.value);
+            } else {
+              removeActiveTeamId();
+            }
+            window.location.reload();
+          },
+          value: activeTeamId,
+          options: optionsWithBottomOption,
+          showOptionGroupDivider: true
+        })
+      })]
+    }), isLimitedPermission && portalContainer && /*#__PURE__*/ReactDOM.createPortal(container, portalContainer)]
+  });
+};
+
+const LogEnabler = () => {
+  const history = useHistory();
+  const location = useLocation();
+  const queryParams = new _URLSearchParams(location.search);
+  const debugFromQueryParams = queryParams.get('debug');
+  const isDebugLoggingEnabled = debugFromQueryParams === 'true';
+
+  // Synchronize the debug params.
+  useEffect(() => {
+    if (debugFromQueryParams) {
+      window.sessionStorage.setItem(ENABLE_LOG_KEY, debugFromQueryParams);
+    } else {
+      // Restore the query param based on the cached state.
+      const cachedDebugState = window.sessionStorage.getItem(ENABLE_LOG_KEY);
+      if (cachedDebugState) {
+        const cachedIsDebugLoggingEnabled = cachedDebugState === 'true';
+        queryParams.set('debug', String(cachedIsDebugLoggingEnabled));
+        history.push({
+          pathname: location.pathname,
+          search: queryParams.toString()
+        });
+      }
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [debugFromQueryParams]);
+  function handleDebugLoggingChange() {
+    const nextIsDebugLoggingEnabled = !isDebugLoggingEnabled;
+
+    // Cache the new debug state value.
+    window.sessionStorage.setItem(ENABLE_LOG_KEY, String(nextIsDebugLoggingEnabled));
+
+    // Sync the state with the query params. This is what counts!
+    if (nextIsDebugLoggingEnabled) {
+      queryParams.set('debug', String(nextIsDebugLoggingEnabled));
+    } else {
+      queryParams.delete('debug');
+    }
+    history.push({
+      pathname: location.pathname,
+      search: queryParams.toString()
+    });
+  }
+  return jsx(CheckboxInput, {
+    onChange: handleDebugLoggingChange,
+    isChecked: isDebugLoggingEnabled,
+    children: "Enable Logs"
+  });
+};
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__$2() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+function getDurationBetween(type, deployedAt) {
+  const deployedDate = new Date(deployedAt);
+  const today = new Date();
+  let value;
+  switch (type) {
+    case 'minutes':
+      value = 60000;
+      break;
+    case 'hours':
+      value = 3600000;
+      break;
+    case 'days':
+    default:
+      value = 8.64e7;
+      break;
+  }
+  return Math.round(Math.abs(+deployedDate - +today) / value);
+}
+var _ref$2 = process.env.NODE_ENV === "production" ? {
+  name: "1nxezmo",
+  styles: "cursor:pointer!important;position:absolute;left:0;width:100%;button{width:100%;opacity:0;}"
+} : {
+  name: "1q8580e-DeploymentTracker",
+  styles: "cursor:pointer!important;position:absolute;left:0;width:100%;button{width:100%;opacity:0;};label:DeploymentTracker;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRlcGxveW1lbnQtdHJhY2tlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0prQiIsImZpbGUiOiJkZXBsb3ltZW50LXRyYWNrZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdXNlRWZmZWN0LCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBzb3J0QnkgZnJvbSAnbG9kYXNoL3NvcnRCeSc7XG5pbXBvcnQge1xuICBJbmZvRGlhbG9nLFxuICB1c2VNb2RhbFN0YXRlLFxufSBmcm9tICdAY29tbWVyY2V0b29scy1mcm9udGVuZC9hcHBsaWNhdGlvbi1jb21wb25lbnRzJztcbmltcG9ydCB0eXBlIHsgQXBwbGljYXRpb25XaW5kb3cgfSBmcm9tICdAY29tbWVyY2V0b29scy1mcm9udGVuZC9jb25zdGFudHMnO1xuaW1wb3J0IHtcbiAgQ29uc3RyYWludHMsXG4gIFNlY29uZGFyeUJ1dHRvbixcbiAgU3BhY2luZ3MsXG4gIFN0YW1wLFxuICBUZXh0LFxufSBmcm9tICdAY29tbWVyY2V0b29scy1mcm9udGVuZC91aS1raXQnO1xuaW1wb3J0IERpdmlkZXIgZnJvbSAnLi4vZGl2aWRlcic7XG5pbXBvcnQgeyBMT0NBTF9FTlYgfSBmcm9tICcuLi9lbnZpcm9ubWVudC1zd2l0Y2hlci9jb25zdGFudHMnO1xuXG5kZWNsYXJlIGxldCB3aW5kb3c6IEFwcGxpY2F0aW9uV2luZG93O1xudHlwZSBUVmVyc2lvbiA9IEFycmF5PHtcbiAgYXBwOiBzdHJpbmc7XG4gIGJ1aWxkOiB7XG4gICAgZGVwbG95ZWRBdDogc3RyaW5nO1xuICB9O1xufT47XG5cbmZ1bmN0aW9uIGdldER1cmF0aW9uQmV0d2VlbihcbiAgdHlwZTogJ21pbnV0ZXMnIHwgJ2hvdXJzJyB8ICdkYXlzJyxcbiAgZGVwbG95ZWRBdDogc3RyaW5nXG4pIHtcbiAgY29uc3QgZGVwbG95ZWREYXRlID0gbmV3IERhdGUoZGVwbG95ZWRBdCk7XG4gIGNvbnN0IHRvZGF5ID0gbmV3IERhdGUoKTtcbiAgbGV0IHZhbHVlO1xuICBzd2l0Y2ggKHR5cGUpIHtcbiAgICBjYXNlICdtaW51dGVzJzpcbiAgICAgIHZhbHVlID0gNjAwMDA7XG4gICAgICBicmVhaztcbiAgICBjYXNlICdob3Vycyc6XG4gICAgICB2YWx1ZSA9IDM2MDAwMDA7XG4gICAgICBicmVhaztcbiAgICBjYXNlICdkYXlzJzpcbiAgICBkZWZhdWx0OlxuICAgICAgdmFsdWUgPSA4LjY0ZTc7XG4gICAgICBicmVhaztcbiAgfVxuICByZXR1cm4gTWF0aC5yb3VuZChNYXRoLmFicygrZGVwbG95ZWREYXRlIC0gK3RvZGF5KSAvIHZhbHVlKTtcbn1cblxuY29uc3QgRGVwbG95bWVudFRyYWNrZXIgPSAoKSA9PiB7XG4gIGNvbnN0IHsgaXNNb2RhbE9wZW4sIG9wZW5Nb2RhbCwgY2xvc2VNb2RhbCB9ID0gdXNlTW9kYWxTdGF0ZSgpO1xuICBjb25zdCBbdmVyc2lvbnMsIHNldFZlcnNpb25zXSA9IHVzZVN0YXRlPFRWZXJzaW9uPihbXSk7XG4gIGNvbnN0IGdldEN1cnJlbnRBcHBsaWNhdGlvbk5hbWUgPSAoKTogc3RyaW5nID0+IHtcbiAgICBjb25zdCB7IGVudHJ5UG9pbnRVcmlQYXRoIH0gPSB3aW5kb3cuYXBwO1xuICAgIHN3aXRjaCAoZW50cnlQb2ludFVyaVBhdGgpIHtcbiAgICAgIGNhc2UgJ3dlbGNvbWUnOlxuICAgICAgICByZXR1cm4gJ2ZhbGxiYWNrJztcbiAgICAgIGRlZmF1bHQ6XG4gICAgICAgIHJldHVybiBlbnRyeVBvaW50VXJpUGF0aDtcbiAgICB9XG4gIH07XG4gIGNvbnN0IGN1cnJlbnRBcHBsaWNhdGlvbiA9IGdldEN1cnJlbnRBcHBsaWNhdGlvbk5hbWUoKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGNvbnN0IGFib3J0Q29udHJvbGxlciA9IG5ldyBBYm9ydENvbnRyb2xsZXIoKTtcblxuICAgIGNvbnN0IGZldGNoRGF0YSA9IGFzeW5jICgpID0+IHtcbiAgICAgIGxldCBVUkwgPSB3aW5kb3cubG9jYXRpb24ub3JpZ2luO1xuICAgICAgaWYgKFVSTCA9PT0gTE9DQUxfRU5WLnZhbHVlKSB7XG4gICAgICAgIHJldHVybjtcbiAgICAgIH1cbiAgICAgIHRyeSB7XG4gICAgICAgIGNvbnN0IHJlc3BvbnNlID0gYXdhaXQgZmV0Y2goYCR7VVJMfS92ZXJzaW9uc2AsIHtcbiAgICAgICAgICBzaWduYWw6IGFib3J0Q29udHJvbGxlci5zaWduYWwsXG4gICAgICAgIH0pO1xuICAgICAgICBsZXQgdmVyc2lvbnM7XG4gICAgICAgIGlmIChyZXNwb25zZS5vaykge1xuICAgICAgICAgIHZlcnNpb25zID0gYXdhaXQgcmVzcG9uc2UuanNvbigpO1xuICAgICAgICAgIHNldFZlcnNpb25zKHNvcnRCeSh2ZXJzaW9ucywgKHZlcnNpb24pID0+IHZlcnNpb24uYXBwKSk7XG4gICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgY29uc3QgZXJyb3JNZXNzYWdlID0gYEZldGNoaW5nIHRoZSB2ZXJzaW9ucyByZXR1cm5lZCBhICR7cmVzcG9uc2Uuc3RhdHVzfSBIVFRQIHN0YXR1cyBjb2RlLmA7XG4gICAgICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIG5vLWNvbnNvbGVcbiAgICAgICAgICBjb25zb2xlLmVycm9yKGVycm9yTWVzc2FnZSk7XG4gICAgICAgIH1cbiAgICAgIH0gY2F0Y2ggKGVycm9yKSB7XG4gICAgICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBuby1jb25zb2xlXG4gICAgICAgIGNvbnNvbGUuZXJyb3IoZXJyb3IpO1xuICAgICAgfVxuICAgIH07XG5cbiAgICBmZXRjaERhdGEoKTtcbiAgICByZXR1cm4gKCkgPT4ge1xuICAgICAgYWJvcnRDb250cm9sbGVyLmFib3J0KCk7XG4gICAgfTtcbiAgfSwgW10pO1xuXG4gIGNvbnN0IGdldExhc3RVcGRhdGUgPSAoXG4gICAgYXBwbGljYXRpb246IHN0cmluZ1xuICApOiB7IHZhbHVlOiBudW1iZXI7IHRleHQ6IHN0cmluZyB9ID0+IHtcbiAgICBjb25zdCBkZXBsb3llZEF0ID0gdmVyc2lvbnMuZmluZCgodmVyc2lvbikgPT4gdmVyc2lvbi5hcHAgPT09IGFwcGxpY2F0aW9uKVxuICAgICAgPy5idWlsZD8uZGVwbG95ZWRBdDtcblxuICAgIGlmICghZGVwbG95ZWRBdCkge1xuICAgICAgcmV0dXJuIHsgdmFsdWU6IDAsIHRleHQ6ICctLScgfTtcbiAgICB9XG5cbiAgICB2YXIgZGF5cyA9IGdldER1cmF0aW9uQmV0d2VlbignZGF5cycsIGRlcGxveWVkQXQpO1xuICAgIGlmIChkYXlzIDwgMSkge1xuICAgICAgdmFyIGhvdXJzID0gZ2V0RHVyYXRpb25CZXR3ZWVuKCdob3VycycsIGRlcGxveWVkQXQpO1xuICAgICAgaWYgKGhvdXJzIDwgMSkge1xuICAgICAgICBjb25zdCBtaW51dGVzID0gZ2V0RHVyYXRpb25CZXR3ZWVuKCdtaW51dGVzJywgZGVwbG95ZWRBdCk7XG4gICAgICAgIHJldHVybiB7XG4gICAgICAgICAgdmFsdWU6IE51bWJlcihtaW51dGVzLnRvRml4ZWQoMCkpLFxuICAgICAgICAgIHRleHQ6IGAke21pbnV0ZXMudG9GaXhlZCgwKX0gbWludXRlcyBhZ29gLFxuICAgICAgICB9O1xuICAgICAgfVxuICAgICAgcmV0dXJuIHtcbiAgICAgICAgdmFsdWU6IE51bWJlcihob3Vycy50b0ZpeGVkKDApKSxcbiAgICAgICAgdGV4dDogYCR7aG91cnMudG9GaXhlZCgwKX0gaG91cnMgYWdvYCxcbiAgICAgIH07XG4gICAgfVxuICAgIHJldHVybiB7XG4gICAgICB2YWx1ZTogTnVtYmVyKGRheXMudG9GaXhlZCgwKSksXG4gICAgICB0ZXh0OiBgJHtkYXlzLnRvRml4ZWQoMCl9IGRheXMgYWdvYCxcbiAgICB9O1xuICB9O1xuXG4gIGNvbnN0IGdldFRvbmUgPSAoeyB2YWx1ZSwgdGV4dCB9OiB7IHZhbHVlOiBudW1iZXI7IHRleHQ6IHN0cmluZyB9KSA9PiB7XG4gICAgaWYgKHRleHQuaW5jbHVkZXMoJ2RheXMnKSkge1xuICAgICAgaWYgKHZhbHVlID49IDUpIHJldHVybiAnY3JpdGljYWwnO1xuICAgICAgaWYgKHZhbHVlID49IDIpIHJldHVybiAnd2FybmluZyc7XG4gICAgfVxuICAgIHJldHVybiAncHJpbWFyeSc7XG4gIH07XG5cbiAgaWYgKCF2ZXJzaW9ucz8ubGVuZ3RoKSByZXR1cm4gbnVsbDtcbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgICAgYH1cbiAgICA+XG4gICAgICA8U3RhbXAgdG9uZT17Z2V0VG9uZShnZXRMYXN0VXBkYXRlKGN1cnJlbnRBcHBsaWNhdGlvbikpfT5cbiAgICAgICAgTGFzdCBkZXBsb3llZDoge2dldExhc3RVcGRhdGUoY3VycmVudEFwcGxpY2F0aW9uKS50ZXh0fVxuICAgICAgICA8ZGl2XG4gICAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgICBjdXJzb3I6IHBvaW50ZXIgIWltcG9ydGFudDtcbiAgICAgICAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgICAgICAgIGxlZnQ6IDA7XG4gICAgICAgICAgICB3aWR0aDogMTAwJTtcbiAgICAgICAgICAgIGJ1dHRvbiB7XG4gICAgICAgICAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgICAgICAgICBvcGFjaXR5OiAwO1xuICAgICAgICAgICAgfVxuICAgICAgICAgIGB9XG4gICAgICAgID5cbiAgICAgICAgICA8U2Vjb25kYXJ5QnV0dG9uIGxhYmVsPVwiXCIgb25DbGljaz17b3Blbk1vZGFsfSBzaXplPVwibWVkaXVtXCIgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L1N0YW1wPlxuICAgICAgPEluZm9EaWFsb2dcbiAgICAgICAgaXNPcGVuPXtpc01vZGFsT3Blbn1cbiAgICAgICAgdGl0bGU9eydBcHAgRGVwbG95bWVudCBpbmZvcm1hdGlvbid9XG4gICAgICAgIG9uQ2xvc2U9e2Nsb3NlTW9kYWx9XG4gICAgICA+XG4gICAgICAgIDxTcGFjaW5ncy5TdGFjaz5cbiAgICAgICAgICB7dmVyc2lvbnMubWFwKCh2ZXJzaW9uKSA9PiAoXG4gICAgICAgICAgICA8PlxuICAgICAgICAgICAgICA8U3BhY2luZ3MuSW5saW5lIGtleT17dmVyc2lvbi5hcHB9IGp1c3RpZnlDb250ZW50PVwic3BhY2UtYmV0d2VlblwiPlxuICAgICAgICAgICAgICAgIDxDb25zdHJhaW50cy5Ib3Jpem9udGFsIG1heD17Nn0+XG4gICAgICAgICAgICAgICAgICA8VGV4dC5Cb2R5Pnt2ZXJzaW9uLmFwcH08L1RleHQuQm9keT5cbiAgICAgICAgICAgICAgICA8L0NvbnN0cmFpbnRzLkhvcml6b250YWw+XG4gICAgICAgICAgICAgICAgPFN0YW1wIHRvbmU9e2dldFRvbmUoZ2V0TGFzdFVwZGF0ZSh2ZXJzaW9uLmFwcCkpfT5cbiAgICAgICAgICAgICAgICAgIHtnZXRMYXN0VXBkYXRlKHZlcnNpb24uYXBwKS50ZXh0fVxuICAgICAgICAgICAgICAgIDwvU3RhbXA+XG4gICAgICAgICAgICAgIDwvU3BhY2luZ3MuSW5saW5lPlxuICAgICAgICAgICAgICA8RGl2aWRlciAvPlxuICAgICAgICAgICAgPC8+XG4gICAgICAgICAgKSl9XG4gICAgICAgIDwvU3BhY2luZ3MuU3RhY2s+XG4gICAgICA8L0luZm9EaWFsb2c+XG4gICAgPC9kaXY+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBEZXBsb3ltZW50VHJhY2tlcjtcbiJdfQ== */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$2
+};
+var _ref2$1 = process.env.NODE_ENV === "production" ? {
+  name: "bjn8wh",
+  styles: "position:relative"
+} : {
+  name: "6dj265-DeploymentTracker",
+  styles: "position:relative;label:DeploymentTracker;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRlcGxveW1lbnQtdHJhY2tlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBeUljIiwiZmlsZSI6ImRlcGxveW1lbnQtdHJhY2tlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyB1c2VFZmZlY3QsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHNvcnRCeSBmcm9tICdsb2Rhc2gvc29ydEJ5JztcbmltcG9ydCB7XG4gIEluZm9EaWFsb2csXG4gIHVzZU1vZGFsU3RhdGUsXG59IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL2FwcGxpY2F0aW9uLWNvbXBvbmVudHMnO1xuaW1wb3J0IHR5cGUgeyBBcHBsaWNhdGlvbldpbmRvdyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL2NvbnN0YW50cyc7XG5pbXBvcnQge1xuICBDb25zdHJhaW50cyxcbiAgU2Vjb25kYXJ5QnV0dG9uLFxuICBTcGFjaW5ncyxcbiAgU3RhbXAsXG4gIFRleHQsXG59IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL3VpLWtpdCc7XG5pbXBvcnQgRGl2aWRlciBmcm9tICcuLi9kaXZpZGVyJztcbmltcG9ydCB7IExPQ0FMX0VOViB9IGZyb20gJy4uL2Vudmlyb25tZW50LXN3aXRjaGVyL2NvbnN0YW50cyc7XG5cbmRlY2xhcmUgbGV0IHdpbmRvdzogQXBwbGljYXRpb25XaW5kb3c7XG50eXBlIFRWZXJzaW9uID0gQXJyYXk8e1xuICBhcHA6IHN0cmluZztcbiAgYnVpbGQ6IHtcbiAgICBkZXBsb3llZEF0OiBzdHJpbmc7XG4gIH07XG59PjtcblxuZnVuY3Rpb24gZ2V0RHVyYXRpb25CZXR3ZWVuKFxuICB0eXBlOiAnbWludXRlcycgfCAnaG91cnMnIHwgJ2RheXMnLFxuICBkZXBsb3llZEF0OiBzdHJpbmdcbikge1xuICBjb25zdCBkZXBsb3llZERhdGUgPSBuZXcgRGF0ZShkZXBsb3llZEF0KTtcbiAgY29uc3QgdG9kYXkgPSBuZXcgRGF0ZSgpO1xuICBsZXQgdmFsdWU7XG4gIHN3aXRjaCAodHlwZSkge1xuICAgIGNhc2UgJ21pbnV0ZXMnOlxuICAgICAgdmFsdWUgPSA2MDAwMDtcbiAgICAgIGJyZWFrO1xuICAgIGNhc2UgJ2hvdXJzJzpcbiAgICAgIHZhbHVlID0gMzYwMDAwMDtcbiAgICAgIGJyZWFrO1xuICAgIGNhc2UgJ2RheXMnOlxuICAgIGRlZmF1bHQ6XG4gICAgICB2YWx1ZSA9IDguNjRlNztcbiAgICAgIGJyZWFrO1xuICB9XG4gIHJldHVybiBNYXRoLnJvdW5kKE1hdGguYWJzKCtkZXBsb3llZERhdGUgLSArdG9kYXkpIC8gdmFsdWUpO1xufVxuXG5jb25zdCBEZXBsb3ltZW50VHJhY2tlciA9ICgpID0+IHtcbiAgY29uc3QgeyBpc01vZGFsT3Blbiwgb3Blbk1vZGFsLCBjbG9zZU1vZGFsIH0gPSB1c2VNb2RhbFN0YXRlKCk7XG4gIGNvbnN0IFt2ZXJzaW9ucywgc2V0VmVyc2lvbnNdID0gdXNlU3RhdGU8VFZlcnNpb24+KFtdKTtcbiAgY29uc3QgZ2V0Q3VycmVudEFwcGxpY2F0aW9uTmFtZSA9ICgpOiBzdHJpbmcgPT4ge1xuICAgIGNvbnN0IHsgZW50cnlQb2ludFVyaVBhdGggfSA9IHdpbmRvdy5hcHA7XG4gICAgc3dpdGNoIChlbnRyeVBvaW50VXJpUGF0aCkge1xuICAgICAgY2FzZSAnd2VsY29tZSc6XG4gICAgICAgIHJldHVybiAnZmFsbGJhY2snO1xuICAgICAgZGVmYXVsdDpcbiAgICAgICAgcmV0dXJuIGVudHJ5UG9pbnRVcmlQYXRoO1xuICAgIH1cbiAgfTtcbiAgY29uc3QgY3VycmVudEFwcGxpY2F0aW9uID0gZ2V0Q3VycmVudEFwcGxpY2F0aW9uTmFtZSgpO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgY29uc3QgYWJvcnRDb250cm9sbGVyID0gbmV3IEFib3J0Q29udHJvbGxlcigpO1xuXG4gICAgY29uc3QgZmV0Y2hEYXRhID0gYXN5bmMgKCkgPT4ge1xuICAgICAgbGV0IFVSTCA9IHdpbmRvdy5sb2NhdGlvbi5vcmlnaW47XG4gICAgICBpZiAoVVJMID09PSBMT0NBTF9FTlYudmFsdWUpIHtcbiAgICAgICAgcmV0dXJuO1xuICAgICAgfVxuICAgICAgdHJ5IHtcbiAgICAgICAgY29uc3QgcmVzcG9uc2UgPSBhd2FpdCBmZXRjaChgJHtVUkx9L3ZlcnNpb25zYCwge1xuICAgICAgICAgIHNpZ25hbDogYWJvcnRDb250cm9sbGVyLnNpZ25hbCxcbiAgICAgICAgfSk7XG4gICAgICAgIGxldCB2ZXJzaW9ucztcbiAgICAgICAgaWYgKHJlc3BvbnNlLm9rKSB7XG4gICAgICAgICAgdmVyc2lvbnMgPSBhd2FpdCByZXNwb25zZS5qc29uKCk7XG4gICAgICAgICAgc2V0VmVyc2lvbnMoc29ydEJ5KHZlcnNpb25zLCAodmVyc2lvbikgPT4gdmVyc2lvbi5hcHApKTtcbiAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICBjb25zdCBlcnJvck1lc3NhZ2UgPSBgRmV0Y2hpbmcgdGhlIHZlcnNpb25zIHJldHVybmVkIGEgJHtyZXNwb25zZS5zdGF0dXN9IEhUVFAgc3RhdHVzIGNvZGUuYDtcbiAgICAgICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgbm8tY29uc29sZVxuICAgICAgICAgIGNvbnNvbGUuZXJyb3IoZXJyb3JNZXNzYWdlKTtcbiAgICAgICAgfVxuICAgICAgfSBjYXRjaCAoZXJyb3IpIHtcbiAgICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIG5vLWNvbnNvbGVcbiAgICAgICAgY29uc29sZS5lcnJvcihlcnJvcik7XG4gICAgICB9XG4gICAgfTtcblxuICAgIGZldGNoRGF0YSgpO1xuICAgIHJldHVybiAoKSA9PiB7XG4gICAgICBhYm9ydENvbnRyb2xsZXIuYWJvcnQoKTtcbiAgICB9O1xuICB9LCBbXSk7XG5cbiAgY29uc3QgZ2V0TGFzdFVwZGF0ZSA9IChcbiAgICBhcHBsaWNhdGlvbjogc3RyaW5nXG4gICk6IHsgdmFsdWU6IG51bWJlcjsgdGV4dDogc3RyaW5nIH0gPT4ge1xuICAgIGNvbnN0IGRlcGxveWVkQXQgPSB2ZXJzaW9ucy5maW5kKCh2ZXJzaW9uKSA9PiB2ZXJzaW9uLmFwcCA9PT0gYXBwbGljYXRpb24pXG4gICAgICA/LmJ1aWxkPy5kZXBsb3llZEF0O1xuXG4gICAgaWYgKCFkZXBsb3llZEF0KSB7XG4gICAgICByZXR1cm4geyB2YWx1ZTogMCwgdGV4dDogJy0tJyB9O1xuICAgIH1cblxuICAgIHZhciBkYXlzID0gZ2V0RHVyYXRpb25CZXR3ZWVuKCdkYXlzJywgZGVwbG95ZWRBdCk7XG4gICAgaWYgKGRheXMgPCAxKSB7XG4gICAgICB2YXIgaG91cnMgPSBnZXREdXJhdGlvbkJldHdlZW4oJ2hvdXJzJywgZGVwbG95ZWRBdCk7XG4gICAgICBpZiAoaG91cnMgPCAxKSB7XG4gICAgICAgIGNvbnN0IG1pbnV0ZXMgPSBnZXREdXJhdGlvbkJldHdlZW4oJ21pbnV0ZXMnLCBkZXBsb3llZEF0KTtcbiAgICAgICAgcmV0dXJuIHtcbiAgICAgICAgICB2YWx1ZTogTnVtYmVyKG1pbnV0ZXMudG9GaXhlZCgwKSksXG4gICAgICAgICAgdGV4dDogYCR7bWludXRlcy50b0ZpeGVkKDApfSBtaW51dGVzIGFnb2AsXG4gICAgICAgIH07XG4gICAgICB9XG4gICAgICByZXR1cm4ge1xuICAgICAgICB2YWx1ZTogTnVtYmVyKGhvdXJzLnRvRml4ZWQoMCkpLFxuICAgICAgICB0ZXh0OiBgJHtob3Vycy50b0ZpeGVkKDApfSBob3VycyBhZ29gLFxuICAgICAgfTtcbiAgICB9XG4gICAgcmV0dXJuIHtcbiAgICAgIHZhbHVlOiBOdW1iZXIoZGF5cy50b0ZpeGVkKDApKSxcbiAgICAgIHRleHQ6IGAke2RheXMudG9GaXhlZCgwKX0gZGF5cyBhZ29gLFxuICAgIH07XG4gIH07XG5cbiAgY29uc3QgZ2V0VG9uZSA9ICh7IHZhbHVlLCB0ZXh0IH06IHsgdmFsdWU6IG51bWJlcjsgdGV4dDogc3RyaW5nIH0pID0+IHtcbiAgICBpZiAodGV4dC5pbmNsdWRlcygnZGF5cycpKSB7XG4gICAgICBpZiAodmFsdWUgPj0gNSkgcmV0dXJuICdjcml0aWNhbCc7XG4gICAgICBpZiAodmFsdWUgPj0gMikgcmV0dXJuICd3YXJuaW5nJztcbiAgICB9XG4gICAgcmV0dXJuICdwcmltYXJ5JztcbiAgfTtcblxuICBpZiAoIXZlcnNpb25zPy5sZW5ndGgpIHJldHVybiBudWxsO1xuICByZXR1cm4gKFxuICAgIDxkaXZcbiAgICAgIGNzcz17Y3NzYFxuICAgICAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgICBgfVxuICAgID5cbiAgICAgIDxTdGFtcCB0b25lPXtnZXRUb25lKGdldExhc3RVcGRhdGUoY3VycmVudEFwcGxpY2F0aW9uKSl9PlxuICAgICAgICBMYXN0IGRlcGxveWVkOiB7Z2V0TGFzdFVwZGF0ZShjdXJyZW50QXBwbGljYXRpb24pLnRleHR9XG4gICAgICAgIDxkaXZcbiAgICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICAgIGN1cnNvcjogcG9pbnRlciAhaW1wb3J0YW50O1xuICAgICAgICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgICAgICAgICAgbGVmdDogMDtcbiAgICAgICAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgICAgICAgYnV0dG9uIHtcbiAgICAgICAgICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICAgICAgICAgIG9wYWNpdHk6IDA7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgPlxuICAgICAgICAgIDxTZWNvbmRhcnlCdXR0b24gbGFiZWw9XCJcIiBvbkNsaWNrPXtvcGVuTW9kYWx9IHNpemU9XCJtZWRpdW1cIiAvPlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvU3RhbXA+XG4gICAgICA8SW5mb0RpYWxvZ1xuICAgICAgICBpc09wZW49e2lzTW9kYWxPcGVufVxuICAgICAgICB0aXRsZT17J0FwcCBEZXBsb3ltZW50IGluZm9ybWF0aW9uJ31cbiAgICAgICAgb25DbG9zZT17Y2xvc2VNb2RhbH1cbiAgICAgID5cbiAgICAgICAgPFNwYWNpbmdzLlN0YWNrPlxuICAgICAgICAgIHt2ZXJzaW9ucy5tYXAoKHZlcnNpb24pID0+IChcbiAgICAgICAgICAgIDw+XG4gICAgICAgICAgICAgIDxTcGFjaW5ncy5JbmxpbmUga2V5PXt2ZXJzaW9uLmFwcH0ganVzdGlmeUNvbnRlbnQ9XCJzcGFjZS1iZXR3ZWVuXCI+XG4gICAgICAgICAgICAgICAgPENvbnN0cmFpbnRzLkhvcml6b250YWwgbWF4PXs2fT5cbiAgICAgICAgICAgICAgICAgIDxUZXh0LkJvZHk+e3ZlcnNpb24uYXBwfTwvVGV4dC5Cb2R5PlxuICAgICAgICAgICAgICAgIDwvQ29uc3RyYWludHMuSG9yaXpvbnRhbD5cbiAgICAgICAgICAgICAgICA8U3RhbXAgdG9uZT17Z2V0VG9uZShnZXRMYXN0VXBkYXRlKHZlcnNpb24uYXBwKSl9PlxuICAgICAgICAgICAgICAgICAge2dldExhc3RVcGRhdGUodmVyc2lvbi5hcHApLnRleHR9XG4gICAgICAgICAgICAgICAgPC9TdGFtcD5cbiAgICAgICAgICAgICAgPC9TcGFjaW5ncy5JbmxpbmU+XG4gICAgICAgICAgICAgIDxEaXZpZGVyIC8+XG4gICAgICAgICAgICA8Lz5cbiAgICAgICAgICApKX1cbiAgICAgICAgPC9TcGFjaW5ncy5TdGFjaz5cbiAgICAgIDwvSW5mb0RpYWxvZz5cbiAgICA8L2Rpdj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IERlcGxveW1lbnRUcmFja2VyO1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$2
+};
+const DeploymentTracker = () => {
+  const _useModalState = useModalState(),
+    isModalOpen = _useModalState.isModalOpen,
+    openModal = _useModalState.openModal,
+    closeModal = _useModalState.closeModal;
+  const _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    versions = _useState2[0],
+    setVersions = _useState2[1];
+  const getCurrentApplicationName = () => {
+    const entryPointUriPath = window.app.entryPointUriPath;
+    switch (entryPointUriPath) {
+      case 'welcome':
+        return 'fallback';
+      default:
+        return entryPointUriPath;
+    }
+  };
+  const currentApplication = getCurrentApplicationName();
+  useEffect(() => {
+    const abortController = new AbortController();
+    const fetchData = async () => {
+      let URL = window.location.origin;
+      if (URL === LOCAL_ENV.value) {
+        return;
+      }
+      try {
+        const response = await fetch("".concat(URL, "/versions"), {
+          signal: abortController.signal
+        });
+        let versions;
+        if (response.ok) {
+          versions = await response.json();
+          setVersions(sortBy(versions, version => version.app));
+        } else {
+          const errorMessage = "Fetching the versions returned a ".concat(response.status, " HTTP status code.");
+          // eslint-disable-next-line no-console
+          console.error(errorMessage);
+        }
+      } catch (error) {
+        // eslint-disable-next-line no-console
+        console.error(error);
+      }
+    };
+    fetchData();
+    return () => {
+      abortController.abort();
+    };
+  }, []);
+  const getLastUpdate = application => {
+    var _versions$find;
+    const deployedAt = (_versions$find = _findInstanceProperty(versions).call(versions, version => version.app === application)) === null || _versions$find === void 0 || (_versions$find = _versions$find.build) === null || _versions$find === void 0 ? void 0 : _versions$find.deployedAt;
+    if (!deployedAt) {
+      return {
+        value: 0,
+        text: '--'
+      };
+    }
+    var days = getDurationBetween('days', deployedAt);
+    if (days < 1) {
+      var hours = getDurationBetween('hours', deployedAt);
+      if (hours < 1) {
+        const minutes = getDurationBetween('minutes', deployedAt);
+        return {
+          value: Number(minutes.toFixed(0)),
+          text: "".concat(minutes.toFixed(0), " minutes ago")
+        };
+      }
+      return {
+        value: Number(hours.toFixed(0)),
+        text: "".concat(hours.toFixed(0), " hours ago")
+      };
+    }
+    return {
+      value: Number(days.toFixed(0)),
+      text: "".concat(days.toFixed(0), " days ago")
+    };
+  };
+  const getTone = _ref3 => {
+    let value = _ref3.value,
+      text = _ref3.text;
+    if (_includesInstanceProperty(text).call(text, 'days')) {
+      if (value >= 5) return 'critical';
+      if (value >= 2) return 'warning';
+    }
+    return 'primary';
+  };
+  if (!(versions !== null && versions !== void 0 && versions.length)) return null;
+  return jsxs("div", {
+    css: _ref2$1,
+    children: [jsxs(Stamp, {
+      tone: getTone(getLastUpdate(currentApplication)),
+      children: ["Last deployed: ", getLastUpdate(currentApplication).text, jsx("div", {
+        css: _ref$2,
+        children: jsx(SecondaryButton, {
+          label: "",
+          onClick: openModal,
+          size: "medium"
+        })
+      })]
+    }), jsx(InfoDialog, {
+      isOpen: isModalOpen,
+      title: 'App Deployment information',
+      onClose: closeModal,
+      children: jsx(Spacings.Stack, {
+        children: _mapInstanceProperty(versions).call(versions, version => jsxs(Fragment, {
+          children: [jsxs(Spacings.Inline, {
+            justifyContent: "space-between",
+            children: [jsx(Constraints.Horizontal, {
+              max: 6,
+              children: jsx(Text.Body, {
+                children: version.app
+              })
+            }), jsx(Stamp, {
+              tone: getTone(getLastUpdate(version.app)),
+              children: getLastUpdate(version.app).text
+            })]
+          }, version.app), jsx(Divider, {})]
+        }))
+      })
+    })]
+  });
+};
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__$1() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var _ref$1 = process.env.NODE_ENV === "production" ? {
+  name: "tkfx1x",
+  styles: ">button{margin-right:27px!important;}"
+} : {
+  name: "9bxmbw-StaffBarInfo",
+  styles: ">button{margin-right:27px!important;};label:StaffBarInfo;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0YWZmLWJhci1pbmZvLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQmMiLCJmaWxlIjoic3RhZmYtYmFyLWluZm8udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHtcbiAgSW5mb0RpYWxvZyxcbiAgdXNlTW9kYWxTdGF0ZSxcbn0gZnJvbSAnQGNvbW1lcmNldG9vbHMtZnJvbnRlbmQvYXBwbGljYXRpb24tY29tcG9uZW50cyc7XG5pbXBvcnQge1xuICBJY29uQnV0dG9uLFxuICBJbmZvcm1hdGlvbkljb24sXG4gIFRleHQsXG59IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL3VpLWtpdCc7XG5cbmZ1bmN0aW9uIFN0YWZmQmFySW5mbygpIHtcbiAgY29uc3QgaW5mb01vZGFsU3RhdGUgPSB1c2VNb2RhbFN0YXRlKCk7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgPiBidXR0b24ge1xuICAgICAgICAgIG1hcmdpbi1yaWdodDogMjdweCAhaW1wb3J0YW50O1xuICAgICAgICB9XG4gICAgICBgfVxuICAgID5cbiAgICAgIDxJY29uQnV0dG9uXG4gICAgICAgIHNpemU9XCJtZWRpdW1cIlxuICAgICAgICBsYWJlbD1cIlwiXG4gICAgICAgIGljb249ezxJbmZvcm1hdGlvbkljb24gLz59XG4gICAgICAgIG9uQ2xpY2s9eygpID0+IHtcbiAgICAgICAgICBpbmZvTW9kYWxTdGF0ZS5vcGVuTW9kYWwoKTtcbiAgICAgICAgfX1cbiAgICAgIC8+XG4gICAgICA8SW5mb0RpYWxvZ1xuICAgICAgICBpc09wZW49e2luZm9Nb2RhbFN0YXRlLmlzTW9kYWxPcGVufVxuICAgICAgICB0aXRsZT17J0Fib3V0IHRoZSBTdGFmZiBiYXInfVxuICAgICAgICBvbkNsb3NlPXtpbmZvTW9kYWxTdGF0ZS5jbG9zZU1vZGFsfVxuICAgICAgICBnZXRQYXJlbnRTZWxlY3Rvcj17KCkgPT4gZG9jdW1lbnQuYm9keX1cbiAgICAgICAgekluZGV4PXszMDAwMH1cbiAgICAgICAgc2l6ZT17MTJ9XG4gICAgICA+XG4gICAgICAgIDxUZXh0LkRldGFpbD5cbiAgICAgICAgICBTdGFmZiBiYXIgaXMgYW4gZXhwZXJpbWVudGFsIGZlYXR1cmUgYXZhaWxhYmxlIG9ubHkgdG8gY29tbWVyY2V0b29sc1xuICAgICAgICAgIGVtcGxveWVlcy4gSXQgYWxsb3dzIHRvIHF1aWNrbHkgc3dpdGNoIGVudmlyb25tZW50LCB0b2dnbGUgZGlmZmVyZW50XG4gICAgICAgICAgZmVhdHVyZSBmbGFncyBhbmQgb3RoZXIgdXNlZnVsIGFjdGlvbnMuIFRoaXMgZmVhdHVyZSBpcyBub3QgdmlzaWJsZSB0b1xuICAgICAgICAgIGVuZCBjdXN0b21lcnMgbm9yIHBhcnRuZXJzLlxuICAgICAgICA8L1RleHQuRGV0YWlsPlxuICAgICAgPC9JbmZvRGlhbG9nPlxuICAgIDwvZGl2PlxuICApO1xufVxuXG5leHBvcnQgZGVmYXVsdCBTdGFmZkJhckluZm87XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$1
+};
+function StaffBarInfo() {
+  const infoModalState = useModalState();
+  return jsxs("div", {
+    css: _ref$1,
+    children: [jsx(IconButton, {
+      size: "medium",
+      label: "",
+      icon: jsx(InformationIcon, {}),
+      onClick: () => {
+        infoModalState.openModal();
+      }
+    }), jsx(InfoDialog, {
+      isOpen: infoModalState.isModalOpen,
+      title: 'About the Staff bar',
+      onClose: infoModalState.closeModal,
+      getParentSelector: () => document.body,
+      zIndex: 30000,
+      size: 12,
+      children: jsx(Text.Detail, {
+        children: "Staff bar is an experimental feature available only to commercetools employees. It allows to quickly switch environment, toggle different feature flags and other useful actions. This feature is not visible to end customers nor partners."
+      })
+    })]
+  });
+}
+
+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; }
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var _ref = process.env.NODE_ENV === "production" ? {
+  name: "16u25pc",
+  styles: "position:absolute;height:24px;width:56px;background:var(--color-accent-10);box-shadow:0px 1px 2px rgba(0, 0, 0, 0.25);border-radius:0px 0px 4px 4px;left:calc(50% - 23px);bottom:-23px;cursor:pointer;z-index:30000;display:flex;align-items:center;justify-content:center;:hover{background:var(--color-accent-20);}"
+} : {
+  name: "y4jgqz-container",
+  styles: "position:absolute;height:24px;width:56px;background:var(--color-accent-10);box-shadow:0px 1px 2px rgba(0, 0, 0, 0.25);border-radius:0px 0px 4px 4px;left:calc(50% - 23px);bottom:-23px;cursor:pointer;z-index:30000;display:flex;align-items:center;justify-content:center;:hover{background:var(--color-accent-20);};label:container;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0YWZmLWJhci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBcURrQiIsImZpbGUiOiJzdGFmZi1iYXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgUmVhY3RET00gZnJvbSAncmVhY3QtZG9tJztcbmltcG9ydCB7IE1hcmtpbmcgYXMgRnVsbFN0b3J5TWFya2luZyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL2Z1bGxzdG9yeSc7XG5pbXBvcnQge1xuICBBbmdsZURvd25JY29uLFxuICBBbmdsZVVwSWNvbixcbiAgU3BhY2luZ3MsXG59IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL3VpLWtpdCc7XG5pbXBvcnQge1xuICBFbnZpcm9ubWVudFN3aXRjaGVyLFxuICBGZWF0dXJlRmxhZ1RvZ2dsZXIsXG4gIEdpdGh1YlB1bGxSZXF1ZXN0TGluayxcbiAgTG9nRW5hYmxlcixcbiAgVGVhbVN3aXRjaGVyLFxuICBEZXBsb3ltZW50VHJhY2tlcixcbiAgU3RhZmZCYXJJbmZvLFxufSBmcm9tICcuL2NvbXBvbmVudHMnO1xuaW1wb3J0IHsgSVNfU1RBRkZCQVJfT1BFTiB9IGZyb20gJy4vY29tcG9uZW50cy9lbnZpcm9ubWVudC1zd2l0Y2hlci9jb25zdGFudHMnO1xuaW1wb3J0IHVzZVN0YWZmQmFyVXNlciBmcm9tICcuL2hvb2tzL3VzZS1zdGFmZi1iYXItdXNlcic7XG5pbXBvcnQgdHlwZSB7IFRTdGFmZkJhckNvbnRhaW5lclByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmRlY2xhcmUgZ2xvYmFsIHtcbiAgaW50ZXJmYWNlIFdpbmRvdyB7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uby1leHBsaWNpdC1hbnlcbiAgICBDeXByZXNzOiBhbnk7XG4gIH1cbn1cblxuZnVuY3Rpb24gU3RhZmZCYXIocHJvcHM6IFRTdGFmZkJhckNvbnRhaW5lclByb3BzKSB7XG4gIGNvbnN0IHsgaXNTdGFmZk1lbWJlciwgZXJyb3IgfSA9IHVzZVN0YWZmQmFyVXNlcigpO1xuXG4gIGNvbnN0IFtpc1N0YWZmQmFyT3Blbiwgc2V0SXNTdGFmZkJhck9wZW5dID0gdXNlU3RhdGUoXG4gICAgbG9jYWxTdG9yYWdlLmdldEl0ZW0oSVNfU1RBRkZCQVJfT1BFTikgPT09ICd0cnVlJ1xuICApO1xuXG4gIGNvbnN0IGNvbnRhaW5lciA9IChcbiAgICA8ZGl2XG4gICAgICB7Li4uRnVsbFN0b3J5TWFya2luZy5hcHBseU1hcmtlcignU3RhZmYgQmFyJyl9XG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgICAgYH1cbiAgICA+XG4gICAgICA8ZGl2XG4gICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgIGhlaWdodDogJHtpc1N0YWZmQmFyT3BlbiA/ICc1NnB4JyA6ICcwJ307XG4gICAgICAgICAgYmFja2dyb3VuZDogdmFyKC0tY29sb3ItbmV1dHJhbC05NSk7XG4gICAgICAgICAgdHJhbnNpdGlvbjogaGVpZ2h0IDE1MG1zO1xuICAgICAgICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxkaXZcbiAgICAgICAgICBkYXRhLXRlc3RpZD1cInN0YWZmYmFyLWhhbmRsZVwiXG4gICAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICAgICAgICBoZWlnaHQ6IDI0cHg7XG4gICAgICAgICAgICB3aWR0aDogNTZweDtcbiAgICAgICAgICAgIGJhY2tncm91bmQ6IHZhcigtLWNvbG9yLWFjY2VudC0xMCk7XG4gICAgICAgICAgICBib3gtc2hhZG93OiAwcHggMXB4IDJweCByZ2JhKDAsIDAsIDAsIDAuMjUpO1xuICAgICAgICAgICAgYm9yZGVyLXJhZGl1czogMHB4IDBweCA0cHggNHB4O1xuICAgICAgICAgICAgbGVmdDogY2FsYyg1MCUgLSAyM3B4KTtcbiAgICAgICAgICAgIGJvdHRvbTogLTIzcHg7XG4gICAgICAgICAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgICAgICAgICB6LWluZGV4OiAzMDAwMDtcbiAgICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICA6aG92ZXIge1xuICAgICAgICAgICAgICBiYWNrZ3JvdW5kOiB2YXIoLS1jb2xvci1hY2NlbnQtMjApO1xuICAgICAgICAgICAgfVxuICAgICAgICAgIGB9XG4gICAgICAgICAgb25DbGljaz17KCkgPT4ge1xuICAgICAgICAgICAgbG9jYWxTdG9yYWdlLnNldEl0ZW0oXG4gICAgICAgICAgICAgIElTX1NUQUZGQkFSX09QRU4sXG4gICAgICAgICAgICAgICghaXNTdGFmZkJhck9wZW4pLnRvU3RyaW5nKClcbiAgICAgICAgICAgICk7XG4gICAgICAgICAgICBzZXRJc1N0YWZmQmFyT3BlbighaXNTdGFmZkJhck9wZW4pO1xuICAgICAgICAgIH19XG4gICAgICAgID5cbiAgICAgICAgICB7aXNTdGFmZkJhck9wZW4gPyAoXG4gICAgICAgICAgICA8QW5nbGVVcEljb24gY29sb3I9XCJzdXJmYWNlXCIgc2l6ZT1cIm1lZGl1bVwiIC8+XG4gICAgICAgICAgKSA6IChcbiAgICAgICAgICAgIDxBbmdsZURvd25JY29uIGNvbG9yPVwic3VyZmFjZVwiIHNpemU9XCJtZWRpdW1cIiAvPlxuICAgICAgICAgICl9XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8U3BhY2luZ3MuSW5zZXRTcXVpc2ggc2NhbGU9XCJtXCI+XG4gICAgICAgICAgPFNwYWNpbmdzLklubGluZSBqdXN0aWZ5Q29udGVudD1cInNwYWNlLWJldHdlZW5cIiBhbGlnbkl0ZW1zPVwiY2VudGVyXCI+XG4gICAgICAgICAgICA8U3BhY2luZ3MuSW5saW5lIHNjYWxlPVwibFwiPlxuICAgICAgICAgICAgICA8R2l0aHViUHVsbFJlcXVlc3RMaW5rIC8+XG4gICAgICAgICAgICAgIDxGZWF0dXJlRmxhZ1RvZ2dsZXIgZmVhdHVyZUZsYWdzPXtwcm9wcy5mZWF0dXJlRmxhZ3N9IC8+XG4gICAgICAgICAgICAgIDxFbnZpcm9ubWVudFN3aXRjaGVyIC8+XG4gICAgICAgICAgICAgIDxUZWFtU3dpdGNoZXIgLz5cbiAgICAgICAgICAgICAgey8qIG90aGVyIHRvb2xzIGdvZXMgaGVyZSAqL31cbiAgICAgICAgICAgIDwvU3BhY2luZ3MuSW5saW5lPlxuICAgICAgICAgICAgPFNwYWNpbmdzLklubGluZSBzY2FsZT1cImxcIiBhbGlnbkl0ZW1zPVwiY2VudGVyXCI+XG4gICAgICAgICAgICAgIDxEZXBsb3ltZW50VHJhY2tlciAvPlxuICAgICAgICAgICAgICA8TG9nRW5hYmxlciAvPlxuICAgICAgICAgICAgICA8U3RhZmZCYXJJbmZvIC8+XG4gICAgICAgICAgICA8L1NwYWNpbmdzLklubGluZT5cbiAgICAgICAgICA8L1NwYWNpbmdzLklubGluZT5cbiAgICAgICAgPC9TcGFjaW5ncy5JbnNldFNxdWlzaD5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuICApO1xuXG4gIGNvbnN0IHBvcnRhbENvbnRhaW5lciA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCdhYm92ZS10b3AtbmF2aWdhdGlvbicpO1xuXG4gIGlmIChlcnJvciB8fCAhaXNTdGFmZk1lbWJlciB8fCAhcG9ydGFsQ29udGFpbmVyKSByZXR1cm4gbnVsbDtcbiAgcmV0dXJuIFJlYWN0RE9NLmNyZWF0ZVBvcnRhbChjb250YWluZXIsIHBvcnRhbENvbnRhaW5lcik7XG59XG5cbmV4cG9ydCBkZWZhdWx0IFN0YWZmQmFyO1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+var _ref2 = process.env.NODE_ENV === "production" ? {
+  name: "bjn8wh",
+  styles: "position:relative"
+} : {
+  name: "p4e9kp-container",
+  styles: "position:relative;label:container;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0YWZmLWJhci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUNjIiwiZmlsZSI6InN0YWZmLWJhci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBSZWFjdERPTSBmcm9tICdyZWFjdC1kb20nO1xuaW1wb3J0IHsgTWFya2luZyBhcyBGdWxsU3RvcnlNYXJraW5nIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtZnJvbnRlbmQvZnVsbHN0b3J5JztcbmltcG9ydCB7XG4gIEFuZ2xlRG93bkljb24sXG4gIEFuZ2xlVXBJY29uLFxuICBTcGFjaW5ncyxcbn0gZnJvbSAnQGNvbW1lcmNldG9vbHMtZnJvbnRlbmQvdWkta2l0JztcbmltcG9ydCB7XG4gIEVudmlyb25tZW50U3dpdGNoZXIsXG4gIEZlYXR1cmVGbGFnVG9nZ2xlcixcbiAgR2l0aHViUHVsbFJlcXVlc3RMaW5rLFxuICBMb2dFbmFibGVyLFxuICBUZWFtU3dpdGNoZXIsXG4gIERlcGxveW1lbnRUcmFja2VyLFxuICBTdGFmZkJhckluZm8sXG59IGZyb20gJy4vY29tcG9uZW50cyc7XG5pbXBvcnQgeyBJU19TVEFGRkJBUl9PUEVOIH0gZnJvbSAnLi9jb21wb25lbnRzL2Vudmlyb25tZW50LXN3aXRjaGVyL2NvbnN0YW50cyc7XG5pbXBvcnQgdXNlU3RhZmZCYXJVc2VyIGZyb20gJy4vaG9va3MvdXNlLXN0YWZmLWJhci11c2VyJztcbmltcG9ydCB0eXBlIHsgVFN0YWZmQmFyQ29udGFpbmVyUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcblxuZGVjbGFyZSBnbG9iYWwge1xuICBpbnRlcmZhY2UgV2luZG93IHtcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25vLWV4cGxpY2l0LWFueVxuICAgIEN5cHJlc3M6IGFueTtcbiAgfVxufVxuXG5mdW5jdGlvbiBTdGFmZkJhcihwcm9wczogVFN0YWZmQmFyQ29udGFpbmVyUHJvcHMpIHtcbiAgY29uc3QgeyBpc1N0YWZmTWVtYmVyLCBlcnJvciB9ID0gdXNlU3RhZmZCYXJVc2VyKCk7XG5cbiAgY29uc3QgW2lzU3RhZmZCYXJPcGVuLCBzZXRJc1N0YWZmQmFyT3Blbl0gPSB1c2VTdGF0ZShcbiAgICBsb2NhbFN0b3JhZ2UuZ2V0SXRlbShJU19TVEFGRkJBUl9PUEVOKSA9PT0gJ3RydWUnXG4gICk7XG5cbiAgY29uc3QgY29udGFpbmVyID0gKFxuICAgIDxkaXZcbiAgICAgIHsuLi5GdWxsU3RvcnlNYXJraW5nLmFwcGx5TWFya2VyKCdTdGFmZiBCYXInKX1cbiAgICAgIGNzcz17Y3NzYFxuICAgICAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgICBgfVxuICAgID5cbiAgICAgIDxkaXZcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgaGVpZ2h0OiAke2lzU3RhZmZCYXJPcGVuID8gJzU2cHgnIDogJzAnfTtcbiAgICAgICAgICBiYWNrZ3JvdW5kOiB2YXIoLS1jb2xvci1uZXV0cmFsLTk1KTtcbiAgICAgICAgICB0cmFuc2l0aW9uOiBoZWlnaHQgMTUwbXM7XG4gICAgICAgICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICAgICAgYH1cbiAgICAgID5cbiAgICAgICAgPGRpdlxuICAgICAgICAgIGRhdGEtdGVzdGlkPVwic3RhZmZiYXItaGFuZGxlXCJcbiAgICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgICAgICAgIGhlaWdodDogMjRweDtcbiAgICAgICAgICAgIHdpZHRoOiA1NnB4O1xuICAgICAgICAgICAgYmFja2dyb3VuZDogdmFyKC0tY29sb3ItYWNjZW50LTEwKTtcbiAgICAgICAgICAgIGJveC1zaGFkb3c6IDBweCAxcHggMnB4IHJnYmEoMCwgMCwgMCwgMC4yNSk7XG4gICAgICAgICAgICBib3JkZXItcmFkaXVzOiAwcHggMHB4IDRweCA0cHg7XG4gICAgICAgICAgICBsZWZ0OiBjYWxjKDUwJSAtIDIzcHgpO1xuICAgICAgICAgICAgYm90dG9tOiAtMjNweDtcbiAgICAgICAgICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICAgICAgICAgIHotaW5kZXg6IDMwMDAwO1xuICAgICAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICAgICAgICAgIDpob3ZlciB7XG4gICAgICAgICAgICAgIGJhY2tncm91bmQ6IHZhcigtLWNvbG9yLWFjY2VudC0yMCk7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgYH1cbiAgICAgICAgICBvbkNsaWNrPXsoKSA9PiB7XG4gICAgICAgICAgICBsb2NhbFN0b3JhZ2Uuc2V0SXRlbShcbiAgICAgICAgICAgICAgSVNfU1RBRkZCQVJfT1BFTixcbiAgICAgICAgICAgICAgKCFpc1N0YWZmQmFyT3BlbikudG9TdHJpbmcoKVxuICAgICAgICAgICAgKTtcbiAgICAgICAgICAgIHNldElzU3RhZmZCYXJPcGVuKCFpc1N0YWZmQmFyT3Blbik7XG4gICAgICAgICAgfX1cbiAgICAgICAgPlxuICAgICAgICAgIHtpc1N0YWZmQmFyT3BlbiA/IChcbiAgICAgICAgICAgIDxBbmdsZVVwSWNvbiBjb2xvcj1cInN1cmZhY2VcIiBzaXplPVwibWVkaXVtXCIgLz5cbiAgICAgICAgICApIDogKFxuICAgICAgICAgICAgPEFuZ2xlRG93bkljb24gY29sb3I9XCJzdXJmYWNlXCIgc2l6ZT1cIm1lZGl1bVwiIC8+XG4gICAgICAgICAgKX1cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxTcGFjaW5ncy5JbnNldFNxdWlzaCBzY2FsZT1cIm1cIj5cbiAgICAgICAgICA8U3BhY2luZ3MuSW5saW5lIGp1c3RpZnlDb250ZW50PVwic3BhY2UtYmV0d2VlblwiIGFsaWduSXRlbXM9XCJjZW50ZXJcIj5cbiAgICAgICAgICAgIDxTcGFjaW5ncy5JbmxpbmUgc2NhbGU9XCJsXCI+XG4gICAgICAgICAgICAgIDxHaXRodWJQdWxsUmVxdWVzdExpbmsgLz5cbiAgICAgICAgICAgICAgPEZlYXR1cmVGbGFnVG9nZ2xlciBmZWF0dXJlRmxhZ3M9e3Byb3BzLmZlYXR1cmVGbGFnc30gLz5cbiAgICAgICAgICAgICAgPEVudmlyb25tZW50U3dpdGNoZXIgLz5cbiAgICAgICAgICAgICAgPFRlYW1Td2l0Y2hlciAvPlxuICAgICAgICAgICAgICB7Lyogb3RoZXIgdG9vbHMgZ29lcyBoZXJlICovfVxuICAgICAgICAgICAgPC9TcGFjaW5ncy5JbmxpbmU+XG4gICAgICAgICAgICA8U3BhY2luZ3MuSW5saW5lIHNjYWxlPVwibFwiIGFsaWduSXRlbXM9XCJjZW50ZXJcIj5cbiAgICAgICAgICAgICAgPERlcGxveW1lbnRUcmFja2VyIC8+XG4gICAgICAgICAgICAgIDxMb2dFbmFibGVyIC8+XG4gICAgICAgICAgICAgIDxTdGFmZkJhckluZm8gLz5cbiAgICAgICAgICAgIDwvU3BhY2luZ3MuSW5saW5lPlxuICAgICAgICAgIDwvU3BhY2luZ3MuSW5saW5lPlxuICAgICAgICA8L1NwYWNpbmdzLkluc2V0U3F1aXNoPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gICk7XG5cbiAgY29uc3QgcG9ydGFsQ29udGFpbmVyID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoJ2Fib3ZlLXRvcC1uYXZpZ2F0aW9uJyk7XG5cbiAgaWYgKGVycm9yIHx8ICFpc1N0YWZmTWVtYmVyIHx8ICFwb3J0YWxDb250YWluZXIpIHJldHVybiBudWxsO1xuICByZXR1cm4gUmVhY3RET00uY3JlYXRlUG9ydGFsKGNvbnRhaW5lciwgcG9ydGFsQ29udGFpbmVyKTtcbn1cblxuZXhwb3J0IGRlZmF1bHQgU3RhZmZCYXI7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+function StaffBar(props) {
+  const _useStaffBarUser = useStaffBarUser(),
+    isStaffMember = _useStaffBarUser.isStaffMember,
+    error = _useStaffBarUser.error;
+  const _useState = useState(localStorage.getItem(IS_STAFFBAR_OPEN) === 'true'),
+    _useState2 = _slicedToArray(_useState, 2),
+    isStaffBarOpen = _useState2[0],
+    setIsStaffBarOpen = _useState2[1];
+  const container = jsx("div", _objectSpread(_objectSpread({}, Marking.applyMarker('Staff Bar')), {}, {
+    css: _ref2,
+    children: jsxs("div", {
+      css: /*#__PURE__*/css("height:", isStaffBarOpen ? '56px' : '0', ";background:var(--color-neutral-95);transition:height 150ms;overflow:hidden;" + (process.env.NODE_ENV === "production" ? "" : ";label:container;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0YWZmLWJhci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNENnQiIsImZpbGUiOiJzdGFmZi1iYXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgUmVhY3RET00gZnJvbSAncmVhY3QtZG9tJztcbmltcG9ydCB7IE1hcmtpbmcgYXMgRnVsbFN0b3J5TWFya2luZyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL2Z1bGxzdG9yeSc7XG5pbXBvcnQge1xuICBBbmdsZURvd25JY29uLFxuICBBbmdsZVVwSWNvbixcbiAgU3BhY2luZ3MsXG59IGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL3VpLWtpdCc7XG5pbXBvcnQge1xuICBFbnZpcm9ubWVudFN3aXRjaGVyLFxuICBGZWF0dXJlRmxhZ1RvZ2dsZXIsXG4gIEdpdGh1YlB1bGxSZXF1ZXN0TGluayxcbiAgTG9nRW5hYmxlcixcbiAgVGVhbVN3aXRjaGVyLFxuICBEZXBsb3ltZW50VHJhY2tlcixcbiAgU3RhZmZCYXJJbmZvLFxufSBmcm9tICcuL2NvbXBvbmVudHMnO1xuaW1wb3J0IHsgSVNfU1RBRkZCQVJfT1BFTiB9IGZyb20gJy4vY29tcG9uZW50cy9lbnZpcm9ubWVudC1zd2l0Y2hlci9jb25zdGFudHMnO1xuaW1wb3J0IHVzZVN0YWZmQmFyVXNlciBmcm9tICcuL2hvb2tzL3VzZS1zdGFmZi1iYXItdXNlcic7XG5pbXBvcnQgdHlwZSB7IFRTdGFmZkJhckNvbnRhaW5lclByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmRlY2xhcmUgZ2xvYmFsIHtcbiAgaW50ZXJmYWNlIFdpbmRvdyB7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uby1leHBsaWNpdC1hbnlcbiAgICBDeXByZXNzOiBhbnk7XG4gIH1cbn1cblxuZnVuY3Rpb24gU3RhZmZCYXIocHJvcHM6IFRTdGFmZkJhckNvbnRhaW5lclByb3BzKSB7XG4gIGNvbnN0IHsgaXNTdGFmZk1lbWJlciwgZXJyb3IgfSA9IHVzZVN0YWZmQmFyVXNlcigpO1xuXG4gIGNvbnN0IFtpc1N0YWZmQmFyT3Blbiwgc2V0SXNTdGFmZkJhck9wZW5dID0gdXNlU3RhdGUoXG4gICAgbG9jYWxTdG9yYWdlLmdldEl0ZW0oSVNfU1RBRkZCQVJfT1BFTikgPT09ICd0cnVlJ1xuICApO1xuXG4gIGNvbnN0IGNvbnRhaW5lciA9IChcbiAgICA8ZGl2XG4gICAgICB7Li4uRnVsbFN0b3J5TWFya2luZy5hcHBseU1hcmtlcignU3RhZmYgQmFyJyl9XG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgICAgYH1cbiAgICA+XG4gICAgICA8ZGl2XG4gICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgIGhlaWdodDogJHtpc1N0YWZmQmFyT3BlbiA/ICc1NnB4JyA6ICcwJ307XG4gICAgICAgICAgYmFja2dyb3VuZDogdmFyKC0tY29sb3ItbmV1dHJhbC05NSk7XG4gICAgICAgICAgdHJhbnNpdGlvbjogaGVpZ2h0IDE1MG1zO1xuICAgICAgICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIDxkaXZcbiAgICAgICAgICBkYXRhLXRlc3RpZD1cInN0YWZmYmFyLWhhbmRsZVwiXG4gICAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICAgICAgICBoZWlnaHQ6IDI0cHg7XG4gICAgICAgICAgICB3aWR0aDogNTZweDtcbiAgICAgICAgICAgIGJhY2tncm91bmQ6IHZhcigtLWNvbG9yLWFjY2VudC0xMCk7XG4gICAgICAgICAgICBib3gtc2hhZG93OiAwcHggMXB4IDJweCByZ2JhKDAsIDAsIDAsIDAuMjUpO1xuICAgICAgICAgICAgYm9yZGVyLXJhZGl1czogMHB4IDBweCA0cHggNHB4O1xuICAgICAgICAgICAgbGVmdDogY2FsYyg1MCUgLSAyM3B4KTtcbiAgICAgICAgICAgIGJvdHRvbTogLTIzcHg7XG4gICAgICAgICAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgICAgICAgICB6LWluZGV4OiAzMDAwMDtcbiAgICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICA6aG92ZXIge1xuICAgICAgICAgICAgICBiYWNrZ3JvdW5kOiB2YXIoLS1jb2xvci1hY2NlbnQtMjApO1xuICAgICAgICAgICAgfVxuICAgICAgICAgIGB9XG4gICAgICAgICAgb25DbGljaz17KCkgPT4ge1xuICAgICAgICAgICAgbG9jYWxTdG9yYWdlLnNldEl0ZW0oXG4gICAgICAgICAgICAgIElTX1NUQUZGQkFSX09QRU4sXG4gICAgICAgICAgICAgICghaXNTdGFmZkJhck9wZW4pLnRvU3RyaW5nKClcbiAgICAgICAgICAgICk7XG4gICAgICAgICAgICBzZXRJc1N0YWZmQmFyT3BlbighaXNTdGFmZkJhck9wZW4pO1xuICAgICAgICAgIH19XG4gICAgICAgID5cbiAgICAgICAgICB7aXNTdGFmZkJhck9wZW4gPyAoXG4gICAgICAgICAgICA8QW5nbGVVcEljb24gY29sb3I9XCJzdXJmYWNlXCIgc2l6ZT1cIm1lZGl1bVwiIC8+XG4gICAgICAgICAgKSA6IChcbiAgICAgICAgICAgIDxBbmdsZURvd25JY29uIGNvbG9yPVwic3VyZmFjZVwiIHNpemU9XCJtZWRpdW1cIiAvPlxuICAgICAgICAgICl9XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8U3BhY2luZ3MuSW5zZXRTcXVpc2ggc2NhbGU9XCJtXCI+XG4gICAgICAgICAgPFNwYWNpbmdzLklubGluZSBqdXN0aWZ5Q29udGVudD1cInNwYWNlLWJldHdlZW5cIiBhbGlnbkl0ZW1zPVwiY2VudGVyXCI+XG4gICAgICAgICAgICA8U3BhY2luZ3MuSW5saW5lIHNjYWxlPVwibFwiPlxuICAgICAgICAgICAgICA8R2l0aHViUHVsbFJlcXVlc3RMaW5rIC8+XG4gICAgICAgICAgICAgIDxGZWF0dXJlRmxhZ1RvZ2dsZXIgZmVhdHVyZUZsYWdzPXtwcm9wcy5mZWF0dXJlRmxhZ3N9IC8+XG4gICAgICAgICAgICAgIDxFbnZpcm9ubWVudFN3aXRjaGVyIC8+XG4gICAgICAgICAgICAgIDxUZWFtU3dpdGNoZXIgLz5cbiAgICAgICAgICAgICAgey8qIG90aGVyIHRvb2xzIGdvZXMgaGVyZSAqL31cbiAgICAgICAgICAgIDwvU3BhY2luZ3MuSW5saW5lPlxuICAgICAgICAgICAgPFNwYWNpbmdzLklubGluZSBzY2FsZT1cImxcIiBhbGlnbkl0ZW1zPVwiY2VudGVyXCI+XG4gICAgICAgICAgICAgIDxEZXBsb3ltZW50VHJhY2tlciAvPlxuICAgICAgICAgICAgICA8TG9nRW5hYmxlciAvPlxuICAgICAgICAgICAgICA8U3RhZmZCYXJJbmZvIC8+XG4gICAgICAgICAgICA8L1NwYWNpbmdzLklubGluZT5cbiAgICAgICAgICA8L1NwYWNpbmdzLklubGluZT5cbiAgICAgICAgPC9TcGFjaW5ncy5JbnNldFNxdWlzaD5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuICApO1xuXG4gIGNvbnN0IHBvcnRhbENvbnRhaW5lciA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCdhYm92ZS10b3AtbmF2aWdhdGlvbicpO1xuXG4gIGlmIChlcnJvciB8fCAhaXNTdGFmZk1lbWJlciB8fCAhcG9ydGFsQ29udGFpbmVyKSByZXR1cm4gbnVsbDtcbiAgcmV0dXJuIFJlYWN0RE9NLmNyZWF0ZVBvcnRhbChjb250YWluZXIsIHBvcnRhbENvbnRhaW5lcik7XG59XG5cbmV4cG9ydCBkZWZhdWx0IFN0YWZmQmFyO1xuIl19 */"),
+      children: [jsx("div", {
+        "data-testid": "staffbar-handle",
+        css: _ref,
+        onClick: () => {
+          localStorage.setItem(IS_STAFFBAR_OPEN, (!isStaffBarOpen).toString());
+          setIsStaffBarOpen(!isStaffBarOpen);
+        },
+        children: isStaffBarOpen ? jsx(AngleUpIcon, {
+          color: "surface",
+          size: "medium"
+        }) : jsx(AngleDownIcon, {
+          color: "surface",
+          size: "medium"
+        })
+      }), jsx(Spacings.InsetSquish, {
+        scale: "m",
+        children: jsxs(Spacings.Inline, {
+          justifyContent: "space-between",
+          alignItems: "center",
+          children: [jsxs(Spacings.Inline, {
+            scale: "l",
+            children: [jsx(GitHubPullRequestLink, {}), jsx(FeatureFlagToggler, {
+              featureFlags: props.featureFlags
+            }), jsx(EnvironmentSwitcher, {}), jsx(TeamSwitcher, {})]
+          }), jsxs(Spacings.Inline, {
+            scale: "l",
+            alignItems: "center",
+            children: [jsx(DeploymentTracker, {}), jsx(LogEnabler, {}), jsx(StaffBarInfo, {})]
+          })]
+        })
+      })]
+    })
+  }));
+  const portalContainer = document.getElementById('above-top-navigation');
+  if (error || !isStaffMember || !portalContainer) return null;
+  return /*#__PURE__*/ReactDOM.createPortal(container, portalContainer);
+}
+
+export { StaffBar as default };