@atlaskit/teams-public 0.27.1 → 0.29.0

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @atlaskit/teams-public
 
+## 0.29.0
+
+### Minor Changes
+
+- [#156784](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/156784)
+  [`a614e25bb80c9`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a614e25bb80c9) -
+  PTC-11532 Add useTeamWebLink in teams-public, allow get/delete/update team web links in
+  teams-public
+
+### Patch Changes
+
+- Updated dependencies
+
+## 0.28.0
+
+### Minor Changes
+
+- [#153501](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/153501)
+  [`daab8878af268`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/daab8878af268) -
+  [ux] PTC-11529 Build teams conatiners dropdown list & modify team web link modal; Classfied icons
+  by size.
+
 ## 0.27.1
 
 ### Patch Changes

package/dist/cjs/common/assets/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "ConfluenceIcon", {
+  enumerable: true,
+  get: function get() {
+    return _ConfluenceIcon.default;
+  }
+});
+Object.defineProperty(exports, "JiraIcon", {
+  enumerable: true,
+  get: function get() {
+    return _JiraIcon.default;
+  }
+});
+Object.defineProperty(exports, "LoomIcon", {
+  enumerable: true,
+  get: function get() {
+    return _LoomIcon.default;
+  }
+});
+var _ConfluenceIcon = _interopRequireDefault(require("./ConfluenceIcon.svg"));
+var _JiraIcon = _interopRequireDefault(require("./JiraIcon.svg"));
+var _LoomIcon = _interopRequireDefault(require("./LoomIcon.svg"));

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

@@ -93,6 +93,7 @@ var getJiraIcon = function getJiraIcon(containerSubTypes) {
   }
 };
 var getJiraContainerProperties = function getJiraContainerProperties(containerTypeProperties) {
+  var iconSize = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'small';
   var _ref = containerTypeProperties || {},
     subType = _ref.subType,
     name = _ref.name;
@@ -100,7 +101,7 @@ var getJiraContainerProperties = function getJiraContainerProperties(containerTy
   var baseProperties = {
     description: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, messages.jiraProjectDescription),
     icon: /*#__PURE__*/_react.default.createElement(Comp, {
-      xcss: styles.iconWrapper
+      xcss: iconSize === 'medium' ? styles.mediumIconWrapper : styles.iconWrapper
     }, /*#__PURE__*/_react.default.createElement(_image.default, {
       src: getJiraIcon(subType),
       alt: "",
@@ -152,7 +153,7 @@ var getContainerProperties = exports.getContainerProperties = function getContai
         containerTypeText: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, messages.spaceContainerText)
       };
     case 'JiraProject':
-      return getJiraContainerProperties(containerTypeProperties);
+      return getJiraContainerProperties(containerTypeProperties, iconSize);
     case 'WebLink':
       return {
         description: /*#__PURE__*/_react.default.createElement(_compiled.Text, {

package/dist/cjs/common/utils/team-web-link-converters.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.webLinksToContainers = exports.webLinkToContainer = exports.containerToNewWebLink = void 0;
+var containerToNewWebLink = exports.containerToNewWebLink = function containerToNewWebLink(container) {
+  return {
+    contentTitle: container.name,
+    description: '',
+    linkUri: container.link || ''
+  };
+};
+var webLinkToContainer = exports.webLinkToContainer = function webLinkToContainer(link) {
+  return {
+    id: link.linkId,
+    type: 'WebLink',
+    name: link.contentTitle,
+    icon: null,
+    link: link.linkUri
+  };
+};
+var webLinksToContainers = exports.webLinksToContainers = function webLinksToContainers(links) {
+  return links.map(webLinkToContainer);
+};

package/dist/cjs/controllers/hooks/use-team-web-links/index.js

@@ -0,0 +1,162 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTeamWebLinksActions = exports.useTeamWebLinks = exports.actions = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _reactSweetState = require("react-sweet-state");
+var _teamsClient = require("@atlaskit/teams-client");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(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 t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _initialState = {
+  teamId: '',
+  isLoading: false,
+  hasLoaded: false,
+  hasError: false,
+  shouldReload: false,
+  errorType: null,
+  links: []
+};
+var actions = exports.actions = {
+  getTeamWebLinks: function getTeamWebLinks(teamId) {
+    return /*#__PURE__*/function () {
+      var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(_ref) {
+        var getState, setState, _getState, links, currentTeamId, initialLinks, _yield$teamsClient$ge, entities;
+        return _regenerator.default.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              getState = _ref.getState, setState = _ref.setState;
+              _getState = getState(), links = _getState.links, currentTeamId = _getState.teamId;
+              initialLinks = teamId === currentTeamId ? links : [];
+              setState({
+                teamId: teamId,
+                isLoading: true,
+                hasLoaded: false,
+                hasError: false,
+                shouldReload: false,
+                links: initialLinks
+              });
+              _context.prev = 4;
+              _context.next = 7;
+              return _teamsClient.teamsClient.getTeamLinksByTeamId(teamId);
+            case 7:
+              _yield$teamsClient$ge = _context.sent;
+              entities = _yield$teamsClient$ge.entities;
+              if (!(getState().teamId !== teamId)) {
+                _context.next = 11;
+                break;
+              }
+              return _context.abrupt("return");
+            case 11:
+              setState({
+                isLoading: false,
+                hasLoaded: true,
+                hasError: false,
+                shouldReload: false,
+                links: entities
+              });
+              _context.next = 19;
+              break;
+            case 14:
+              _context.prev = 14;
+              _context.t0 = _context["catch"](4);
+              if (!(getState().teamId !== teamId)) {
+                _context.next = 18;
+                break;
+              }
+              return _context.abrupt("return");
+            case 18:
+              setState({
+                isLoading: false,
+                hasLoaded: true,
+                hasError: true,
+                errorType: _context.t0 instanceof Error ? _context.t0 : undefined,
+                shouldReload: false,
+                links: []
+              });
+            case 19:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee, null, [[4, 14]]);
+      }));
+      return function (_x) {
+        return _ref2.apply(this, arguments);
+      };
+    }();
+  },
+  createTeamWebLink: function createTeamWebLink(teamId, newLink) {
+    return /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
+      return _regenerator.default.wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            _context2.next = 2;
+            return _teamsClient.teamsClient.createTeamLink(teamId, newLink);
+          case 2:
+            return _context2.abrupt("return", _context2.sent);
+          case 3:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }));
+  },
+  updateTeamWebLink: function updateTeamWebLink(teamId, linkId, newLink) {
+    return /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3() {
+      return _regenerator.default.wrap(function _callee3$(_context3) {
+        while (1) switch (_context3.prev = _context3.next) {
+          case 0:
+            _context3.next = 2;
+            return _teamsClient.teamsClient.updateTeamLink(teamId, linkId, newLink);
+          case 2:
+            return _context3.abrupt("return", _context3.sent);
+          case 3:
+          case "end":
+            return _context3.stop();
+        }
+      }, _callee3);
+    }));
+  },
+  removeWebLink: function removeWebLink(teamId, linkId) {
+    return /*#__PURE__*/function () {
+      var _ref6 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4(_ref5) {
+        var dispatch;
+        return _regenerator.default.wrap(function _callee4$(_context4) {
+          while (1) switch (_context4.prev = _context4.next) {
+            case 0:
+              dispatch = _ref5.dispatch;
+              _context4.next = 3;
+              return _teamsClient.teamsClient.deleteTeamLink(teamId, linkId);
+            case 3:
+              _context4.next = 5;
+              return dispatch(actions.getTeamWebLinks(teamId));
+            case 5:
+            case "end":
+              return _context4.stop();
+          }
+        }, _callee4);
+      }));
+      return function (_x2) {
+        return _ref6.apply(this, arguments);
+      };
+    }();
+  },
+  initialState: function initialState(state) {
+    return function (_ref7) {
+      var setState = _ref7.setState;
+      setState(_objectSpread(_objectSpread({}, _initialState), state));
+    };
+  }
+};
+var TeamWebLinksStore = (0, _reactSweetState.createStore)({
+  initialState: _initialState,
+  actions: actions
+});
+var useTeamWebLinks = exports.useTeamWebLinks = (0, _reactSweetState.createHook)(TeamWebLinksStore);
+var useTeamWebLinksActions = exports.useTeamWebLinksActions = (0, _reactSweetState.createHook)(TeamWebLinksStore, {
+  selector: null
+});

