@atlaskit/profilecard 16.8.0 → 16.10.0

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @atlaskit/profilecard
 
+## 16.10.0
+
+### Minor Changes
+
+- [`e5fbc101e73`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e5fbc101e73) - Remove analytics prop from give kudos component
+
+### Patch Changes
+
+- Updated dependencies
+
+## 16.9.1
+
+### Patch Changes
+
+- Updated dependencies
+
+## 16.9.0
+
+### Minor Changes
+
+- [`1f16cd80413`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1f16cd80413) - [ux] Add give kudos to Team profile card.
+
 ## 16.8.0
 
 ### Minor Changes

package/dist/cjs/components/Team/TeamProfileCard.js

@@ -39,6 +39,8 @@ var _constants = require("@atlaskit/theme/constants");
 
 var _messages = _interopRequireDefault(require("../../messages"));
 
+var _Card = require("../../styled/Card");
+
 var _Error = require("../../styled/Error");
 
 var _TeamCard = require("../../styled/TeamCard");
@@ -60,6 +62,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 var LARGE_MEMBER_COUNT = 50;
+var GIVE_KUDOS_ACTION_ID = 'give-kudos';
 
 function onMemberClick(callback, userId, analytics, index, hasHref) {
   return function (event) {
@@ -156,11 +159,20 @@ var ActionButton = function ActionButton(_ref2) {
   var action = _ref2.action,
       analytics = _ref2.analytics,
       index = _ref2.index;
-  return /*#__PURE__*/_react.default.createElement(_TeamCard.WrappedButton, null, /*#__PURE__*/_react.default.createElement(_standardButton.default, {
-    href: action.link,
+  var isGiveKudosActionButton = action.id === GIVE_KUDOS_ACTION_ID;
+
+  var actionButton = /*#__PURE__*/_react.default.createElement(_standardButton.default, {
+    key: action.id || index,
     onClick: onActionClick(action, analytics, index),
+    href: action.link,
     shouldFitContainer: true
-  }, action.label));
+  }, action.label, isGiveKudosActionButton && /*#__PURE__*/_react.default.createElement(_Card.KudosBlobAnimation, null));
+
+  if (isGiveKudosActionButton) {
+    return /*#__PURE__*/_react.default.createElement(_Card.AnimatedKudosButton, null, actionButton);
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_TeamCard.WrappedButton, null, actionButton);
 };
 
 var ExtraActions = function ExtraActions(_ref3) {

package/dist/cjs/components/Team/TeamProfileCardTrigger.js

@@ -11,6 +11,8 @@ exports.default = exports.TeamProfileCardTriggerInternal = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
@@ -27,14 +29,20 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _reactIntlNext = require("react-intl-next");
+
 var _analyticsNext = require("@atlaskit/analytics-next");
 
+var _giveKudos = require("@atlaskit/give-kudos");
+
 var _popup = _interopRequireDefault(require("@atlaskit/popup"));
 
 var _constants = require("@atlaskit/theme/constants");
 
 var _filterActions2 = _interopRequireDefault(require("../../internal/filterActions"));
 
+var _messages = _interopRequireDefault(require("../../messages"));
+
 var _analytics = require("../../util/analytics");
 
 var _click = require("../../util/click");
@@ -165,6 +173,23 @@ var TeamProfileCardTriggerInternal = /*#__PURE__*/function (_React$PureComponent
         _this.hideProfilecard(_config.DELAY_MS_HIDE);
       }
     });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "openKudosDrawer", function () {
+      _this.hideProfilecard(_config.DELAY_MS_HIDE);
+
+      _this.setState({
+        kudosDrawerOpen: true
+      });
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "closeKudosDrawer", function () {
+      _this.setState({
+        kudosDrawerOpen: false
+      });
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "kudosUrl", function () {
+      var recipientId = _this.props.teamId && "&recipientId=".concat(_this.props.teamId) || '';
+      var cloudId = _this.props.cloudId && "&cloudId=".concat(_this.props.cloudId) || '';
+      return "".concat(_this.state.teamCentralBaseUrl, "/kudos/give?type=team").concat(recipientId).concat(cloudId);
+    });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "stopPropagation", function (event) {
       // We need to stop propagation when users click on the card, so that it
       // doesn't trigger any special effects that occur when clicking the trigger.
@@ -185,7 +210,10 @@ var TeamProfileCardTriggerInternal = /*#__PURE__*/function (_React$PureComponent
       isLoading: undefined,
       hasError: false,
       error: null,
-      data: null
+      data: null,
+      shouldShowGiveKudos: false,
+      teamCentralBaseUrl: undefined,
+      kudosDrawerOpen: false
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "clientFetchProfile", function () {
       var _this$props = _this.props,
@@ -206,8 +234,11 @@ var TeamProfileCardTriggerInternal = /*#__PURE__*/function (_React$PureComponent
           _this.fireAnalytics(event);
         };
 
-        _this.props.resourceClient.getTeamProfile(teamId, orgId, fireEvent).then(function (res) {
-          return _this.handleClientSuccess(res);
+        var requests = Promise.all([_this.props.resourceClient.getTeamProfile(teamId, orgId, fireEvent), _this.props.resourceClient.shouldShowGiveKudos()]);
+        requests.then(function (res) {
+          var _this2;
+
+          return (_this2 = _this).handleClientSuccess.apply(_this2, (0, _toConsumableArray2.default)(res));
         }, function (err) {
           return _this.handleClientError(err);
         }).catch(function (err) {
@@ -257,6 +288,22 @@ var TeamProfileCardTriggerInternal = /*#__PURE__*/function (_React$PureComponent
         errorType: error
       }))));
     });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderKudosLauncher", function () {
+      return _this.state.shouldShowGiveKudos && /*#__PURE__*/_react.default.createElement(_react.Suspense, {
+        fallback: null
+      }, /*#__PURE__*/_react.default.createElement(_giveKudos.GiveKudosLauncherLazy, {
+        isOpen: _this.state.kudosDrawerOpen,
+        recipient: {
+          type: _giveKudos.KudosType.TEAM,
+          recipientId: _this.props.teamId
+        },
+        analyticsSource: "team-profile-card",
+        teamCentralBaseUrl: _this.state.teamCentralBaseUrl,
+        cloudId: _this.props.cloudId || '',
+        addFlag: _this.props.addFlag,
+        onClose: _this.closeKudosDrawer
+      }));
+    });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderTrigger", function (triggerProps) {
       var _this$props3 = _this.props,
           children = _this$props3.children,
@@ -264,12 +311,12 @@ var TeamProfileCardTriggerInternal = /*#__PURE__*/function (_React$PureComponent
           viewProfileLink = _this$props3.viewProfileLink;
 
       if (triggerLinkType === 'none') {
-        return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({
+        return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, _this.renderKudosLauncher(), /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({
           "data-testid": "team-profilecard-trigger-wrapper"
-        }, triggerProps, _this.triggerListeners), children);
+        }, triggerProps, _this.triggerListeners), children));
       }
 
