@atlaskit/teams-public 0.60.1 → 0.60.2

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/teams-public
 
+## 0.60.2
+
+### Patch Changes
+
+- [`5a90d813d811b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5a90d813d811b) -
+  Update onCreateTeam to pass requested teams
+- [`5a90d813d811b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5a90d813d811b) -
+  Tweak requested containers logic to work with changes to UC experiment
+
 ## 0.60.1
 
 ### Patch Changes

package/dist/cjs/common/ui/container-icon/index.compiled.css

@@ -8,6 +8,7 @@
 ._1bsb1u1b{width:34px}
 ._1e0c1txw{display:flex}
 ._1qu2nqa1{outline-style:solid}
+._1ul91tcg{min-width:24px}
 ._2hwxv77o{margin-right:var(--ds-space-025,2px)}
 ._4cvr1h6o{align-items:center}
 ._4t3i1tcg{height:24px}

package/dist/cjs/common/ui/container-icon/index.js

@@ -15,7 +15,7 @@ var _compiled = require("@atlaskit/primitives/compiled");
 var _loomAvatar = require("../loom-avatar");
 var styles = {
   globeIconWrapperMedium: "_2rko1mok _1bsb1u1b _4t3i1u1b _1e0c1txw _4cvr1h6o _1bah1h6o _12jimuej _1qu2nqa1 _bfhkqbzx",
-  globeIconWrapperSmall: "_2rkolb4i _1bsb1tcg _4t3i1tcg _1e0c1txw _4cvr1h6o _1bah1h6o _19pkv77o _2hwxv77o _otyrv77o _18u0v77o _12jimuej _1qu2nqa1 _bfhkqbzx",
+  globeIconWrapperSmall: "_2rkolb4i _1ul91tcg _4t3i1tcg _1e0c1txw _4cvr1h6o _1bah1h6o _19pkv77o _2hwxv77o _otyrv77o _18u0v77o _12jimuej _1qu2nqa1 _bfhkqbzx",
   skeletonMedium: "_2rko1mok _bfhkn82g _1bsb1u1b _4t3i1u1b",
   skeletonSmall: "_2rkolb4i _bfhkn82g _1bsb1tcg _4t3i1tcg"
 };

package/dist/cjs/common/ui/loom-avatar/main.compiled.css

@@ -4,10 +4,14 @@
 ._189ee4h9{border-width:var(--ds-border-width,1px)}
 ._1dqonqa1{border-style:solid}
 ._1h6dmuej{border-color:var(--ds-border,#091e4224)}
+._18u0v77o{margin-left:var(--ds-space-025,2px)}
+._19pkv77o{margin-top:var(--ds-space-025,2px)}
 ._1bah1h6o{justify-content:center}
-._1bsb1tcg{width:24px}
 ._1bsbzwfg{width:2pc}
 ._1e0c1txw{display:flex}
+._1ul9qslr{min-width:22px}
+._2hwxv77o{margin-right:var(--ds-space-025,2px)}
 ._4cvr1h6o{align-items:center}
-._4t3i1tcg{height:24px}
-._4t3izwfg{height:2pc}
+._4t3iqslr{height:22px}
+._4t3izwfg{height:2pc}
+._otyrv77o{margin-bottom:var(--ds-space-025,2px)}

package/dist/cjs/common/ui/loom-avatar/main.js

@@ -30,6 +30,6 @@ function LoomSpaceAvatar(_ref) {
       color: textColor
     },
     "data-testid": testId,
-    className: (0, _runtime.ax)(["_2rko12b0 _189ee4h9 _1dqonqa1 _1h6dmuej _1e0c1txw _4cvr1h6o _1bah1h6o", size === 'small' ? "_11c8140y _4t3i1tcg _1bsb1tcg" : "_11c8lodh _4t3izwfg _1bsbzwfg"])
+    className: (0, _runtime.ax)(["_2rko12b0 _189ee4h9 _1dqonqa1 _1h6dmuej _1e0c1txw _4cvr1h6o _1bah1h6o", size === 'small' ? "_11c8140y _4t3iqslr _1ul9qslr _19pkv77o _2hwxv77o _otyrv77o _18u0v77o" : "_11c8lodh _4t3izwfg _1bsbzwfg"])
   }, avatarText);
 }