package/dist/cjs/controllers/hooks/use-team-web-links/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/controllers/index.js

@@ -15,5 +15,18 @@ Object.defineProperty(exports, "useTeamContainers", {
     return _useTeamContainers.useTeamContainers;
   }
 });
+Object.defineProperty(exports, "useTeamWebLinks", {
+  enumerable: true,
+  get: function get() {
+    return _useTeamWebLinks.useTeamWebLinks;
+  }
+});
+Object.defineProperty(exports, "useTeamWebLinksActions", {
+  enumerable: true,
+  get: function get() {
+    return _useTeamWebLinks.useTeamWebLinksActions;
+  }
+});
 var _useTeamContainers = require("./hooks/use-team-containers");
+var _useTeamWebLinks = require("./hooks/use-team-web-links");
 var _utils = require("./product-permission/utils");

package/dist/cjs/index.js

@@ -3,6 +3,24 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "ConfluenceIcon", {
+  enumerable: true,
+  get: function get() {
+    return _assets.ConfluenceIcon;
+  }
+});
+Object.defineProperty(exports, "JiraIcon", {
+  enumerable: true,
+  get: function get() {
+    return _assets.JiraIcon;
+  }
+});
+Object.defineProperty(exports, "LoomIcon", {
+  enumerable: true,
+  get: function get() {
+    return _assets.LoomIcon;
+  }
+});
 Object.defineProperty(exports, "TeamContainers", {
   enumerable: true,
   get: function get() {
@@ -39,8 +57,22 @@ Object.defineProperty(exports, "useTeamContainers", {
     return _useTeamContainers.useTeamContainers;
   }
 });
+Object.defineProperty(exports, "useTeamWebLinks", {
+  enumerable: true,
+  get: function get() {
+    return _useTeamWebLinks.useTeamWebLinks;
+  }
+});
+Object.defineProperty(exports, "useTeamWebLinksActions", {
+  enumerable: true,
+  get: function get() {
+    return _useTeamWebLinks.useTeamWebLinksActions;
+  }
+});
 var _teamContainers = require("./ui/team-containers");
 var _useTeamContainers = require("./controllers/hooks/use-team-containers");
+var _useTeamWebLinks = require("./controllers/hooks/use-team-web-links");
 var _useProductPermission = require("./controllers/hooks/use-product-permission");
 var _utils = require("./controllers/product-permission/utils");
-var _getContainerProperties = require("./common/utils/get-container-properties");
+var _getContainerProperties = require("./common/utils/get-container-properties");
+var _assets = require("./common/assets");

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

@@ -38,7 +38,9 @@ var TeamContainers = exports.TeamContainers = function TeamContainers(_ref) {
     userId = _ref.userId,
     cloudId = _ref.cloudId,
     filterContainerId = _ref.filterContainerId,
-    isDisplayedOnProfileCard = _ref.isDisplayedOnProfileCard;
+    isDisplayedOnProfileCard = _ref.isDisplayedOnProfileCard,
+    _ref$maxNumberOfConta = _ref.maxNumberOfContainersToShow,
+    maxNumberOfContainersToShow = _ref$maxNumberOfConta === void 0 ? MAX_NUMBER_OF_CONTAINERS_TO_SHOW : _ref$maxNumberOfConta;
   var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var _useTeamContainers = (0, _useTeamContainers2.useTeamContainers)(teamId),
@@ -92,7 +94,7 @@ var TeamContainers = exports.TeamContainers = function TeamContainers(_ref) {
     }
   }, [isDisplayedOnProfileCard, filterContainerId, teamContainers]);
   (0, _react.useEffect)(function () {
-    if (filteredTeamContainers.length > MAX_NUMBER_OF_CONTAINERS_TO_SHOW || isDisplayedOnProfileCard) {
+    if (filteredTeamContainers.length > maxNumberOfContainersToShow || isDisplayedOnProfileCard) {
       setShowAddContainer({
         Jira: false,
         Confluence: false,
@@ -114,7 +116,7 @@ var TeamContainers = exports.TeamContainers = function TeamContainers(_ref) {
         Loom: !hasLoomSpace && !!productPermissions && !!(0, _controllers.hasProductPermission)(productPermissions, 'loom')
       });
     }
-  }, [isDisplayedOnProfileCard, productPermissions, filteredTeamContainers]);
+  }, [isDisplayedOnProfileCard, productPermissions, filteredTeamContainers, maxNumberOfContainersToShow]);
   var handleShowMore = function handleShowMore() {
     setShowMore(!showMore);
   };
@@ -174,7 +176,7 @@ var TeamContainers = exports.TeamContainers = function TeamContainers(_ref) {
   var TeamContainersSkeletonComponent = (components === null || components === void 0 ? void 0 : components.TeamContainersSkeleton) || _teamContainersSkeleton.TeamContainersSkeleton;
   if (loading || productPermissionIsLoading) {
     return /*#__PURE__*/_react.default.createElement(TeamContainersSkeletonComponent, {
-      numberOfContainers: MAX_NUMBER_OF_CONTAINERS_TO_SHOW
+      numberOfContainers: maxNumberOfContainersToShow
     });
   }
   if (filteredTeamContainers.length === 0 && !isDisplayedOnProfileCard && (!productPermissions || !(productPermissions && ((0, _controllers.hasProductPermission)(productPermissions, 'jira') || (0, _controllers.hasProductPermission)(productPermissions, 'confluence') || (0, _controllers.hasProductPermission)(productPermissions, 'loom'))))) {
@@ -185,7 +187,7 @@ var TeamContainers = exports.TeamContainers = function TeamContainers(_ref) {
   }, /*#__PURE__*/_react.default.createElement(_primitives.Grid, {
     templateColumns: "repeat(auto-fill, minmax(300px, 1fr))",
     gap: isDisplayedOnProfileCard ? 'space.0' : 'space.100'
-  }, filteredTeamContainers.slice(0, MAX_NUMBER_OF_CONTAINERS_TO_SHOW).map(function (container) {
+  }, filteredTeamContainers.slice(0, maxNumberOfContainersToShow).map(function (container) {
     return /*#__PURE__*/_react.default.createElement(LinkedContainerCardComponent, {
       key: container.id,
       containerType: container.type,
@@ -217,7 +219,7 @@ var TeamContainers = exports.TeamContainers = function TeamContainers(_ref) {
       return _onAddAContainerClick(e, 'Loom');
     },
     containerType: "LoomSpace"
-  }), showMore && filteredTeamContainers.slice(MAX_NUMBER_OF_CONTAINERS_TO_SHOW).map(function (container) {
+  }), showMore && filteredTeamContainers.slice(maxNumberOfContainersToShow).map(function (container) {
     return /*#__PURE__*/_react.default.createElement(LinkedContainerCardComponent, {
       key: container.id,
       containerType: container.type,
@@ -234,7 +236,7 @@ var TeamContainers = exports.TeamContainers = function TeamContainers(_ref) {
         });
       }
     });
-  })), filteredTeamContainers.length > MAX_NUMBER_OF_CONTAINERS_TO_SHOW && /*#__PURE__*/_react.default.createElement(_primitives.Inline, null, /*#__PURE__*/_react.default.createElement(_new.default, {
+  })), filteredTeamContainers.length > maxNumberOfContainersToShow && /*#__PURE__*/_react.default.createElement(_primitives.Inline, null, /*#__PURE__*/_react.default.createElement(_new.default, {
     appearance: "subtle",
     onClick: handleShowMore
   }, showMore ? /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, messages.showLess) : /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, messages.showMore)))), /*#__PURE__*/_react.default.createElement(_modalTransition.default, null, isDisconnectDialogOpen && selectedContainerDetails && /*#__PURE__*/_react.default.createElement(_async.DisconnectDialogLazy, {

package/dist/es2019/common/assets/index.js

@@ -0,0 +1,3 @@
+export { default as ConfluenceIcon } from './ConfluenceIcon.svg';
+export { default as JiraIcon } from './JiraIcon.svg';
+export { default as LoomIcon } from './LoomIcon.svg';

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

@@ -82,7 +82,7 @@ const getJiraIcon = containerSubTypes => {
       return JiraIcon;
   }
 };
-const getJiraContainerProperties = containerTypeProperties => {
+const getJiraContainerProperties = (containerTypeProperties, iconSize = 'small') => {
   const {
     subType,
     name
@@ -91,7 +91,7 @@ const getJiraContainerProperties = containerTypeProperties => {
   const baseProperties = {
     description: /*#__PURE__*/React.createElement(FormattedMessage, messages.jiraProjectDescription),
     icon: /*#__PURE__*/React.createElement(Comp, {
-      xcss: styles.iconWrapper
+      xcss: iconSize === 'medium' ? styles.mediumIconWrapper : styles.iconWrapper
     }, /*#__PURE__*/React.createElement(Image, {
       src: getJiraIcon(subType),
       alt: "",
@@ -142,7 +142,7 @@ export const getContainerProperties = (containerType, iconSize = 'small', contai
         containerTypeText: /*#__PURE__*/React.createElement(FormattedMessage, messages.spaceContainerText)
       };
     case 'JiraProject':
-      return getJiraContainerProperties(containerTypeProperties);
+      return getJiraContainerProperties(containerTypeProperties, iconSize);
     case 'WebLink':
       return {
         description: /*#__PURE__*/React.createElement(Text, {

package/dist/es2019/common/utils/team-web-link-converters.js

@@ -0,0 +1,19 @@
+export const containerToNewWebLink = container => {
+  return {
+    contentTitle: container.name,
+    description: '',
+    linkUri: container.link || ''
+  };
+};
+export const webLinkToContainer = link => {
+  return {
+    id: link.linkId,
+    type: 'WebLink',
+    name: link.contentTitle,
+    icon: null,
+    link: link.linkUri
+  };
+};
+export const webLinksToContainers = links => {
+  return links.map(webLinkToContainer);
+};

package/dist/es2019/controllers/hooks/use-team-web-links/index.js

@@ -0,0 +1,86 @@
+import { createHook, createStore } from 'react-sweet-state';
+import { teamsClient } from '@atlaskit/teams-client';
+const initialState = {
+  teamId: '',
+  isLoading: false,
+  hasLoaded: false,
+  hasError: false,
+  shouldReload: false,
+  errorType: null,
+  links: []
+};
+export const actions = {
+  getTeamWebLinks: teamId => async ({
+    getState,
+    setState
+  }) => {
+    const {
+      links,
+      teamId: currentTeamId
+    } = getState();
+    const initialLinks = teamId === currentTeamId ? links : [];
+    setState({
+      teamId,
+      isLoading: true,
+      hasLoaded: false,
+      hasError: false,
+      shouldReload: false,
+      links: initialLinks
+    });
+    try {
+      const {
+        entities
+      } = await teamsClient.getTeamLinksByTeamId(teamId);
+      if (getState().teamId !== teamId) {
+        return;
+      }
+      setState({
+        isLoading: false,
+        hasLoaded: true,
+        hasError: false,
+        shouldReload: false,
+        links: entities
+      });
+    } catch (e) {
+      if (getState().teamId !== teamId) {
+        return;
+      }
+      setState({
+        isLoading: false,
+        hasLoaded: true,
+        hasError: true,
+        errorType: e instanceof Error ? e : undefined,
+        shouldReload: false,
+        links: []
+      });
+    }
+  },
+  createTeamWebLink: (teamId, newLink) => async () => {
+    return await teamsClient.createTeamLink(teamId, newLink);
+  },
+  updateTeamWebLink: (teamId, linkId, newLink) => async () => {
+    return await teamsClient.updateTeamLink(teamId, linkId, newLink);
+  },
+  removeWebLink: (teamId, linkId) => async ({
+    dispatch
+  }) => {
+    await teamsClient.deleteTeamLink(teamId, linkId);
+    await dispatch(actions.getTeamWebLinks(teamId));
+  },
+  initialState: state => ({
+    setState
+  }) => {
+    setState({
+      ...initialState,
+      ...state
+    });
+  }
+};
+const TeamWebLinksStore = createStore({
+  initialState,
+  actions
+});
+export const useTeamWebLinks = createHook(TeamWebLinksStore);
+export const useTeamWebLinksActions = createHook(TeamWebLinksStore, {
+  selector: null
+});

package/dist/es2019/controllers/hooks/use-team-web-links/types.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/controllers/index.js

@@ -1,2 +1,3 @@
 export { useTeamContainers } from './hooks/use-team-containers';
+export { useTeamWebLinks, useTeamWebLinksActions } from './hooks/use-team-web-links';
 export { hasProductPermission } from './product-permission/utils';

package/dist/es2019/index.js

@@ -1,5 +1,7 @@
 export { TeamContainers } from './ui/team-containers';
 export { useTeamContainers, useConnectedTeams } from './controllers/hooks/use-team-containers';
+export { useTeamWebLinks, useTeamWebLinksActions } from './controllers/hooks/use-team-web-links';
 export { useProductPermissions } from './controllers/hooks/use-product-permission';
 export { hasProductPermission } from './controllers/product-permission/utils';
-export { getContainerProperties } from './common/utils/get-container-properties';
+export { getContainerProperties } from './common/utils/get-container-properties';
+export { ConfluenceIcon, JiraIcon, LoomIcon } from './common/assets';

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

@@ -25,7 +25,8 @@ export const TeamContainers = ({
   userId,
   cloudId,
   filterContainerId,
-  isDisplayedOnProfileCard
+  isDisplayedOnProfileCard,
+  maxNumberOfContainersToShow = MAX_NUMBER_OF_CONTAINERS_TO_SHOW
 }) => {
   const {
     createAnalyticsEvent
@@ -64,7 +65,7 @@ export const TeamContainers = ({
     }
   }, [isDisplayedOnProfileCard, filterContainerId, teamContainers]);
   useEffect(() => {
-    if (filteredTeamContainers.length > MAX_NUMBER_OF_CONTAINERS_TO_SHOW || isDisplayedOnProfileCard) {
+    if (filteredTeamContainers.length > maxNumberOfContainersToShow || isDisplayedOnProfileCard) {
       setShowAddContainer({
         Jira: false,
         Confluence: false,
@@ -80,7 +81,7 @@ export const TeamContainers = ({
         Loom: !hasLoomSpace && !!productPermissions && !!hasProductPermission(productPermissions, 'loom')
       });
     }
-  }, [isDisplayedOnProfileCard, productPermissions, filteredTeamContainers]);
+  }, [isDisplayedOnProfileCard, productPermissions, filteredTeamContainers, maxNumberOfContainersToShow]);
   const handleShowMore = () => {
     setShowMore(!showMore);
   };
@@ -122,7 +123,7 @@ export const TeamContainers = ({
   const TeamContainersSkeletonComponent = (components === null || components === void 0 ? void 0 : components.TeamContainersSkeleton) || TeamContainersSkeleton;
   if (loading || productPermissionIsLoading) {
     return /*#__PURE__*/React.createElement(TeamContainersSkeletonComponent, {
-      numberOfContainers: MAX_NUMBER_OF_CONTAINERS_TO_SHOW
+      numberOfContainers: maxNumberOfContainersToShow
     });
   }
   if (filteredTeamContainers.length === 0 && !isDisplayedOnProfileCard && (!productPermissions || !(productPermissions && (hasProductPermission(productPermissions, 'jira') || hasProductPermission(productPermissions, 'confluence') || hasProductPermission(productPermissions, 'loom'))))) {
@@ -133,7 +134,7 @@ export const TeamContainers = ({
   }, /*#__PURE__*/React.createElement(Grid, {
     templateColumns: "repeat(auto-fill, minmax(300px, 1fr))",
     gap: isDisplayedOnProfileCard ? 'space.0' : 'space.100'
-  }, filteredTeamContainers.slice(0, MAX_NUMBER_OF_CONTAINERS_TO_SHOW).map(container => {
+  }, filteredTeamContainers.slice(0, maxNumberOfContainersToShow).map(container => {
     return /*#__PURE__*/React.createElement(LinkedContainerCardComponent, {
       key: container.id,
       containerType: container.type,
@@ -157,7 +158,7 @@ export const TeamContainers = ({
   }), showAddContainer.Loom && fg('loom_tab_in_container_linker_team_profile_page') && /*#__PURE__*/React.createElement(AddContainerCard, {
     onAddAContainerClick: e => onAddAContainerClick(e, 'Loom'),
     containerType: "LoomSpace"
-  }), showMore && filteredTeamContainers.slice(MAX_NUMBER_OF_CONTAINERS_TO_SHOW).map(container => {
+  }), showMore && filteredTeamContainers.slice(maxNumberOfContainersToShow).map(container => {
     return /*#__PURE__*/React.createElement(LinkedContainerCardComponent, {
       key: container.id,
       containerType: container.type,
@@ -172,7 +173,7 @@ export const TeamContainers = ({
         containerName: container.name
       })
     });
-  })), filteredTeamContainers.length > MAX_NUMBER_OF_CONTAINERS_TO_SHOW && /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement(Button, {
+  })), filteredTeamContainers.length > maxNumberOfContainersToShow && /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement(Button, {
     appearance: "subtle",
     onClick: handleShowMore
   }, showMore ? /*#__PURE__*/React.createElement(FormattedMessage, messages.showLess) : /*#__PURE__*/React.createElement(FormattedMessage, messages.showMore)))), /*#__PURE__*/React.createElement(ModalTransition, null, isDisconnectDialogOpen && selectedContainerDetails && /*#__PURE__*/React.createElement(DisconnectDialogLazy, {

package/dist/esm/common/assets/index.js

@@ -0,0 +1,3 @@
+export { default as ConfluenceIcon } from './ConfluenceIcon.svg';
+export { default as JiraIcon } from './JiraIcon.svg';
+export { default as LoomIcon } from './LoomIcon.svg';

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

@@ -86,6 +86,7 @@ var getJiraIcon = function getJiraIcon(containerSubTypes) {
   }
 };
 var getJiraContainerProperties = function getJiraContainerProperties(containerTypeProperties) {
+  var iconSize = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'small';
   var _ref = containerTypeProperties || {},
     subType = _ref.subType,
     name = _ref.name;
@@ -93,7 +94,7 @@ var getJiraContainerProperties = function getJiraContainerProperties(containerTy
   var baseProperties = {
     description: /*#__PURE__*/React.createElement(FormattedMessage, messages.jiraProjectDescription),
     icon: /*#__PURE__*/React.createElement(Comp, {
-      xcss: styles.iconWrapper
+      xcss: iconSize === 'medium' ? styles.mediumIconWrapper : styles.iconWrapper
     }, /*#__PURE__*/React.createElement(Image, {
       src: getJiraIcon(subType),
       alt: "",
@@ -145,7 +146,7 @@ export var getContainerProperties = function getContainerProperties(containerTyp
         containerTypeText: /*#__PURE__*/React.createElement(FormattedMessage, messages.spaceContainerText)
       };
     case 'JiraProject':
-      return getJiraContainerProperties(containerTypeProperties);
+      return getJiraContainerProperties(containerTypeProperties, iconSize);
     case 'WebLink':
       return {
         description: /*#__PURE__*/React.createElement(Text, {