@atlaskit/profilecard
Version:
A React component to display a card with user information.
223 lines (222 loc) • 11 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.ProfileCardResourcedInternal = 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"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireWildcard(require("react"));
var _analyticsNext = require("@atlaskit/analytics-next");
var _giveKudos = require("@atlaskit/give-kudos");
var _filterActions = _interopRequireDefault(require("../../internal/filterActions"));
var _Card = require("../../styled/Card");
var _analytics = require("../../util/analytics");
var _Error = require("../Error");
var _ProfileCard = _interopRequireDefault(require("./ProfileCard"));
var _UserLoadingState = _interopRequireDefault(require("./UserLoadingState"));
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
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; }
function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
var ProfileCardResourced = /*#__PURE__*/function (_React$PureComponent) {
function ProfileCardResourced() {
var _this;
(0, _classCallCheck2.default)(this, ProfileCardResourced);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _callSuper(this, ProfileCardResourced, [].concat(args));
(0, _defineProperty2.default)(_this, "_isMounted", false);
(0, _defineProperty2.default)(_this, "state", {
visible: false,
isLoading: undefined,
hasError: false,
error: null,
data: null,
reportingLinesData: undefined,
isKudosEnabled: false,
kudosDrawerOpen: false,
teamCentralBaseUrl: undefined
});
(0, _defineProperty2.default)(_this, "fireAnalytics", function (payload) {
// Don't fire analytics if the component is unmounted
if (!_this._isMounted) {
return;
}
if (_this.props.createAnalyticsEvent) {
(0, _analytics.fireEvent)(_this.props.createAnalyticsEvent, payload);
}
});
(0, _defineProperty2.default)(_this, "clientFetchProfile", function () {
var _this$props = _this.props,
cloudId = _this$props.cloudId,
userId = _this$props.userId;
var isLoading = _this.state.isLoading;
if (isLoading === true) {
// don't fetch data when fetching is in process
return;
}
_this.setState({
isLoading: true,
hasError: false,
data: null
}, function () {
var requests = Promise.all([_this.props.resourceClient.getProfile(cloudId, userId, _this.fireAnalytics), _this.props.resourceClient.getReportingLines(userId), _this.props.resourceClient.shouldShowGiveKudos(), _this.props.resourceClient.getTeamCentralBaseUrl({
withOrgContext: true,
withSiteContext: true
})]);
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) {
return _this.handleClientError(err);
});
});
});
(0, _defineProperty2.default)(_this, "filterActions", function () {
return (0, _filterActions.default)(_this.props.actions, _this.state.data);
});
(0, _defineProperty2.default)(_this, "openKudosDrawer", function () {
_this.setState({
kudosDrawerOpen: true
});
});
(0, _defineProperty2.default)(_this, "closeKudosDrawer", function () {
_this.setState({
kudosDrawerOpen: false
});
});
return _this;
}
(0, _inherits2.default)(ProfileCardResourced, _React$PureComponent);
return (0, _createClass2.default)(ProfileCardResourced, [{
key: "componentDidMount",
value: function componentDidMount() {
this._isMounted = true;
this.clientFetchProfile();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
var _this$props2 = this.props,
userId = _this$props2.userId,
cloudId = _this$props2.cloudId,
resourceClient = _this$props2.resourceClient;
if (userId !== prevProps.userId || cloudId !== prevProps.cloudId || resourceClient !== prevProps.resourceClient) {
this.setState({
isLoading: undefined
}, this.clientFetchProfile);
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this._isMounted = false;
}
}, {
key: "handleClientSuccess",
value: function handleClientSuccess(profileData, reportingLinesData, shouldShowGiveKudos, teamCentralBaseUrl) {
if (!this._isMounted) {
return;
}
this.setState({
isLoading: false,
hasError: false,
data: profileData,
reportingLinesData: reportingLinesData,
isKudosEnabled: shouldShowGiveKudos,
teamCentralBaseUrl: teamCentralBaseUrl
});
}
}, {
key: "handleClientError",
value: function handleClientError(err) {
if (!this._isMounted) {
return;
}
this.setState({
isLoading: false,
hasError: true,
error: err
});
}
}, {
key: "render",
value: function render() {
var _this$state = this.state,
isLoading = _this$state.isLoading,
hasError = _this$state.hasError,
error = _this$state.error,
data = _this$state.data,
reportingLinesData = _this$state.reportingLinesData,
isKudosEnabled = _this$state.isKudosEnabled,
teamCentralBaseUrl = _this$state.teamCentralBaseUrl;
var _this$props3 = this.props,
onReportingLinesClick = _this$props3.onReportingLinesClick,
cloudId = _this$props3.cloudId,
userId = _this$props3.userId,
addFlag = _this$props3.addFlag;
var isFetchingOrNotStartToFetchYet = isLoading === true || isLoading === undefined;
if (isFetchingOrNotStartToFetchYet) {
return /*#__PURE__*/_react.default.createElement(_Card.CardWrapper, null, /*#__PURE__*/_react.default.createElement(_UserLoadingState.default, {
fireAnalytics: this.fireAnalytics
}));
} else if (hasError) {
return /*#__PURE__*/_react.default.createElement(_Card.CardWrapper, {
testId: "profile-card-resourced-error-state"
}, /*#__PURE__*/_react.default.createElement(_Error.ErrorMessage, {
errorType: error,
reload: this.clientFetchProfile,
fireAnalytics: this.fireAnalytics
}));
}
var newProps = _objectSpread(_objectSpread({
hasError: hasError,
errorType: error,
clientFetchProfile: this.clientFetchProfile,
reportingLines: reportingLinesData,
onReportingLinesClick: onReportingLinesClick,
cloudId: cloudId,
userId: userId,
addFlag: addFlag
}, data), {}, {
isKudosEnabled: isKudosEnabled,
teamCentralBaseUrl: teamCentralBaseUrl,
openKudosDrawer: this.openKudosDrawer
});
return /*#__PURE__*/_react.default.createElement(_Card.CardWrapper, null, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isKudosEnabled && newProps.teamCentralBaseUrl && /*#__PURE__*/_react.default.createElement(_react.Suspense, {
fallback: null
}, /*#__PURE__*/_react.default.createElement(_giveKudos.GiveKudosLauncherLazy, {
isOpen: this.state.kudosDrawerOpen,
recipient: {
type: _giveKudos.KudosType.INDIVIDUAL,
recipientId: this.props.userId
},
analyticsSource: "profile-card",
teamCentralBaseUrl: newProps.teamCentralBaseUrl,
cloudId: this.props.cloudId,
addFlag: this.props.addFlag,
onClose: this.closeKudosDrawer
})), /*#__PURE__*/_react.default.createElement(_ProfileCard.default, (0, _extends2.default)({}, newProps, {
actions: this.filterActions()
}))));
}
}]);
}(_react.default.PureComponent);
(0, _defineProperty2.default)(ProfileCardResourced, "defaultProps", {
actions: []
});
var ProfileCardResourcedInternal = exports.ProfileCardResourcedInternal = ProfileCardResourced;
var _default = exports.default = (0, _analyticsNext.withAnalyticsEvents)()(ProfileCardResourced);