package/dist/cjs/common/utils/get-container-properties.js

@@ -11,10 +11,10 @@ var _runtime = require("@compiled/react/runtime");
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _reactIntlNext = require("react-intl-next");
+var _featureGateJsClient = _interopRequireDefault(require("@atlaskit/feature-gate-js-client"));
 var _link = _interopRequireDefault(require("@atlaskit/icon/core/link"));
 var _linkExternal = _interopRequireDefault(require("@atlaskit/icon/core/link-external"));
 var _image = _interopRequireDefault(require("@atlaskit/image"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _ConfluenceIcon = _interopRequireDefault(require("../assets/ConfluenceIcon.svg"));
 var _JiraIcon = _interopRequireDefault(require("../assets/JiraIcon.svg"));
@@ -126,7 +126,7 @@ var getJiraContainerProperties = function getJiraContainerProperties(_ref) {
   var containerTypeProperties = _ref.containerTypeProperties,
     _ref$iconSize = _ref.iconSize,
     iconSize = _ref$iconSize === void 0 ? 'small' : _ref$iconSize;
-  var newTeamProfilePage = (0, _platformFeatureFlags.fg)('enable_new_team_profile');
+  var newTeamProfilePage = _featureGateJsClient.default.getExperimentValue('new_team_profile', 'isEnabled', false);
   var _ref2 = containerTypeProperties || {},
     subType = _ref2.subType,
     name = _ref2.name;
@@ -162,7 +162,7 @@ var getJiraContainerProperties = function getJiraContainerProperties(_ref) {
 var getWebLinkContainerProperties = function getWebLinkContainerProperties(_ref3) {
   var isEmptyContainer = _ref3.isEmptyContainer,
     isDisplayedOnProfileCard = _ref3.isDisplayedOnProfileCard;
-  var newTeamProfilePage = (0, _platformFeatureFlags.fg)('enable_new_team_profile');
+  var newTeamProfilePage = _featureGateJsClient.default.getExperimentValue('new_team_profile', 'isEnabled', false);
   return {
     description: isEmptyContainer ? /*#__PURE__*/_react.default.createElement(_compiled.Text, {
       size: "medium",
@@ -196,7 +196,7 @@ var getContainerProperties = exports.getContainerProperties = function getContai
     containerTypeProperties = _ref4.containerTypeProperties,
     isEmptyContainer = _ref4.isEmptyContainer,
     isDisplayedOnProfileCard = _ref4.isDisplayedOnProfileCard;
-  var newTeamProfilePage = (0, _platformFeatureFlags.fg)('enable_new_team_profile');
+  var newTeamProfilePage = _featureGateJsClient.default.getExperimentValue('new_team_profile', 'isEnabled', false);
   switch (containerType) {
     case 'ConfluenceSpace':
       return {

package/dist/cjs/controllers/hooks/use-requested-container/index.js

@@ -11,9 +11,11 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
+var _analyticsNext = require("@atlaskit/analytics-next");
 var _linkExternal = _interopRequireDefault(require("@atlaskit/icon/core/link-external"));
 var _compiled = require("@atlaskit/primitives/compiled");
 var _teamsClient = require("@atlaskit/teams-client");
+var _analytics = require("../../../common/utils/analytics");
 var _useTeamContainers2 = require("../use-team-containers");
 var _utils = require("./utils");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
@@ -47,12 +49,15 @@ function useRequestedContainers(_ref) {
     _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
     refetchErrorCount = _useState4[0],
     setRefetchErrorCount = _useState4[1];
-  var _useState5 = (0, _react.useState)(function () {
-      return (0, _utils.getRequestedContainersFromUrl)();
-    }),
+  var _usePeopleAndTeamAnal = (0, _analytics.usePeopleAndTeamAnalytics)(),
+    fireTrackEvent = _usePeopleAndTeamAnal.fireTrackEvent;
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  var _useState5 = (0, _react.useState)([]),
     _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
     requestedContainers = _useState6[0],
     setRequestedContainers = _useState6[1];
+  var requestedContainersRef = (0, _react.useRef)([]);
   var checkContainers = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
     return _regenerator.default.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
@@ -81,15 +86,18 @@ function useRequestedContainers(_ref) {
     if (!onRequestedContainerTimeout) {
       return;
     }
-    var flagId = "requested-container-timeout-".concat(requestedContainers.join('-'), "-").concat(tryAgainCountRef.current);
+    var reqContainers = requestedContainersRef.current;
+    var flagId = "requested-container-timeout-".concat(reqContainers.join('-'), "-").concat(tryAgainCountRef.current);
     var createTryAgainFlag = function createTryAgainFlag(_ref4) {
       var onAction = _ref4.onAction;
       return {
         id: flagId,
-        title: requestedContainers.length === 1 ? formatMessage(messages.timeoutTitle, {
-          container: (0, _utils.containerDisplayName)(requestedContainers[0])
+        title: reqContainers.length === 1 ? formatMessage(messages.timeoutTitle, {
+          container: (0, _utils.containerDisplayName)(reqContainers[0])
         }) : formatMessage(messages.timeoutTitleMultiple),
         description: formatMessage(messages.timeoutDescription),
+        appearance: 'error',
+        type: 'error',
         actions: [{
           content: formatMessage(messages.timeoutAction),
           onClick: function onClick() {
@@ -105,6 +113,8 @@ function useRequestedContainers(_ref) {
         id: flagId,
         title: formatMessage(messages.noConnectionTitle),
         description: formatMessage(messages.noConnectionDescription),
+        appearance: 'error',
+        type: 'error',
         actions: [{
           content: /*#__PURE__*/_react.default.createElement(_compiled.Flex, {
             alignItems: "center",
@@ -127,9 +137,7 @@ function useRequestedContainers(_ref) {
             case 0:
               setIsTryingAgain(true);
               tryAgainCountRef.current = tryAgainCountRef.current + 1;
-
-              //todo: add analytics event here
-              containers = requestedContainers.map(function (container) {
+              containers = reqContainers.map(function (container) {
                 return {
                   type: (0, _utils.convertContainerToType)(container),
                   containerSiteId: cloudId
@@ -138,73 +146,92 @@ function useRequestedContainers(_ref) {
                 var type = _ref7.type;
                 return Boolean(type);
               });
-              _context2.prev = 3;
-              _context2.next = 6;
+              fireTrackEvent(createAnalyticsEvent, {
+                action: 'tryAgain',
+                actionSubject: 'requestedContainers',
+                // @ts-ignore
+                attributes: {
+                  containers: reqContainers,
+                  teamId: teamId
+                }
+              });
+              _context2.prev = 4;
+              _context2.next = 7;
               return _teamsClient.teamsClient.createTeamContainers({
                 teamId: teamId,
                 containers: containers
               });
-            case 6:
+            case 7:
               response = _context2.sent;
-              containersNotCreated = requestedContainers.filter(function (containerType) {
+              containersNotCreated = reqContainers.filter(function (containerType) {
                 var _response$containersC;
                 return !((_response$containersC = response.containersCreated) !== null && _response$containersC !== void 0 && _response$containersC.some(function (container) {
                   return container.containerType === (0, _utils.convertContainerToType)(containerType);
                 }));
               }); //containers are still being created
               if (!(containersNotCreated.length > 0)) {
-                _context2.next = 12;
+                _context2.next = 13;
                 break;
               }
               startPolling();
-              _context2.next = 15;
+              _context2.next = 16;
               break;
-            case 12:
+            case 13:
               //all containers created so reset and update state
               reset();
-              _context2.next = 15;
+              _context2.next = 16;
               return refetchTeamContainers();
-            case 15:
-              _context2.next = 24;
+            case 16:
+              _context2.next = 25;
               break;
-            case 17:
-              _context2.prev = 17;
-              _context2.t0 = _context2["catch"](3);
+            case 18:
+              _context2.prev = 18;
+              _context2.t0 = _context2["catch"](4);
               if (!(_context2.t0 instanceof _teamsClient.HttpError)) {
-                _context2.next = 23;
+                _context2.next = 24;
                 break;
               }
               if (!(_context2.t0.status === 500)) {
-                _context2.next = 23;
+                _context2.next = 24;
                 break;
               }
-              if (!(tryAgainCountRef.current < 2)) {
-                _context2.next = 23;
+              if (!(tryAgainCountRef.current <= 2)) {
+                _context2.next = 24;
                 break;
               }
               return _context2.abrupt("return", setTimeout(function () {
                 //bug: this can cause two flags to be shown
                 _tryAgainAction();
               }, _utils.POLLING_INTERVAL));
-            case 23:
-              onRequestedContainerTimeout(createContactSupportFlag);
             case 24:
-              _context2.prev = 24;
+              onRequestedContainerTimeout(createContactSupportFlag);
+            case 25:
+              _context2.prev = 25;
               setIsTryingAgain(false);
-              return _context2.finish(24);
-            case 27:
+              return _context2.finish(25);
+            case 28:
             case "end":
               return _context2.stop();
           }
-        }, _callee2, null, [[3, 17, 24, 27]]);
+        }, _callee2, null, [[4, 18, 25, 28]]);
       }));
       return function tryAgainAction() {
         return _ref6.apply(this, arguments);
       };
     }();
+    fireTrackEvent(createAnalyticsEvent, {
+      action: 'failed',
+      actionSubject: 'requestedContainers',
+      attributes: {
+        // @ts-ignore
+        containers: reqContainers,
+        teamId: teamId,
+        tryAgainCount: tryAgainCountRef.current
+      }
+    });
     (0, _utils.removeRequestedContainersFromUrl)();
     onRequestedContainerTimeout(tryAgainCountRef.current === 0 ? createTryAgainFlag : createContactSupportFlag);
-  }, [cloudId, formatMessage, onRequestedContainerTimeout, refetchTeamContainers, requestedContainers, teamId]);
+  }, [cloudId, formatMessage, onRequestedContainerTimeout, refetchTeamContainers, teamId, createAnalyticsEvent, fireTrackEvent]);
   var _useAsyncPolling = (0, _utils.useAsyncPolling)(checkContainers, {
       onTimeout: onTimeout
     }),
@@ -213,14 +240,29 @@ function useRequestedContainers(_ref) {
     isPolling = _useAsyncPolling.isPolling,
     hasTimedOut = _useAsyncPolling.hasTimedOut;
   (0, _react.useEffect)(function () {
-    if (!(0, _utils.userCanAccessFeature)()) {
-      return;
+    var containers = (0, _utils.getRequestedContainersFromUrl)();
+    if (containers.length > 0 && isPolling === false) {
+      setRequestedContainers(containers);
+      startPolling();
     }
-
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  (0, _react.useEffect)(function () {
+    requestedContainersRef.current = requestedContainers;
+  }, [requestedContainers]);
+  (0, _react.useEffect)(function () {
     //stop gap to prevent sending too many failed errors
     if (refetchErrorCount > 3) {
       stopPolling();
-      //todo: add analytics event here
+      fireTrackEvent(createAnalyticsEvent, {
+        action: 'failed',
+        actionSubject: 'requestedContainers',
+        attributes: {
+          // @ts-ignore
+          containers: requestedContainers,
+          teamId: teamId
+        }
+      });
       return;
     }
     if (hasTimedOut || isTryingAgain) {
@@ -232,11 +274,7 @@ function useRequestedContainers(_ref) {
       stopPolling();
       return;
     }
-    if (!isPolling && containerCount > 0) {
-      setIsTryingAgain(false);
-      startPolling();
-    }
-  }, [isPolling, refetchErrorCount, requestedContainers.length, hasTimedOut, startPolling, stopPolling, isTryingAgain]);
+  }, [isPolling, refetchErrorCount, requestedContainers, hasTimedOut, startPolling, stopPolling, isTryingAgain, teamId, createAnalyticsEvent, fireTrackEvent]);
   (0, _react.useEffect)(function () {
     var containersNotFound = requestedContainers.filter(function (containerType) {
       return !teamContainers.some(function (teamContainer) {
@@ -246,7 +284,7 @@ function useRequestedContainers(_ref) {
     if (!(0, _utils.containersEqual)(containersNotFound, requestedContainers)) {
       setRequestedContainers(containersNotFound);
     }
-  }, [requestedContainers, checkContainers, teamContainers]);
+  }, [requestedContainers, checkContainers, teamContainers, isPolling]);
   var containersLoading = (0, _react.useMemo)(function () {
     return hasTimedOut && !isTryingAgain || refetchErrorCount > 3 ? [] : requestedContainers;
   }, [hasTimedOut, requestedContainers, isTryingAgain, refetchErrorCount]);

package/dist/cjs/controllers/hooks/use-requested-container/utils.js

@@ -11,14 +11,12 @@ exports.convertContainerToType = convertContainerToType;
 exports.getRequestedContainersFromUrl = getRequestedContainersFromUrl;
 exports.removeRequestedContainersFromUrl = removeRequestedContainersFromUrl;
 exports.useAsyncPolling = useAsyncPolling;
-exports.userCanAccessFeature = userCanAccessFeature;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
-var _featureGateJsClient = _interopRequireDefault(require("@atlaskit/feature-gate-js-client"));
 var _frontendUtilities = require("@atlaskit/frontend-utilities");
 var _types = require("@atlaskit/teams-client/types");
 var CONTAINER_MAP = exports.CONTAINER_MAP = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _types.ContainerType.CONFLUENCE_SPACE, 'ConfluenceSpace'), _types.ContainerType.JIRA_PROJECT, 'JiraProject'), _types.ContainerType.LOOM_SPACE, 'LoomSpace');
@@ -43,7 +41,7 @@ function getRequestedContainersFromUrl() {
   if (containers.length === 0) {
     return [];
   }
-  return userCanAccessFeature() ? containers : [];
+  return containers || [];
 }
 function removeRequestedContainersFromUrl() {
   var searchParams = new URLSearchParams(window.location.search);
@@ -65,13 +63,6 @@ function convertContainerToType(container) {
       return null;
   }
 }
-function userCanAccessFeature() {
-  if (_featureGateJsClient.default.initializeCalled()) {
-    var value = _featureGateJsClient.default.getExperimentValue('teams_app_auto_container_creation', 'cohort', 'control');
-    return value === 'universal_create' || value === 'profile_page';
-  }
-  return false;
-}
 var POLLING_INTERVAL = exports.POLLING_INTERVAL = 1000;
 var POLLING_DURATION = exports.POLLING_DURATION = 15000;
 

package/dist/cjs/ui/team-containers/main.js

@@ -144,12 +144,12 @@ var TeamContainers = exports.TeamContainers = function TeamContainers(_ref) {
   (0, _react.useEffect)(function () {
     if (isDisplayedOnProfileCard && filterContainerId) {
       setFilteredTeamLinks(teamLinks.filter(function (container) {
-        return container.id !== filterContainerId && !requestedContainers.includes(container.type);
+        return container.id !== filterContainerId;
       }));
     } else {
       setFilteredTeamLinks(teamLinks);
     }
-  }, [teamLinks, isDisplayedOnProfileCard, filterContainerId, requestedContainers]);
+  }, [teamLinks, isDisplayedOnProfileCard, filterContainerId]);
   (0, _react.useEffect)(function () {
     var containersToCheck = filteredTeamLinks;
     if (containersToCheck.length > maxNumberOfContainersToShow || isDisplayedOnProfileCard || isReadOnly) {
@@ -165,11 +165,8 @@ var TeamContainers = exports.TeamContainers = function TeamContainers(_ref) {
           return container.type === type;
         });
       };
-      var containerRequested = function containerRequested(type) {
-        return requestedContainers.includes(type);
-      };
-      var showContainer = function showContainer(containerExists, isRequesting, product) {
-        if (containerExists || isRequesting) {
+      var showContainer = function showContainer(containerExists, product) {
+        if (containerExists) {
           return false;
         }
         if ((0, _platformFeatureFlags.fg)('migrate-product-permissions')) {
@@ -178,13 +175,13 @@ var TeamContainers = exports.TeamContainers = function TeamContainers(_ref) {
         return productPermissionsOld && (0, _controllers.hasProductPermission)(productPermissionsOld, product, []) || false;
       };
       setCanAddContainer({
-        Jira: showContainer(containerExists('JiraProject'), containerRequested('JiraProject'), 'jira'),
-        Confluence: showContainer(containerExists('ConfluenceSpace'), containerRequested('ConfluenceSpace'), 'confluence'),
-        Loom: showContainer(containerExists('LoomSpace'), containerRequested('LoomSpace'), 'loom'),
+        Jira: showContainer(containerExists('JiraProject'), 'jira'),
+        Confluence: showContainer(containerExists('ConfluenceSpace'), 'confluence'),
+        Loom: showContainer(containerExists('LoomSpace'), 'loom'),
         WebLink: !containerExists('WebLink')
       });
     }
-  }, [isDisplayedOnProfileCard, productPermissions, productPermissionsOld, filteredTeamLinks, maxNumberOfContainersToShow, requestedContainers, isReadOnly]);
+  }, [isDisplayedOnProfileCard, productPermissions, productPermissionsOld, filteredTeamLinks, maxNumberOfContainersToShow, isReadOnly]);
   (0, _react.useEffect)(function () {
     if (onError) {
       if (hasError) {

package/dist/es2019/common/ui/container-icon/index.compiled.css

@@ -8,6 +8,7 @@
 ._1bsb1u1b{width:34px}
 ._1e0c1txw{display:flex}
 ._1qu2nqa1{outline-style:solid}
+._1ul91tcg{min-width:24px}
 ._2hwxv77o{margin-right:var(--ds-space-025,2px)}
 ._4cvr1h6o{align-items:center}
 ._4t3i1tcg{height:24px}

package/dist/es2019/common/ui/container-icon/index.js

@@ -8,7 +8,7 @@ import { Box } from '@atlaskit/primitives/compiled';
 import { LoomSpaceAvatar } from '../loom-avatar';
 const styles = {
   globeIconWrapperMedium: "_2rko1mok _1bsb1u1b _4t3i1u1b _1e0c1txw _4cvr1h6o _1bah1h6o _12jimuej _1qu2nqa1 _bfhkqbzx",
-  globeIconWrapperSmall: "_2rkolb4i _1bsb1tcg _4t3i1tcg _1e0c1txw _4cvr1h6o _1bah1h6o _19pkv77o _2hwxv77o _otyrv77o _18u0v77o _12jimuej _1qu2nqa1 _bfhkqbzx",
+  globeIconWrapperSmall: "_2rkolb4i _1ul91tcg _4t3i1tcg _1e0c1txw _4cvr1h6o _1bah1h6o _19pkv77o _2hwxv77o _otyrv77o _18u0v77o _12jimuej _1qu2nqa1 _bfhkqbzx",
   skeletonMedium: "_2rko1mok _bfhkn82g _1bsb1u1b _4t3i1u1b",
   skeletonSmall: "_2rkolb4i _bfhkn82g _1bsb1tcg _4t3i1tcg"
 };

package/dist/es2019/common/ui/loom-avatar/main.compiled.css

@@ -4,10 +4,14 @@
 ._189ee4h9{border-width:var(--ds-border-width,1px)}
 ._1dqonqa1{border-style:solid}
 ._1h6dmuej{border-color:var(--ds-border,#091e4224)}
+._18u0v77o{margin-left:var(--ds-space-025,2px)}
+._19pkv77o{margin-top:var(--ds-space-025,2px)}
 ._1bah1h6o{justify-content:center}
-._1bsb1tcg{width:24px}
 ._1bsbzwfg{width:2pc}
 ._1e0c1txw{display:flex}
+._1ul9qslr{min-width:22px}
+._2hwxv77o{margin-right:var(--ds-space-025,2px)}
 ._4cvr1h6o{align-items:center}
-._4t3i1tcg{height:24px}
-._4t3izwfg{height:2pc}
+._4t3iqslr{height:22px}
+._4t3izwfg{height:2pc}
+._otyrv77o{margin-bottom:var(--ds-space-025,2px)}

package/dist/es2019/common/ui/loom-avatar/main.js

@@ -20,6 +20,6 @@ export function LoomSpaceAvatar({
       color: textColor
     },
     "data-testid": testId,
-    className: ax(["_2rko12b0 _189ee4h9 _1dqonqa1 _1h6dmuej _1e0c1txw _4cvr1h6o _1bah1h6o", size === 'small' ? "_11c8140y _4t3i1tcg _1bsb1tcg" : "_11c8lodh _4t3izwfg _1bsbzwfg"])
+    className: ax(["_2rko12b0 _189ee4h9 _1dqonqa1 _1h6dmuej _1e0c1txw _4cvr1h6o _1bah1h6o", size === 'small' ? "_11c8140y _4t3iqslr _1ul9qslr _19pkv77o _2hwxv77o _otyrv77o _18u0v77o" : "_11c8lodh _4t3izwfg _1bsbzwfg"])
   }, avatarText);
 }

package/dist/es2019/common/utils/get-container-properties.js

@@ -3,10 +3,10 @@ import "./get-container-properties.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
 import { defineMessages, FormattedMessage } from 'react-intl-next';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
 import LinkIcon from '@atlaskit/icon/core/link';
 import LinkExternalIcon from '@atlaskit/icon/core/link-external';
 import Image from '@atlaskit/image';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, Flex, Text } from '@atlaskit/primitives/compiled';
 import ConfluenceIcon from '../assets/ConfluenceIcon.svg';
 import JiraIcon from '../assets/JiraIcon.svg';
@@ -116,7 +116,7 @@ const getJiraContainerProperties = ({
   containerTypeProperties,
   iconSize = 'small'
 }) => {
-  const newTeamProfilePage = fg('enable_new_team_profile');
+  const newTeamProfilePage = FeatureGates.getExperimentValue('new_team_profile', 'isEnabled', false);
   const {
     subType,
     name
@@ -155,7 +155,7 @@ const getWebLinkContainerProperties = ({
   isEmptyContainer,
   isDisplayedOnProfileCard
 }) => {
-  const newTeamProfilePage = fg('enable_new_team_profile');
+  const newTeamProfilePage = FeatureGates.getExperimentValue('new_team_profile', 'isEnabled', false);
   return {
     description: isEmptyContainer ? /*#__PURE__*/React.createElement(Text, {
       size: "medium",
@@ -189,7 +189,7 @@ export const getContainerProperties = ({
   isEmptyContainer,
   isDisplayedOnProfileCard
 }) => {
-  const newTeamProfilePage = fg('enable_new_team_profile');
+  const newTeamProfilePage = FeatureGates.getExperimentValue('new_team_profile', 'isEnabled', false);
   switch (containerType) {
     case 'ConfluenceSpace':
       return {