@atlaskit/profilecard 16.12.1 → 17.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/dist/cjs/client/ProfileCardClient.js +2 -2
- package/dist/cjs/client/TeamProfileCardClient.js +13 -12
- package/dist/cjs/client/UserProfileCardClient.js +25 -2
- package/dist/cjs/client/errorUtils.js +25 -0
- package/dist/cjs/components/Error/ErrorMessage.js +40 -77
- package/dist/cjs/components/Team/TeamLoadingState.js +1 -1
- package/dist/cjs/components/Team/TeamProfileCard.js +4 -4
- package/dist/cjs/components/Team/TeamProfileCardTrigger.js +3 -3
- package/dist/cjs/components/User/OverflowProfileCardButtons.js +44 -10
- package/dist/cjs/components/User/ProfileCard.js +195 -362
- package/dist/cjs/components/User/ProfileCardDetails.js +142 -0
- package/dist/cjs/components/User/ProfileCardResourced.js +25 -20
- package/dist/cjs/components/User/ProfileCardTrigger.js +35 -7
- package/dist/cjs/components/User/ReportingLinesDetails.js +13 -13
- package/dist/cjs/components/User/UserLoadingState.js +14 -2
- package/dist/cjs/util/analytics.js +31 -16
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/client/ProfileCardClient.js +2 -2
- package/dist/es2019/client/TeamProfileCardClient.js +3 -9
- package/dist/es2019/client/UserProfileCardClient.js +23 -2
- package/dist/es2019/client/errorUtils.js +17 -0
- package/dist/es2019/components/Error/ErrorMessage.js +38 -42
- package/dist/es2019/components/Team/TeamLoadingState.js +2 -2
- package/dist/es2019/components/Team/TeamProfileCard.js +5 -5
- package/dist/es2019/components/Team/TeamProfileCardTrigger.js +4 -4
- package/dist/es2019/components/User/OverflowProfileCardButtons.js +30 -4
- package/dist/es2019/components/User/ProfileCard.js +161 -292
- package/dist/es2019/components/User/ProfileCardDetails.js +118 -0
- package/dist/es2019/components/User/ProfileCardResourced.js +21 -21
- package/dist/es2019/components/User/ProfileCardTrigger.js +32 -6
- package/dist/es2019/components/User/ReportingLinesDetails.js +10 -11
- package/dist/es2019/components/User/UserLoadingState.js +10 -2
- package/dist/es2019/util/analytics.js +13 -8
- package/dist/es2019/version.json +1 -1
- package/dist/esm/client/ProfileCardClient.js +2 -2
- package/dist/esm/client/TeamProfileCardClient.js +11 -12
- package/dist/esm/client/UserProfileCardClient.js +22 -2
- package/dist/esm/client/errorUtils.js +17 -0
- package/dist/esm/components/Error/ErrorMessage.js +35 -80
- package/dist/esm/components/Team/TeamLoadingState.js +2 -2
- package/dist/esm/components/Team/TeamProfileCard.js +5 -5
- package/dist/esm/components/Team/TeamProfileCardTrigger.js +4 -4
- package/dist/esm/components/User/OverflowProfileCardButtons.js +39 -9
- package/dist/esm/components/User/ProfileCard.js +180 -362
- package/dist/esm/components/User/ProfileCardDetails.js +120 -0
- package/dist/esm/components/User/ProfileCardResourced.js +17 -17
- package/dist/esm/components/User/ProfileCardTrigger.js +33 -7
- package/dist/esm/components/User/ReportingLinesDetails.js +12 -12
- package/dist/esm/components/User/UserLoadingState.js +7 -2
- package/dist/esm/util/analytics.js +21 -12
- package/dist/esm/version.json +1 -1
- package/dist/types/client/ProfileCardClient.d.ts +3 -2
- package/dist/types/client/TeamProfileCardClient.d.ts +2 -1
- package/dist/types/client/UserProfileCardClient.d.ts +2 -1
- package/dist/types/client/errorUtils.d.ts +6 -0
- package/dist/types/components/Error/ErrorMessage.d.ts +6 -15
- package/dist/types/components/Team/TeamProfileCardTrigger.d.ts +5 -11
- package/dist/types/components/User/OverflowProfileCardButtons.d.ts +4 -3
- package/dist/types/components/User/ProfileCard.d.ts +5 -29
- package/dist/types/components/User/ProfileCardDetails.d.ts +3 -0
- package/dist/types/components/User/ProfileCardResourced.d.ts +7 -3
- package/dist/types/components/User/ProfileCardTrigger.d.ts +3 -40
- package/dist/types/components/User/ReportingLinesDetails.d.ts +2 -4
- package/dist/types/components/User/UserLoadingState.d.ts +5 -1
- package/dist/types/components/User/lazyProfileCard.d.ts +1 -1
- package/dist/types/types.d.ts +11 -10
- package/dist/types/util/analytics.d.ts +22 -13
- package/package.json +8 -8
- package/report.api.md +71 -124
- package/dist/cjs/internal/analytics.js +0 -15
- package/dist/es2019/internal/analytics.js +0 -8
- package/dist/esm/internal/analytics.js +0 -8
- package/dist/types/internal/analytics.d.ts +0 -8
|
@@ -1,14 +1,16 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
3
|
import React, { Suspense } from 'react';
|
|
4
|
+
import { withAnalyticsEvents } from '@atlaskit/analytics-next';
|
|
4
5
|
import { GiveKudosLauncherLazy, KudosType } from '@atlaskit/give-kudos';
|
|
5
|
-
import { AnalyticsName } from '../../internal/analytics';
|
|
6
6
|
import filterActions from '../../internal/filterActions';
|
|
7
7
|
import { CardWrapper } from '../../styled/Card';
|
|
8
|
+
import { fireEvent } from '../../util/analytics';
|
|
8
9
|
import { ErrorMessage } from '../Error';
|
|
9
10
|
import ProfileCard from './ProfileCard';
|
|
10
11
|
import UserLoadingState from './UserLoadingState';
|
|
11
|
-
|
|
12
|
+
|
|
13
|
+
class ProfileCardResourced extends React.PureComponent {
|
|
12
14
|
constructor(...args) {
|
|
13
15
|
super(...args);
|
|
14
16
|
|
|
@@ -25,13 +27,14 @@ export default class ProfileCardResourced extends React.PureComponent {
|
|
|
25
27
|
kudosDrawerOpen: false
|
|
26
28
|
});
|
|
27
29
|
|
|
28
|
-
_defineProperty(this, "
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
30
|
+
_defineProperty(this, "fireAnalytics", payload => {
|
|
31
|
+
// Don't fire analytics if the component is unmounted
|
|
32
|
+
if (!this._isMounted) {
|
|
33
|
+
return;
|
|
34
|
+
}
|
|
32
35
|
|
|
33
|
-
if (
|
|
34
|
-
|
|
36
|
+
if (this.props.createAnalyticsEvent) {
|
|
37
|
+
fireEvent(this.props.createAnalyticsEvent, payload);
|
|
35
38
|
}
|
|
36
39
|
});
|
|
37
40
|
|
|
@@ -54,7 +57,7 @@ export default class ProfileCardResourced extends React.PureComponent {
|
|
|
54
57
|
hasError: false,
|
|
55
58
|
data: null
|
|
56
59
|
}, () => {
|
|
57
|
-
const requests = Promise.all([this.props.resourceClient.getProfile(cloudId, userId), this.props.resourceClient.getReportingLines(userId), this.props.resourceClient.shouldShowGiveKudos()]);
|
|
60
|
+
const requests = Promise.all([this.props.resourceClient.getProfile(cloudId, userId, this.fireAnalytics), this.props.resourceClient.getReportingLines(userId), this.props.resourceClient.shouldShowGiveKudos()]);
|
|
58
61
|
requests.then(res => this.handleClientSuccess(...res), err => this.handleClientError(err)).catch(err => this.handleClientError(err));
|
|
59
62
|
});
|
|
60
63
|
});
|
|
@@ -85,19 +88,12 @@ export default class ProfileCardResourced extends React.PureComponent {
|
|
|
85
88
|
cloudId,
|
|
86
89
|
resourceClient
|
|
87
90
|
} = this.props;
|
|
88
|
-
const {
|
|
89
|
-
hasError
|
|
90
|
-
} = this.state;
|
|
91
91
|
|
|
92
92
|
if (userId !== prevProps.userId || cloudId !== prevProps.cloudId || resourceClient !== prevProps.resourceClient) {
|
|
93
93
|
this.setState({
|
|
94
94
|
isLoading: undefined
|
|
95
95
|
}, this.clientFetchProfile);
|
|
96
96
|
}
|
|
97
|
-
|
|
98
|
-
if (hasError !== prevState.hasError && hasError) {
|
|
99
|
-
this.callAnalytics(AnalyticsName.PROFILE_CARD_RESOURCED_ERROR);
|
|
100
|
-
}
|
|
101
97
|
}
|
|
102
98
|
|
|
103
99
|
componentWillUnmount() {
|
|
@@ -140,7 +136,6 @@ export default class ProfileCardResourced extends React.PureComponent {
|
|
|
140
136
|
isKudosEnabled
|
|
141
137
|
} = this.state;
|
|
142
138
|
const {
|
|
143
|
-
analytics,
|
|
144
139
|
onReportingLinesClick,
|
|
145
140
|
cloudId,
|
|
146
141
|
userId,
|
|
@@ -149,11 +144,14 @@ export default class ProfileCardResourced extends React.PureComponent {
|
|
|
149
144
|
const isFetchingOrNotStartToFetchYet = isLoading === true || isLoading === undefined;
|
|
150
145
|
|
|
151
146
|
if (isFetchingOrNotStartToFetchYet) {
|
|
152
|
-
return /*#__PURE__*/React.createElement(CardWrapper, null, /*#__PURE__*/React.createElement(UserLoadingState,
|
|
147
|
+
return /*#__PURE__*/React.createElement(CardWrapper, null, /*#__PURE__*/React.createElement(UserLoadingState, {
|
|
148
|
+
fireAnalytics: this.fireAnalytics
|
|
149
|
+
}));
|
|
153
150
|
} else if (hasError) {
|
|
154
151
|
return /*#__PURE__*/React.createElement(CardWrapper, null, /*#__PURE__*/React.createElement(ErrorMessage, {
|
|
155
152
|
errorType: error,
|
|
156
|
-
reload: this.clientFetchProfile
|
|
153
|
+
reload: this.clientFetchProfile,
|
|
154
|
+
fireAnalytics: this.fireAnalytics
|
|
157
155
|
}));
|
|
158
156
|
}
|
|
159
157
|
|
|
@@ -161,7 +159,6 @@ export default class ProfileCardResourced extends React.PureComponent {
|
|
|
161
159
|
hasError,
|
|
162
160
|
errorType: error,
|
|
163
161
|
clientFetchProfile: this.clientFetchProfile,
|
|
164
|
-
analytics,
|
|
165
162
|
reportingLines: reportingLinesData,
|
|
166
163
|
onReportingLinesClick: onReportingLinesClick,
|
|
167
164
|
cloudId,
|
|
@@ -194,4 +191,7 @@ export default class ProfileCardResourced extends React.PureComponent {
|
|
|
194
191
|
|
|
195
192
|
_defineProperty(ProfileCardResourced, "defaultProps", {
|
|
196
193
|
actions: []
|
|
197
|
-
});
|
|
194
|
+
});
|
|
195
|
+
|
|
196
|
+
export const ProfileCardResourcedInternal = ProfileCardResourced;
|
|
197
|
+
export default withAnalyticsEvents()(ProfileCardResourced);
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
3
|
import React, { Suspense } from 'react';
|
|
4
|
+
import { withAnalyticsEvents } from '@atlaskit/analytics-next';
|
|
4
5
|
import { GiveKudosLauncherLazy, KudosType } from '@atlaskit/give-kudos';
|
|
5
6
|
import Popup from '@atlaskit/popup';
|
|
6
7
|
import { layers } from '@atlaskit/theme/constants';
|
|
7
8
|
import filterActions from '../../internal/filterActions';
|
|
8
9
|
import { CardWrapper } from '../../styled/Card';
|
|
10
|
+
import { cardTriggered, fireEvent } from '../../util/analytics';
|
|
9
11
|
import { DELAY_MS_HIDE, DELAY_MS_SHOW } from '../../util/config';
|
|
10
12
|
import { ProfileCardLazy } from './lazyProfileCard';
|
|
11
13
|
import UserLoadingState from './UserLoadingState';
|
|
@@ -24,6 +26,17 @@ class ProfilecardTrigger extends React.PureComponent {
|
|
|
24
26
|
|
|
25
27
|
_defineProperty(this, "hideTimer", 0);
|
|
26
28
|
|
|
29
|
+
_defineProperty(this, "fireAnalytics", payload => {
|
|
30
|
+
// Don't fire any analytics if the component is unmounted
|
|
31
|
+
if (!this._isMounted) {
|
|
32
|
+
return;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
if (this.props.createAnalyticsEvent) {
|
|
36
|
+
fireEvent(this.props.createAnalyticsEvent, payload);
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
|
|
27
40
|
_defineProperty(this, "hideProfilecard", () => {
|
|
28
41
|
clearTimeout(this.showTimer);
|
|
29
42
|
clearTimeout(this.hideTimer);
|
|
@@ -53,10 +66,22 @@ class ProfilecardTrigger extends React.PureComponent {
|
|
|
53
66
|
// lozenge in an inline-edit.
|
|
54
67
|
event.stopPropagation();
|
|
55
68
|
this.showProfilecard();
|
|
69
|
+
|
|
70
|
+
if (!this.state.visible) {
|
|
71
|
+
this.fireAnalytics(cardTriggered('user', 'click'));
|
|
72
|
+
}
|
|
73
|
+
});
|
|
74
|
+
|
|
75
|
+
_defineProperty(this, "onMouseEnter", () => {
|
|
76
|
+
this.showProfilecard();
|
|
77
|
+
|
|
78
|
+
if (!this.state.visible) {
|
|
79
|
+
this.fireAnalytics(cardTriggered('user', 'hover'));
|
|
80
|
+
}
|
|
56
81
|
});
|
|
57
82
|
|
|
58
83
|
_defineProperty(this, "containerListeners", this.props.trigger === 'hover' ? {
|
|
59
|
-
onMouseEnter: this.
|
|
84
|
+
onMouseEnter: this.onMouseEnter,
|
|
60
85
|
onMouseLeave: this.hideProfilecard
|
|
61
86
|
} : {
|
|
62
87
|
onClick: this.onClick
|
|
@@ -101,7 +126,7 @@ class ProfilecardTrigger extends React.PureComponent {
|
|
|
101
126
|
hasError: false,
|
|
102
127
|
data: null
|
|
103
128
|
}, () => {
|
|
104
|
-
const requests = Promise.all([this.props.resourceClient.getProfile(cloudId || '', userId), this.props.resourceClient.getReportingLines(userId), this.props.resourceClient.shouldShowGiveKudos()]);
|
|
129
|
+
const requests = Promise.all([this.props.resourceClient.getProfile(cloudId || '', userId, this.fireAnalytics), this.props.resourceClient.getReportingLines(userId), this.props.resourceClient.shouldShowGiveKudos()]);
|
|
105
130
|
requests.then(res => this.handleClientSuccess(...res), err => this.handleClientError(err)).catch(err => this.handleClientError(err));
|
|
106
131
|
});
|
|
107
132
|
});
|
|
@@ -125,7 +150,9 @@ class ProfilecardTrigger extends React.PureComponent {
|
|
|
125
150
|
} = this.state;
|
|
126
151
|
|
|
127
152
|
if (isLoading === true || isLoading === undefined) {
|
|
128
|
-
return /*#__PURE__*/React.createElement(CardWrapper, null, /*#__PURE__*/React.createElement(UserLoadingState,
|
|
153
|
+
return /*#__PURE__*/React.createElement(CardWrapper, null, /*#__PURE__*/React.createElement(UserLoadingState, {
|
|
154
|
+
fireAnalytics: this.fireAnalytics
|
|
155
|
+
}));
|
|
129
156
|
} else {
|
|
130
157
|
return this.renderProfileCard();
|
|
131
158
|
}
|
|
@@ -196,7 +223,6 @@ class ProfilecardTrigger extends React.PureComponent {
|
|
|
196
223
|
userId: this.props.userId,
|
|
197
224
|
isCurrentUser: (_this$state$data = this.state.data) === null || _this$state$data === void 0 ? void 0 : _this$state$data.isCurrentUser,
|
|
198
225
|
clientFetchProfile: this.clientFetchProfile,
|
|
199
|
-
analytics: this.props.analytics,
|
|
200
226
|
...this.state.data,
|
|
201
227
|
reportingLines: this.state.reportingLinesData,
|
|
202
228
|
onReportingLinesClick: this.props.onReportingLinesClick,
|
|
@@ -206,7 +232,7 @@ class ProfilecardTrigger extends React.PureComponent {
|
|
|
206
232
|
openKudosDrawer: this.openKudosDrawer
|
|
207
233
|
};
|
|
208
234
|
const wrapperProps = this.props.trigger === 'hover' ? {
|
|
209
|
-
onMouseEnter: this.
|
|
235
|
+
onMouseEnter: this.onMouseEnter,
|
|
210
236
|
onMouseLeave: this.hideProfilecard
|
|
211
237
|
} : {};
|
|
212
238
|
return /*#__PURE__*/React.createElement("div", wrapperProps, this.state.visible && /*#__PURE__*/React.createElement(Suspense, {
|
|
@@ -269,4 +295,4 @@ _defineProperty(ProfilecardTrigger, "defaultProps", {
|
|
|
269
295
|
position: 'bottom-start'
|
|
270
296
|
});
|
|
271
297
|
|
|
272
|
-
export default ProfilecardTrigger;
|
|
298
|
+
export default withAnalyticsEvents()(ProfilecardTrigger);
|
|
@@ -3,9 +3,9 @@ import { FormattedMessage } from 'react-intl-next';
|
|
|
3
3
|
import Avatar from '@atlaskit/avatar';
|
|
4
4
|
import AvatarGroup from '@atlaskit/avatar-group';
|
|
5
5
|
import Button from '@atlaskit/button/custom-theme-button';
|
|
6
|
-
import { AnalyticsName } from '../../internal/analytics';
|
|
7
6
|
import messages from '../../messages';
|
|
8
7
|
import { ManagerName, ManagerSection, OffsetWrapper, ReportingLinesHeading, ReportingLinesSection } from '../../styled/ReportingLines';
|
|
8
|
+
import { reportingLinesClicked } from '../../util/analytics';
|
|
9
9
|
|
|
10
10
|
function getProfileHref(userId, profileUrl) {
|
|
11
11
|
return profileUrl ? profileUrl + userId : undefined;
|
|
@@ -15,11 +15,10 @@ const ReportingLinesDetails = props => {
|
|
|
15
15
|
var _manager$pii, _manager$pii2;
|
|
16
16
|
|
|
17
17
|
const {
|
|
18
|
+
fireAnalyticsWithDuration,
|
|
18
19
|
reportingLines = {},
|
|
19
20
|
reportingLinesProfileUrl,
|
|
20
|
-
onReportingLinesClick
|
|
21
|
-
analytics = () => {},
|
|
22
|
-
getDuration
|
|
21
|
+
onReportingLinesClick
|
|
23
22
|
} = props;
|
|
24
23
|
const {
|
|
25
24
|
managers = [],
|
|
@@ -28,11 +27,11 @@ const ReportingLinesDetails = props => {
|
|
|
28
27
|
const manager = managers.length >= 1 ? managers[0] : undefined;
|
|
29
28
|
const hasReports = reports.length > 0;
|
|
30
29
|
|
|
31
|
-
const getReportingLinesOnClick = (user,
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
});
|
|
30
|
+
const getReportingLinesOnClick = (user, userType) => onReportingLinesClick ? () => {
|
|
31
|
+
fireAnalyticsWithDuration(duration => reportingLinesClicked({
|
|
32
|
+
duration,
|
|
33
|
+
userType
|
|
34
|
+
}));
|
|
36
35
|
onReportingLinesClick(user);
|
|
37
36
|
} : undefined;
|
|
38
37
|
|
|
@@ -44,7 +43,7 @@ const ReportingLinesDetails = props => {
|
|
|
44
43
|
appearance: "subtle",
|
|
45
44
|
spacing: "none",
|
|
46
45
|
href: getProfileHref(manager.accountIdentifier, reportingLinesProfileUrl),
|
|
47
|
-
onClick: getReportingLinesOnClick(manager, '
|
|
46
|
+
onClick: getReportingLinesOnClick(manager, 'manager'),
|
|
48
47
|
isDisabled: !onReportingLinesClick
|
|
49
48
|
}, /*#__PURE__*/React.createElement(ManagerSection, null, /*#__PURE__*/React.createElement(Avatar, {
|
|
50
49
|
size: "xsmall",
|
|
@@ -60,7 +59,7 @@ const ReportingLinesDetails = props => {
|
|
|
60
59
|
name: ((_member$pii = member.pii) === null || _member$pii === void 0 ? void 0 : _member$pii.name) || '',
|
|
61
60
|
src: (_member$pii2 = member.pii) === null || _member$pii2 === void 0 ? void 0 : _member$pii2.picture,
|
|
62
61
|
href: getProfileHref(member.accountIdentifier, reportingLinesProfileUrl),
|
|
63
|
-
onClick: getReportingLinesOnClick(member, '
|
|
62
|
+
onClick: getReportingLinesOnClick(member, 'direct-report')
|
|
64
63
|
};
|
|
65
64
|
}),
|
|
66
65
|
maxCount: 5,
|
|
@@ -1,7 +1,15 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { useEffect } from 'react';
|
|
2
2
|
import AkSpinner from '@atlaskit/spinner';
|
|
3
3
|
import { SpinnerContainer } from '../../styled/Card';
|
|
4
|
+
import { profileCardRendered } from '../../util/analytics';
|
|
4
5
|
|
|
5
|
-
const UserLoadingState = (
|
|
6
|
+
const UserLoadingState = ({
|
|
7
|
+
fireAnalytics
|
|
8
|
+
}) => {
|
|
9
|
+
useEffect(() => {
|
|
10
|
+
fireAnalytics(profileCardRendered('user', 'spinner'));
|
|
11
|
+
}, [fireAnalytics]);
|
|
12
|
+
return /*#__PURE__*/React.createElement(SpinnerContainer, null, /*#__PURE__*/React.createElement(AkSpinner, null));
|
|
13
|
+
};
|
|
6
14
|
|
|
7
15
|
export default UserLoadingState;
|
|
@@ -4,8 +4,10 @@ import { getPageTime } from './performance';
|
|
|
4
4
|
const ANALYTICS_CHANNEL = 'peopleTeams';
|
|
5
5
|
|
|
6
6
|
const runItLater = cb => {
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
const requestIdleCallback = window.requestIdleCallback;
|
|
8
|
+
|
|
9
|
+
if (typeof requestIdleCallback === 'function') {
|
|
10
|
+
return requestIdleCallback(cb);
|
|
9
11
|
}
|
|
10
12
|
|
|
11
13
|
if (typeof window.requestAnimationFrame === 'function') {
|
|
@@ -27,6 +29,7 @@ export const fireEvent = (createAnalyticsEvent, body) => {
|
|
|
27
29
|
/** Above lines are copied from teams common analytics */
|
|
28
30
|
|
|
29
31
|
const TEAM_SUBJECT = 'teamProfileCard';
|
|
32
|
+
const USER_SUBJECT = 'profilecard';
|
|
30
33
|
|
|
31
34
|
const createEvent = (eventType, action, actionSubject, actionSubjectId, attributes = {}) => ({
|
|
32
35
|
eventType,
|
|
@@ -35,19 +38,21 @@ const createEvent = (eventType, action, actionSubject, actionSubjectId, attribut
|
|
|
35
38
|
actionSubjectId,
|
|
36
39
|
attributes: {
|
|
37
40
|
packageName: "@atlaskit/profilecard",
|
|
38
|
-
packageVersion: "
|
|
41
|
+
packageVersion: "17.0.0",
|
|
39
42
|
...attributes,
|
|
40
|
-
firedAt: getPageTime()
|
|
43
|
+
firedAt: Math.round(getPageTime())
|
|
41
44
|
}
|
|
42
45
|
});
|
|
43
46
|
|
|
44
|
-
export const
|
|
47
|
+
export const cardTriggered = (type, method) => createEvent('ui', 'triggered', type === 'user' ? USER_SUBJECT : TEAM_SUBJECT, undefined, {
|
|
45
48
|
method
|
|
46
49
|
});
|
|
47
50
|
export const teamRequestAnalytics = (action, attributes) => createEvent('operational', action, TEAM_SUBJECT, 'request', attributes);
|
|
48
|
-
export const
|
|
49
|
-
export const
|
|
50
|
-
export const
|
|
51
|
+
export const userRequestAnalytics = (action, attributes) => createEvent('operational', action, USER_SUBJECT, 'request', attributes);
|
|
52
|
+
export const profileCardRendered = (type, actionSubjectId, attributes) => createEvent('ui', 'rendered', type === 'user' ? USER_SUBJECT : TEAM_SUBJECT, actionSubjectId, attributes);
|
|
53
|
+
export const actionClicked = (type, attributes) => createEvent('ui', 'clicked', type === 'user' ? USER_SUBJECT : TEAM_SUBJECT, 'action', attributes);
|
|
54
|
+
export const reportingLinesClicked = attributes => createEvent('ui', 'clicked', USER_SUBJECT, 'reportingLines', attributes);
|
|
55
|
+
export const moreActionsClicked = (type, attributes) => createEvent('ui', 'clicked', type === 'user' ? USER_SUBJECT : TEAM_SUBJECT, 'moreActions', attributes);
|
|
51
56
|
export const teamAvatarClicked = attributes => createEvent('ui', 'clicked', TEAM_SUBJECT, 'avatar', attributes);
|
|
52
57
|
export const moreMembersClicked = attributes => createEvent('ui', 'clicked', TEAM_SUBJECT, 'moreMembers', attributes);
|
|
53
58
|
export const errorRetryClicked = attributes => createEvent('ui', 'clicked', TEAM_SUBJECT, 'errorRetry', attributes);
|
package/dist/es2019/version.json
CHANGED
|
@@ -30,8 +30,8 @@ var ProfileCardClient = /*#__PURE__*/function () {
|
|
|
30
30
|
}
|
|
31
31
|
}, {
|
|
32
32
|
key: "getProfile",
|
|
33
|
-
value: function getProfile(cloudId, userId) {
|
|
34
|
-
return this.userClient.getProfile(cloudId, userId);
|
|
33
|
+
value: function getProfile(cloudId, userId, analytics) {
|
|
34
|
+
return this.userClient.getProfile(cloudId, userId, analytics);
|
|
35
35
|
}
|
|
36
36
|
}, {
|
|
37
37
|
key: "getTeamProfile",
|
|
@@ -1,9 +1,14 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
1
2
|
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
2
3
|
import _createClass from "@babel/runtime/helpers/createClass";
|
|
3
4
|
import _inherits from "@babel/runtime/helpers/inherits";
|
|
4
5
|
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
|
5
6
|
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
|
6
7
|
|
|
8
|
+
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; }
|
|
9
|
+
|
|
10
|
+
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) { _defineProperty(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; }
|
|
11
|
+
|
|
7
12
|
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); }; }
|
|
8
13
|
|
|
9
14
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
@@ -11,6 +16,7 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
|
|
|
11
16
|
import { teamRequestAnalytics } from '../util/analytics';
|
|
12
17
|
import { getPageTime } from '../util/performance';
|
|
13
18
|
import CachingClient from './CachingClient';
|
|
19
|
+
import { getErrorAttributes } from './errorUtils';
|
|
14
20
|
import { getTeamFromAGG } from './getTeamFromAGG';
|
|
15
21
|
import { graphqlQuery } from './graphqlUtils';
|
|
16
22
|
var QUERY = "query Team($teamId: String!, $organizationId: String) {\n Team: Team(teamId: $teamId, organizationId: $organizationId) {\n id,\n description,\n displayName,\n largeHeaderImageUrl,\n smallHeaderImageUrl,\n largeAvatarImageUrl,\n smallAvatarImageUrl,\n members {\n id,\n fullName,\n avatarUrl,\n },\n }\n}";
|
|
@@ -25,12 +31,6 @@ var buildTeamQuery = function buildTeamQuery(teamId, orgId) {
|
|
|
25
31
|
};
|
|
26
32
|
};
|
|
27
33
|
|
|
28
|
-
var IGNORED_ERRORS = ['NotPermitted', 'Gone'];
|
|
29
|
-
|
|
30
|
-
function isRealError(error) {
|
|
31
|
-
return !IGNORED_ERRORS.includes(error.reason);
|
|
32
|
-
}
|
|
33
|
-
|
|
34
34
|
var TeamProfileCardClient = /*#__PURE__*/function (_CachingClient) {
|
|
35
35
|
_inherits(TeamProfileCardClient, _CachingClient);
|
|
36
36
|
|
|
@@ -105,13 +105,12 @@ var TeamProfileCardClient = /*#__PURE__*/function (_CachingClient) {
|
|
|
105
105
|
|
|
106
106
|
resolve(data);
|
|
107
107
|
}).catch(function (error) {
|
|
108
|
-
if (analytics
|
|
109
|
-
analytics(teamRequestAnalytics('failed', {
|
|
110
|
-
duration: getPageTime() - startTime
|
|
111
|
-
|
|
112
|
-
errorReason: error.reason,
|
|
108
|
+
if (analytics) {
|
|
109
|
+
analytics(teamRequestAnalytics('failed', _objectSpread(_objectSpread({
|
|
110
|
+
duration: getPageTime() - startTime
|
|
111
|
+
}, getErrorAttributes(error)), {}, {
|
|
113
112
|
gateway: shouldUseGateway
|
|
114
|
-
}));
|
|
113
|
+
})));
|
|
115
114
|
}
|
|
116
115
|
|
|
117
116
|
reject(error);
|
|
@@ -15,7 +15,10 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
|
15
15
|
|
|
16
16
|
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) { _defineProperty(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; }
|
|
17
17
|
|
|
18
|
+
import { userRequestAnalytics } from '../util/analytics';
|
|
19
|
+
import { getPageTime } from '../util/performance';
|
|
18
20
|
import CachingClient from './CachingClient';
|
|
21
|
+
import { getErrorAttributes } from './errorUtils';
|
|
19
22
|
import { graphqlQuery } from './graphqlUtils';
|
|
20
23
|
/**
|
|
21
24
|
* Transform response from GraphQL
|
|
@@ -38,7 +41,6 @@ export var modifyResponse = function modifyResponse(response) {
|
|
|
38
41
|
return {
|
|
39
42
|
isBot: data.isBot,
|
|
40
43
|
isCurrentUser: data.isCurrentUser,
|
|
41
|
-
isNotMentionable: data.isNotMentionable,
|
|
42
44
|
status: data.status,
|
|
43
45
|
statusModifiedDate: data.statusModifiedDate || undefined,
|
|
44
46
|
avatarUrl: data.avatarUrl || undefined,
|
|
@@ -123,7 +125,7 @@ var UserProfileCardClient = /*#__PURE__*/function (_CachingClient) {
|
|
|
123
125
|
}()
|
|
124
126
|
}, {
|
|
125
127
|
key: "getProfile",
|
|
126
|
-
value: function getProfile(cloudId, userId) {
|
|
128
|
+
value: function getProfile(cloudId, userId, analytics) {
|
|
127
129
|
var _this2 = this;
|
|
128
130
|
|
|
129
131
|
if (!userId) {
|
|
@@ -138,13 +140,31 @@ var UserProfileCardClient = /*#__PURE__*/function (_CachingClient) {
|
|
|
138
140
|
}
|
|
139
141
|
|
|
140
142
|
return new Promise(function (resolve, reject) {
|
|
143
|
+
var startTime = getPageTime();
|
|
144
|
+
|
|
145
|
+
if (analytics) {
|
|
146
|
+
analytics(userRequestAnalytics('triggered'));
|
|
147
|
+
}
|
|
148
|
+
|
|
141
149
|
_this2.makeRequest(cloudId, userId).then(function (data) {
|
|
142
150
|
if (_this2.cache) {
|
|
143
151
|
_this2.setCachedProfile(cacheIdentifier, data);
|
|
144
152
|
}
|
|
145
153
|
|
|
154
|
+
if (analytics) {
|
|
155
|
+
analytics(userRequestAnalytics('succeeded', {
|
|
156
|
+
duration: getPageTime() - startTime
|
|
157
|
+
}));
|
|
158
|
+
}
|
|
159
|
+
|
|
146
160
|
resolve(data);
|
|
147
161
|
}).catch(function (error) {
|
|
162
|
+
if (analytics) {
|
|
163
|
+
analytics(userRequestAnalytics('failed', _objectSpread({
|
|
164
|
+
duration: getPageTime() - startTime
|
|
165
|
+
}, getErrorAttributes(error))));
|
|
166
|
+
}
|
|
167
|
+
|
|
148
168
|
reject(error);
|
|
149
169
|
});
|
|
150
170
|
});
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
var IGNORED_ERRORS = ['NotPermitted', 'Gone'];
|
|
2
|
+
|
|
3
|
+
function isIgnoredError(error) {
|
|
4
|
+
return !!error && IGNORED_ERRORS.includes(error.reason);
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
export var getErrorAttributes = function getErrorAttributes(error) {
|
|
8
|
+
var _error$response, _error$response$heade;
|
|
9
|
+
|
|
10
|
+
var traceId = !!error ? (_error$response = error.response) === null || _error$response === void 0 ? void 0 : (_error$response$heade = _error$response.headers) === null || _error$response$heade === void 0 ? void 0 : _error$response$heade.get('atl-traceid') : undefined;
|
|
11
|
+
return {
|
|
12
|
+
errorStatus: error === null || error === void 0 ? void 0 : error.code,
|
|
13
|
+
errorReason: error === null || error === void 0 ? void 0 : error.reason,
|
|
14
|
+
isSLOFailure: !isIgnoredError(error),
|
|
15
|
+
traceId: traceId !== null && traceId !== void 0 ? traceId : undefined
|
|
16
|
+
};
|
|
17
|
+
};
|
|
@@ -1,86 +1,41 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
|
|
4
|
-
import _inherits from "@babel/runtime/helpers/inherits";
|
|
5
|
-
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
|
6
|
-
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
|
7
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
8
|
-
|
|
9
|
-
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); }; }
|
|
10
|
-
|
|
11
|
-
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
12
|
-
|
|
13
|
-
import React from 'react';
|
|
14
|
-
import AkButton from '@atlaskit/button/custom-theme-button';
|
|
1
|
+
import React, { useEffect } from 'react';
|
|
2
|
+
import Button from '@atlaskit/button/standard-button';
|
|
15
3
|
import IconError from '@atlaskit/icon/glyph/cross-circle';
|
|
16
4
|
import { ErrorText, ErrorTitle, ErrorWrapper } from '../../styled/Error';
|
|
5
|
+
import { profileCardRendered } from '../../util/analytics';
|
|
17
6
|
|
|
18
|
-
var ErrorMessage =
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
7
|
+
var ErrorMessage = function ErrorMessage(props) {
|
|
8
|
+
var errorType = props.errorType || {
|
|
9
|
+
reason: 'default'
|
|
10
|
+
};
|
|
11
|
+
var errorReason = errorType.reason;
|
|
12
|
+
var fireAnalytics = props.fireAnalytics,
|
|
13
|
+
reload = props.reload;
|
|
14
|
+
var hasRetry = !!reload;
|
|
15
|
+
useEffect(function () {
|
|
16
|
+
fireAnalytics(profileCardRendered('user', 'error', {
|
|
17
|
+
hasRetry: hasRetry,
|
|
18
|
+
errorType: errorReason
|
|
19
|
+
}));
|
|
20
|
+
}, [errorReason, fireAnalytics, hasRetry]);
|
|
21
|
+
|
|
22
|
+
var errorContent = function errorContent() {
|
|
23
|
+
if (errorReason === 'NotFound') {
|
|
35
24
|
return /*#__PURE__*/React.createElement(ErrorTitle, null, "The user is no longer available for the site");
|
|
36
|
-
});
|
|
37
|
-
|
|
38
|
-
_defineProperty(_assertThisInitialized(_this), "renderDefault", function () {
|
|
39
|
-
return /*#__PURE__*/React.createElement(ErrorTitle, null, "Oops, looks like we\u2019re having issues", /*#__PURE__*/React.createElement("br", null), _this.props.reload ? /*#__PURE__*/React.createElement(ErrorText, null, "Try again and we\u2019ll give it another shot") : null);
|
|
40
|
-
});
|
|
41
|
-
|
|
42
|
-
_defineProperty(_assertThisInitialized(_this), "renderRetryButton", function () {
|
|
43
|
-
return _this.props.reload ? /*#__PURE__*/React.createElement(AkButton, {
|
|
44
|
-
appearance: "link",
|
|
45
|
-
onClick: _this.props.reload
|
|
46
|
-
}, "Try again") : null;
|
|
47
|
-
});
|
|
48
|
-
|
|
49
|
-
return _this;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
_createClass(ErrorMessage, [{
|
|
53
|
-
key: "renderErrorContent",
|
|
54
|
-
value: function renderErrorContent() {
|
|
55
|
-
var errorType = this.props.errorType || {
|
|
56
|
-
reason: 'default'
|
|
57
|
-
};
|
|
58
|
-
|
|
59
|
-
switch (errorType.reason) {
|
|
60
|
-
case 'NotFound':
|
|
61
|
-
return this.renderNotFound();
|
|
62
|
-
|
|
63
|
-
default:
|
|
64
|
-
return this.renderDefault();
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
}, {
|
|
68
|
-
key: "render",
|
|
69
|
-
value: function render() {
|
|
70
|
-
return /*#__PURE__*/React.createElement(ErrorWrapper, null, /*#__PURE__*/React.createElement(IconError, {
|
|
71
|
-
label: "icon error",
|
|
72
|
-
size: "xlarge"
|
|
73
|
-
}), this.renderErrorContent(), this.renderRetryButton());
|
|
74
25
|
}
|
|
75
|
-
}]);
|
|
76
|
-
|
|
77
|
-
return ErrorMessage;
|
|
78
|
-
}(React.PureComponent);
|
|
79
|
-
|
|
80
|
-
_defineProperty(ErrorMessage, "defaultProps", {
|
|
81
|
-
errorType: {
|
|
82
|
-
reason: 'default'
|
|
83
|
-
}
|
|
84
|
-
});
|
|
85
26
|
|
|
86
|
-
|
|
27
|
+
return /*#__PURE__*/React.createElement(ErrorTitle, null, "Oops, looks like we\u2019re having issues", /*#__PURE__*/React.createElement("br", null), reload && /*#__PURE__*/React.createElement(ErrorText, null, "Try again and we\u2019ll give it another shot"));
|
|
28
|
+
};
|
|
29
|
+
|
|
30
|
+
return /*#__PURE__*/React.createElement(ErrorWrapper, {
|
|
31
|
+
"data-testid": "profilecard-error"
|
|
32
|
+
}, /*#__PURE__*/React.createElement(IconError, {
|
|
33
|
+
label: "icon error",
|
|
34
|
+
size: "xlarge"
|
|
35
|
+
}), errorContent(), reload && /*#__PURE__*/React.createElement(Button, {
|
|
36
|
+
appearance: "link",
|
|
37
|
+
onClick: reload
|
|
38
|
+
}, "Try again"));
|
|
39
|
+
};
|
|
40
|
+
|
|
41
|
+
export default ErrorMessage;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import React, { useEffect } from 'react';
|
|
2
2
|
import Spinner from '@atlaskit/spinner';
|
|
3
3
|
import { CardContent, CardHeader, CardWrapper, LoadingWrapper } from '../../styled/TeamCard';
|
|
4
|
-
import {
|
|
4
|
+
import { profileCardRendered } from '../../util/analytics';
|
|
5
5
|
export default (function (props) {
|
|
6
6
|
var analytics = props.analytics;
|
|
7
7
|
useEffect(function () {
|
|
8
8
|
analytics(function (duration) {
|
|
9
|
-
return
|
|
9
|
+
return profileCardRendered('team', 'spinner', {
|
|
10
10
|
duration: duration
|
|
11
11
|
});
|
|
12
12
|
});
|