-      return /*#__PURE__*/_react.default.createElement("a", (0, _extends2.default)({
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, _this.renderKudosLauncher(), /*#__PURE__*/_react.default.createElement("a", (0, _extends2.default)({
         "data-testid": "team-profilecard-trigger-wrapper",
         style: {
           color: 'initial',
@@ -278,7 +325,7 @@ var TeamProfileCardTriggerInternal = /*#__PURE__*/function (_React$PureComponent
         href: viewProfileLink
       }, triggerProps, {
         ref: triggerProps.ref
-      }, _this.triggerListeners), children);
+      }, _this.triggerListeners), children));
     });
     return _this;
   }
@@ -312,7 +359,7 @@ var TeamProfileCardTriggerInternal = /*#__PURE__*/function (_React$PureComponent
     }
   }, {
     key: "handleClientSuccess",
-    value: function handleClientSuccess(res) {
+    value: function handleClientSuccess(team, shouldShowGiveKudos) {
       if (!this._isMounted) {
         return;
       }
@@ -320,7 +367,9 @@ var TeamProfileCardTriggerInternal = /*#__PURE__*/function (_React$PureComponent
       this.setState({
         isLoading: false,
         hasError: false,
-        data: res
+        data: team,
+        shouldShowGiveKudos: shouldShowGiveKudos,
+        teamCentralBaseUrl: this.props.resourceClient.getTeamCentralBaseUrl()
       });
     }
   }, {
@@ -339,12 +388,28 @@ var TeamProfileCardTriggerInternal = /*#__PURE__*/function (_React$PureComponent
   }, {
     key: "filterActions",
     value: function filterActions() {
-      return (0, _filterActions2.default)(this.props.actions, this.state.data);
+      var _this3 = this;
+
+      var actions = (0, _filterActions2.default)(this.props.actions, this.state.data);
+
+      if (this.state.shouldShowGiveKudos) {
+        var kudosAction = {
+          label: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.default.giveKudosButton),
+          id: 'give-kudos',
+          callback: function callback() {
+            _this3.openKudosDrawer();
+          },
+          link: this.kudosUrl()
+        };
+        return actions.concat([kudosAction]);
+      }
+
+      return actions;
     }
   }, {
     key: "renderPopup",
     value: function renderPopup() {
-      var _this2 = this;
+      var _this4 = this;
 
       if (this.state.renderError) {
         return this.props.children;
@@ -358,7 +423,7 @@ var TeamProfileCardTriggerInternal = /*#__PURE__*/function (_React$PureComponent
         placement: this.props.position,
         content: this.renderProfileCard,
         trigger: function trigger(triggerProps) {
-          return _this2.renderTrigger(triggerProps);
+          return _this4.renderTrigger(triggerProps);
         },
         zIndex: _constants.layers.modal(),
         shouldFlip: true

package/dist/cjs/components/User/ProfileCardResourced.js

@@ -242,7 +242,6 @@ var ProfileCardResourced = /*#__PURE__*/function (_React$PureComponent) {
           type: _giveKudos.KudosType.INDIVIDUAL,
           recipientId: this.props.userId
         },
-        analytics: this.props.analytics,
         analyticsSource: "profile-card",
         teamCentralBaseUrl: newProps.teamCentralBaseUrl,
         cloudId: this.props.cloudId,

package/dist/cjs/components/User/ProfileCardTrigger.js

@@ -308,7 +308,6 @@ var ProfilecardTrigger = /*#__PURE__*/function (_React$PureComponent) {
           type: _giveKudos.KudosType.INDIVIDUAL,
           recipientId: this.props.userId
         },
-        analytics: this.props.analytics,
         analyticsSource: "profile-card",
         teamCentralBaseUrl: this.state.teamCentralBaseUrl,
         cloudId: this.props.cloudId,

package/dist/cjs/i18n/en.js

@@ -32,6 +32,7 @@ var _default = {
   'pt.profile-card.inactive.account.has.date.this.month': 'Their account was deactivated this month.',
   'pt.profile-card.inactive.account.has.date.this.week': 'Their account was deactivated this week.',
   'pt.profile-card.inactive.account.no.date': 'Their account has been deactivated.',
+  'pt.profile-card.more-icon-label': 'More',
   'pt.team-profile-card.directReports.heading': 'Direct reports',
   'pt.team-profile-card.error.refresh-button': 'Try again',
   'pt.team-profile-card.error.suggestion': 'Wait a few moments, then try again.',

package/dist/cjs/i18n/en_GB.js

@@ -32,6 +32,7 @@ var _default = {
   'pt.profile-card.inactive.account.has.date.this.month': 'Their account was deactivated this month.',
   'pt.profile-card.inactive.account.has.date.this.week': 'Their account was deactivated this week.',
   'pt.profile-card.inactive.account.no.date': 'Their account has been deactivated.',
+  'pt.profile-card.more-icon-label': 'More',
   'pt.team-profile-card.directReports.heading': 'Direct reports',
   'pt.team-profile-card.error.refresh-button': 'Try again',
   'pt.team-profile-card.error.suggestion': 'Wait a few moments, then try again.',

package/dist/cjs/i18n/en_ZZ.js

@@ -32,6 +32,7 @@ var _default = {
   'pt.profile-card.inactive.account.has.date.this.month': '⁣⁢Their account was deactivated this month.‍‌⁡⁡؜⁠‍‍⁣⁤',
   'pt.profile-card.inactive.account.has.date.this.week': '⁣⁢Their account was deactivated this week.⁠‍⁠‍⁡؜⁣⁤',
   'pt.profile-card.inactive.account.no.date': '⁣⁢Their account has been deactivated.‌⁠⁠⁠‌⁡‌؜⁠⁠‌⁣⁤',
+  'pt.profile-card.more-icon-label': '⁣⁢More‌‌‍؜⁡؜⁠⁠؜؜⁣⁤',
   'pt.team-profile-card.directReports.heading': '⁣⁢Direct reports⁠‍⁡⁠؜⁠‌؜⁣⁤',
   'pt.team-profile-card.error.refresh-button': '⁣⁢Try again⁡⁠‍‌⁠⁠⁡⁠؜⁠⁡‍⁣⁤',
   'pt.team-profile-card.error.suggestion': '⁣⁢Wait a few moments, then try again.‌⁡‌‌‍⁠⁠⁡‍؜‌⁡⁠⁠⁡⁠‍‍⁣⁤',

package/dist/cjs/styled/Card.js

@@ -50,7 +50,7 @@ var KudosBlobAnimation = _styledComponents.default.div(_templateObject6 || (_tem
 
 exports.KudosBlobAnimation = KudosBlobAnimation;
 
-var AnimatedKudosButton = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  margin-left: ", "px;\n  &:hover ", " {\n    display: block;\n  }\n\n  button,\n  a {\n    clip-path: inset(0px 0px 0px 0px round ", "px);\n  }\n"])), _constants.gridSize, KudosBlobAnimation, _constants.borderRadius);
+var AnimatedKudosButton = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  margin-left: ", "px;\n  &:hover ", " {\n    display: block;\n  }\n\n  button,\n  a {\n    clip-path: inset(0px 0px 0px 0px round ", "px);\n  }\n  overflow: hidden;\n"])), _constants.gridSize, KudosBlobAnimation, _constants.borderRadius);
 
 exports.AnimatedKudosButton = AnimatedKudosButton;
 

package/dist/cjs/util/analytics.js

@@ -56,7 +56,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
     actionSubjectId: actionSubjectId,
     attributes: _objectSpread(_objectSpread({
       packageName: "@atlaskit/profilecard",
-      packageVersion: "16.8.0"
+      packageVersion: "16.10.0"
     }, attributes), {}, {
       firedAt: (0, _performance.getPageTime)()
     })

package/dist/cjs/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/profilecard",
-	"version": "16.8.0"
+	"version": "16.10.0"
 }

package/dist/es2019/components/Team/TeamProfileCard.js

@@ -10,6 +10,7 @@ import { LinkItem, MenuGroup } from '@atlaskit/menu';
 import Popup from '@atlaskit/popup';
 import { layers } from '@atlaskit/theme/constants';
 import messages from '../../messages';
+import { AnimatedKudosButton, KudosBlobAnimation } from '../../styled/Card';
 import { ErrorWrapper, TeamErrorText, TeamErrorTitle } from '../../styled/Error';
 import { ActionButtons, AvatarSection, CardContent, CardHeader, CardWrapper, Description, DescriptionWrapper, MemberCount, MoreButton, TeamName, WrappedButton } from '../../styled/TeamCard';
 import { errorRetryClicked, moreActionsClicked, moreMembersClicked, teamActionClicked, teamAvatarClicked, teamProfileCardRendered } from '../../util/analytics';
@@ -17,6 +18,7 @@ import { isBasicClick } from '../../util/click';
 import { ErrorIllustration } from '../Error';
 import TeamLoadingState from './TeamLoadingState';
 const LARGE_MEMBER_COUNT = 50;
+const GIVE_KUDOS_ACTION_ID = 'give-kudos';
 
 function onMemberClick(callback, userId, analytics, index, hasHref) {
   return event => {
@@ -106,11 +108,19 @@ const ActionButton = ({
   analytics,
   index
 }) => {
-  return /*#__PURE__*/React.createElement(WrappedButton, null, /*#__PURE__*/React.createElement(Button, {
-    href: action.link,
+  const isGiveKudosActionButton = action.id === GIVE_KUDOS_ACTION_ID;
+  const actionButton = /*#__PURE__*/React.createElement(Button, {
+    key: action.id || index,
     onClick: onActionClick(action, analytics, index),
+    href: action.link,
     shouldFitContainer: true
-  }, action.label));
+  }, action.label, isGiveKudosActionButton && /*#__PURE__*/React.createElement(KudosBlobAnimation, null));
+
+  if (isGiveKudosActionButton) {
+    return /*#__PURE__*/React.createElement(AnimatedKudosButton, null, actionButton);
+  }
+
+  return /*#__PURE__*/React.createElement(WrappedButton, null, actionButton);
 };
 
 const ExtraActions = ({

package/dist/es2019/components/Team/TeamProfileCardTrigger.js

@@ -1,10 +1,13 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React, { Suspense } from 'react';
+import { FormattedMessage } from 'react-intl-next';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
+import { GiveKudosLauncherLazy, KudosType } from '@atlaskit/give-kudos';
 import Popup from '@atlaskit/popup';
 import { layers } from '@atlaskit/theme/constants';
 import filterActions from '../../internal/filterActions';
+import messages from '../../messages';
 import { fireEvent, teamCardTriggered, teamProfileCardRendered } from '../../util/analytics';
 import { isBasicClick } from '../../util/click';
 import { DELAY_MS_HIDE, DELAY_MS_SHOW } from '../../util/config';
@@ -114,6 +117,25 @@ export class TeamProfileCardTriggerInternal extends React.PureComponent {
       }
     });
 
+    _defineProperty(this, "openKudosDrawer", () => {
+      this.hideProfilecard(DELAY_MS_HIDE);
+      this.setState({
+        kudosDrawerOpen: true
+      });
+    });
+
+    _defineProperty(this, "closeKudosDrawer", () => {
+      this.setState({
+        kudosDrawerOpen: false
+      });
+    });
+
+    _defineProperty(this, "kudosUrl", () => {
+      const recipientId = this.props.teamId && `&recipientId=${this.props.teamId}` || '';
+      const cloudId = this.props.cloudId && `&cloudId=${this.props.cloudId}` || '';
+      return `${this.state.teamCentralBaseUrl}/kudos/give?type=team${recipientId}${cloudId}`;
+    });
+
     _defineProperty(this, "stopPropagation", event => {
       // We need to stop propagation when users click on the card, so that it
       // doesn't trigger any special effects that occur when clicking the trigger.
@@ -137,7 +159,10 @@ export class TeamProfileCardTriggerInternal extends React.PureComponent {
       isLoading: undefined,
       hasError: false,
       error: null,
-      data: null
+      data: null,
+      shouldShowGiveKudos: false,
+      teamCentralBaseUrl: undefined,
+      kudosDrawerOpen: false
     });
 
     _defineProperty(this, "clientFetchProfile", () => {
@@ -162,7 +187,8 @@ export class TeamProfileCardTriggerInternal extends React.PureComponent {
           this.fireAnalytics(event);
         };
 
-        this.props.resourceClient.getTeamProfile(teamId, orgId, fireEvent).then(res => this.handleClientSuccess(res), err => this.handleClientError(err)).catch(err => this.handleClientError(err));
+        const requests = Promise.all([this.props.resourceClient.getTeamProfile(teamId, orgId, fireEvent), this.props.resourceClient.shouldShowGiveKudos()]);
+        requests.then(res => this.handleClientSuccess(...res), err => this.handleClientError(err)).catch(err => this.handleClientError(err));
       });
     });
 
@@ -211,6 +237,23 @@ export class TeamProfileCardTriggerInternal extends React.PureComponent {
       }))));
     });
 
+    _defineProperty(this, "renderKudosLauncher", () => {
+      return this.state.shouldShowGiveKudos && /*#__PURE__*/React.createElement(Suspense, {
+        fallback: null
+      }, /*#__PURE__*/React.createElement(GiveKudosLauncherLazy, {
+        isOpen: this.state.kudosDrawerOpen,
+        recipient: {
+          type: KudosType.TEAM,
+          recipientId: this.props.teamId
+        },
+        analyticsSource: "team-profile-card",
+        teamCentralBaseUrl: this.state.teamCentralBaseUrl,
+        cloudId: this.props.cloudId || '',
+        addFlag: this.props.addFlag,
+        onClose: this.closeKudosDrawer
+      }));
+    });
+
     _defineProperty(this, "renderTrigger", triggerProps => {
       const {
         children,
@@ -219,12 +262,12 @@ export class TeamProfileCardTriggerInternal extends React.PureComponent {
       } = this.props;
 
       if (triggerLinkType === 'none') {
-        return /*#__PURE__*/React.createElement("span", _extends({
+        return /*#__PURE__*/React.createElement(React.Fragment, null, this.renderKudosLauncher(), /*#__PURE__*/React.createElement("span", _extends({
           "data-testid": "team-profilecard-trigger-wrapper"
-        }, triggerProps, this.triggerListeners), children);
+        }, triggerProps, this.triggerListeners), children));
       }
 
-      return /*#__PURE__*/React.createElement("a", _extends({
+      return /*#__PURE__*/React.createElement(React.Fragment, null, this.renderKudosLauncher(), /*#__PURE__*/React.createElement("a", _extends({
         "data-testid": "team-profilecard-trigger-wrapper",
         style: {
           color: 'initial',
@@ -233,7 +276,7 @@ export class TeamProfileCardTriggerInternal extends React.PureComponent {
         href: viewProfileLink
       }, triggerProps, {
         ref: triggerProps.ref
-      }, this.triggerListeners), children);
+      }, this.triggerListeners), children));
     });
   }
 
@@ -264,7 +307,7 @@ export class TeamProfileCardTriggerInternal extends React.PureComponent {
     clearTimeout(this.hideTimer);
   }
 
-  handleClientSuccess(res) {
+  handleClientSuccess(team, shouldShowGiveKudos) {
     if (!this._isMounted) {
       return;
     }
@@ -272,7 +315,9 @@ export class TeamProfileCardTriggerInternal extends React.PureComponent {
     this.setState({
       isLoading: false,
       hasError: false,
-      data: res
+      data: team,
+      shouldShowGiveKudos,
+      teamCentralBaseUrl: this.props.resourceClient.getTeamCentralBaseUrl()
     });
   }
 
@@ -289,7 +334,21 @@ export class TeamProfileCardTriggerInternal extends React.PureComponent {
   }
 
   filterActions() {
-    return filterActions(this.props.actions, this.state.data);
+    const actions = filterActions(this.props.actions, this.state.data);
+
+    if (this.state.shouldShowGiveKudos) {
+      const kudosAction = {
+        label: /*#__PURE__*/React.createElement(FormattedMessage, messages.giveKudosButton),
+        id: 'give-kudos',
+        callback: () => {
+          this.openKudosDrawer();
+        },
+        link: this.kudosUrl()
+      };
+      return actions.concat([kudosAction]);
+    }
+
+    return actions;
   }
 
   renderPopup() {

package/dist/es2019/components/User/ProfileCardResourced.js

@@ -180,7 +180,6 @@ export default class ProfileCardResourced extends React.PureComponent {
         type: KudosType.INDIVIDUAL,
         recipientId: this.props.userId
       },
-      analytics: this.props.analytics,
       analyticsSource: "profile-card",
       teamCentralBaseUrl: newProps.teamCentralBaseUrl,
       cloudId: this.props.cloudId,

package/dist/es2019/components/User/ProfileCardTrigger.js

@@ -245,7 +245,6 @@ class ProfilecardTrigger extends React.PureComponent {
         type: KudosType.INDIVIDUAL,
         recipientId: this.props.userId
       },
-      analytics: this.props.analytics,
       analyticsSource: "profile-card",
       teamCentralBaseUrl: this.state.teamCentralBaseUrl,
       cloudId: this.props.cloudId,

package/dist/es2019/i18n/en.js

@@ -25,6 +25,7 @@ export default {
   'pt.profile-card.inactive.account.has.date.this.month': 'Their account was deactivated this month.',
   'pt.profile-card.inactive.account.has.date.this.week': 'Their account was deactivated this week.',
   'pt.profile-card.inactive.account.no.date': 'Their account has been deactivated.',
+  'pt.profile-card.more-icon-label': 'More',
   'pt.team-profile-card.directReports.heading': 'Direct reports',
   'pt.team-profile-card.error.refresh-button': 'Try again',
   'pt.team-profile-card.error.suggestion': 'Wait a few moments, then try again.',

package/dist/es2019/i18n/en_GB.js

@@ -25,6 +25,7 @@ export default {
   'pt.profile-card.inactive.account.has.date.this.month': 'Their account was deactivated this month.',
   'pt.profile-card.inactive.account.has.date.this.week': 'Their account was deactivated this week.',
   'pt.profile-card.inactive.account.no.date': 'Their account has been deactivated.',
+  'pt.profile-card.more-icon-label': 'More',
   'pt.team-profile-card.directReports.heading': 'Direct reports',
   'pt.team-profile-card.error.refresh-button': 'Try again',
   'pt.team-profile-card.error.suggestion': 'Wait a few moments, then try again.',

package/dist/es2019/i18n/en_ZZ.js

@@ -25,6 +25,7 @@ export default {
   'pt.profile-card.inactive.account.has.date.this.month': '⁣⁢Their account was deactivated this month.‍‌⁡⁡؜⁠‍‍⁣⁤',
   'pt.profile-card.inactive.account.has.date.this.week': '⁣⁢Their account was deactivated this week.⁠‍⁠‍⁡؜⁣⁤',
   'pt.profile-card.inactive.account.no.date': '⁣⁢Their account has been deactivated.‌⁠⁠⁠‌⁡‌؜⁠⁠‌⁣⁤',
+  'pt.profile-card.more-icon-label': '⁣⁢More‌‌‍؜⁡؜⁠⁠؜؜⁣⁤',
   'pt.team-profile-card.directReports.heading': '⁣⁢Direct reports⁠‍⁡⁠؜⁠‌؜⁣⁤',
   'pt.team-profile-card.error.refresh-button': '⁣⁢Try again⁡⁠‍‌⁠⁠⁡⁠؜⁠⁡‍⁣⁤',
   'pt.team-profile-card.error.suggestion': '⁣⁢Wait a few moments, then try again.‌⁡‌‌‍⁠⁠⁡‍؜‌⁡⁠⁠⁡⁠‍‍⁣⁤',

package/dist/es2019/styled/Card.js

@@ -50,6 +50,7 @@ export const AnimatedKudosButton = styled.div`
   a {
     clip-path: inset(0px 0px 0px 0px round ${borderRadius}px);
   }
+  overflow: hidden;
 `;
 export const ActionButtonGroup = styled.div`
   user-select: none;

package/dist/es2019/util/analytics.js

@@ -35,7 +35,7 @@ const createEvent = (eventType, action, actionSubject, actionSubjectId, attribut
   actionSubjectId,
   attributes: {
     packageName: "@atlaskit/profilecard",
-    packageVersion: "16.8.0",
+    packageVersion: "16.10.0",
     ...attributes,
     firedAt: getPageTime()
   }

package/dist/es2019/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/profilecard",
-	"version": "16.8.0"
+	"version": "16.10.0"
 }

package/dist/esm/client/TeamCentralCardClient.js

@@ -1,10 +1,10 @@
-import _regeneratorRuntime from "@babel/runtime/regenerator";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 

package/dist/esm/client/UserProfileCardClient.js

@@ -1,4 +1,3 @@
-import _regeneratorRuntime from "@babel/runtime/regenerator";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
@@ -6,6 +5,7 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 

package/dist/esm/client/getTeamFromAGG.js

@@ -1,6 +1,6 @@
-import _regeneratorRuntime from "@babel/runtime/regenerator";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }