@atlaskit/profilecard
Version:
A React component to display a card with user information.
123 lines (122 loc) • 6.78 kB
JavaScript
/* ReportingLinesDetails.tsx generated by @compiled/babel-plugin v0.36.1 */
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
require("./ReportingLinesDetails.compiled.css");
var _runtime = require("@compiled/react/runtime");
var _react = _interopRequireDefault(require("react"));
var _reactIntlNext = require("react-intl-next");
var _avatar = _interopRequireDefault(require("@atlaskit/avatar"));
var _avatarGroup = _interopRequireDefault(require("@atlaskit/avatar-group"));
var _button = _interopRequireDefault(require("@atlaskit/button"));
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
var _primitives = require("@atlaskit/primitives");
var _compiled = require("@atlaskit/primitives/compiled");
var _messages = _interopRequireDefault(require("../../messages"));
var _ReportingLines = require("../../styled/ReportingLines");
var _analytics = require("../../util/analytics");
function getProfileHref(userId, profileUrl) {
return profileUrl ? profileUrl + userId : undefined;
}
var reportingLinesHeadingDefaultStyles = (0, _primitives.xcss)({
color: 'color.text',
font: 'font.heading.xxsmall',
fontWeight: 'font.weight.semibold',
marginBottom: 'space.100'
});
var reportingLinesHeadingStyles = (0, _primitives.xcss)({
marginBottom: '0'
});
var styles = {
reportingLinesButton: "_ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _bfhksm61 _irr3166n"
};
var avatarGroupMaxCount = 5;
var ReportingLinesDetails = function ReportingLinesDetails(props) {
var _manager$pii, _manager$pii2, _manager$pii3, _manager$pii4;
var _useIntl = (0, _reactIntlNext.useIntl)(),
formatMessage = _useIntl.formatMessage;
var fireAnalyticsWithDuration = props.fireAnalyticsWithDuration,
_props$reportingLines = props.reportingLines,
reportingLines = _props$reportingLines === void 0 ? {} : _props$reportingLines,
reportingLinesProfileUrl = props.reportingLinesProfileUrl,
onReportingLinesClick = props.onReportingLinesClick;
var _reportingLines$manag = reportingLines.managers,
managers = _reportingLines$manag === void 0 ? [] : _reportingLines$manag,
_reportingLines$repor = reportingLines.reports,
reports = _reportingLines$repor === void 0 ? [] : _reportingLines$repor;
var manager = managers.length >= 1 ? managers[0] : undefined;
var hasReports = reports.length > 0;
var getReportingLinesOnClick = function getReportingLinesOnClick(user, userType) {
return onReportingLinesClick ? function () {
fireAnalyticsWithDuration(function (duration) {
return (0, _analytics.reportingLinesClicked)({
duration: duration,
userType: userType
});
});
onReportingLinesClick(user);
} : undefined;
};
var onReportingLinksClick = function onReportingLinksClick(user, userType, href) {
if (href) {
window.location.href = href;
}
if (onReportingLinesClick) {
onReportingLinesClick(user);
}
fireAnalyticsWithDuration(function (duration) {
return (0, _analytics.reportingLinesClicked)({
duration: duration,
userType: userType
});
});
};
var showMoreButtonProps = (0, _platformFeatureFlags.fg)('platform_profilecard-enable_reporting_lines_label') ? {
'aria-label': formatMessage(_messages.default.profileCardMoreReportingLinesLabel, {
count: reports.length - avatarGroupMaxCount + 1
})
} : undefined;
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, manager && /*#__PURE__*/_react.default.createElement(_ReportingLines.ReportingLinesSection, null, /*#__PURE__*/_react.default.createElement(_primitives.Box, {
xcss: [reportingLinesHeadingDefaultStyles, reportingLinesHeadingStyles]
}, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.default.managerSectionHeading)), /*#__PURE__*/_react.default.createElement(_ReportingLines.OffsetWrapper, null, (0, _platformFeatureFlags.fg)('ptc_migrate_buttons') ? /*#__PURE__*/_react.default.createElement(_compiled.Pressable, {
onClick: function onClick() {
return onReportingLinksClick(manager, 'manager', getProfileHref(manager.accountIdentifier, reportingLinesProfileUrl));
},
isDisabled: !onReportingLinesClick,
xcss: styles.reportingLinesButton
}, /*#__PURE__*/_react.default.createElement(_ReportingLines.ManagerSection, null, /*#__PURE__*/_react.default.createElement(_avatar.default, {
size: "xsmall",
src: (_manager$pii = manager.pii) === null || _manager$pii === void 0 ? void 0 : _manager$pii.picture
}), /*#__PURE__*/_react.default.createElement(_ReportingLines.ManagerName, null, (_manager$pii2 = manager.pii) === null || _manager$pii2 === void 0 ? void 0 : _manager$pii2.name))) : /*#__PURE__*/_react.default.createElement(_button.default, {
appearance: "subtle",
spacing: "none",
href: getProfileHref(manager.accountIdentifier, reportingLinesProfileUrl),
onClick: getReportingLinesOnClick(manager, 'manager'),
isDisabled: !onReportingLinesClick
}, /*#__PURE__*/_react.default.createElement(_ReportingLines.ManagerSection, null, /*#__PURE__*/_react.default.createElement(_avatar.default, {
size: "xsmall",
src: (_manager$pii3 = manager.pii) === null || _manager$pii3 === void 0 ? void 0 : _manager$pii3.picture
}), /*#__PURE__*/_react.default.createElement(_ReportingLines.ManagerName, null, (_manager$pii4 = manager.pii) === null || _manager$pii4 === void 0 ? void 0 : _manager$pii4.name))))), hasReports && /*#__PURE__*/_react.default.createElement(_ReportingLines.ReportingLinesSection, null, /*#__PURE__*/_react.default.createElement(_primitives.Box, {
xcss: reportingLinesHeadingDefaultStyles
}, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.default.directReportsSectionHeading)), /*#__PURE__*/_react.default.createElement(_avatarGroup.default, {
appearance: "stack",
size: "small",
data: reports.map(function (member) {
var _member$pii, _member$pii2;
return {
key: member.accountIdentifier,
name: ((_member$pii = member.pii) === null || _member$pii === void 0 ? void 0 : _member$pii.name) || '',
src: (_member$pii2 = member.pii) === null || _member$pii2 === void 0 ? void 0 : _member$pii2.picture,
href: getProfileHref(member.accountIdentifier, reportingLinesProfileUrl),
onClick: getReportingLinesOnClick(member, 'direct-report')
};
}),
maxCount: avatarGroupMaxCount,
testId: "profilecard-reports-avatar-group",
showMoreButtonProps: showMoreButtonProps
})));
};
var _default = exports.default = ReportingLinesDetails;