@atlaskit/profilecard 24.20.4 → 24.20.5
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/__tests__/vr-tests/__snapshots__/agent-profilecard/agent-profile-card-example--default.png +0 -0
- package/__tests__/vr-tests/__snapshots__/user-profilecard/alternate-actions--default.png +0 -0
- package/__tests__/vr-tests/__snapshots__/user-profilecard/best-case-profile--default.png +0 -0
- package/__tests__/vr-tests/__snapshots__/user-profilecard/bot-case-profile--default.png +0 -0
- package/__tests__/vr-tests/__snapshots__/user-profilecard/error-state--default.png +0 -0
- package/__tests__/vr-tests/__snapshots__/user-profilecard/error-state-not-found--default.png +0 -0
- package/__tests__/vr-tests/__snapshots__/user-profilecard/worst-case-profile--default.png +0 -0
- package/compass.yml +3 -0
- package/dist/cjs/client/getOrgIdForCloudIdFromAGG.js +1 -1
- package/dist/cjs/client/getTeamFromAGG.js +1 -1
- package/dist/cjs/components/common/ProfileCardTrigger.js +17 -21
- package/dist/cjs/components/team-profile-card/main.compiled.css +1 -15
- package/dist/cjs/components/team-profile-card/main.js +81 -185
- package/dist/cjs/components/team-profile-card/team-connections/main.compiled.css +1 -6
- package/dist/cjs/components/team-profile-card/team-connections/main.js +1 -65
- package/dist/cjs/util/analytics.js +2 -2
- package/dist/es2019/client/getOrgIdForCloudIdFromAGG.js +1 -1
- package/dist/es2019/client/getTeamFromAGG.js +1 -1
- package/dist/es2019/components/common/ProfileCardTrigger.js +1 -4
- package/dist/es2019/components/team-profile-card/main.compiled.css +1 -15
- package/dist/es2019/components/team-profile-card/main.js +55 -157
- package/dist/es2019/components/team-profile-card/team-connections/main.compiled.css +1 -6
- package/dist/es2019/components/team-profile-card/team-connections/main.js +1 -69
- package/dist/es2019/util/analytics.js +2 -2
- package/dist/esm/client/getOrgIdForCloudIdFromAGG.js +1 -1
- package/dist/esm/client/getTeamFromAGG.js +1 -1
- package/dist/esm/components/common/ProfileCardTrigger.js +17 -21
- package/dist/esm/components/team-profile-card/main.compiled.css +1 -15
- package/dist/esm/components/team-profile-card/main.js +69 -173
- package/dist/esm/components/team-profile-card/team-connections/main.compiled.css +1 -6
- package/dist/esm/components/team-profile-card/team-connections/main.js +1 -65
- package/dist/esm/util/analytics.js +2 -2
- package/dist/types/components/team-profile-card/team-connections/main.d.ts +0 -1
- package/dist/types-ts4.5/components/team-profile-card/team-connections/main.d.ts +0 -1
- package/package.json +11 -19
- package/afm-post-office/tsconfig.json +0 -123
- package/afm-townsquare/tsconfig.json +0 -123
|
@@ -1,45 +1,31 @@
|
|
|
1
1
|
._11c81vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
2
|
-
._2rko12b0{border-radius:var(--ds-radius-small,4px)}
|
|
3
2
|
._2rko1mok{border-radius:var(--ds-radius-large,8px)}
|
|
4
3
|
._v564nm7n{transition:box-shadow .25s ease-in-out}
|
|
5
|
-
._189ee4h9{border-width:var(--ds-border-width,1px)}
|
|
6
|
-
._1dqonqa1{border-style:solid}
|
|
7
|
-
._1h6dmuej{border-color:var(--ds-border,#091e4224)}
|
|
8
|
-
._15a5nqa1{border-top-style:solid}
|
|
9
4
|
._18m915vq{overflow-y:hidden}
|
|
10
5
|
._18m91wug{overflow-y:auto}
|
|
11
6
|
._18u01ejb{margin-left:var(--ds-space-300,24px)}
|
|
12
7
|
._18u01wug{margin-left:auto}
|
|
13
8
|
._18u0pxbi{margin-left:var(--ds-space-200,1pc)}
|
|
14
9
|
._18u0u2gc{margin-left:var(--ds-space-100,8px)}
|
|
15
|
-
._19bv1ejb{padding-left:var(--ds-space-300,24px)}
|
|
16
10
|
._19pk1b66{margin-top:var(--ds-space-050,4px)}
|
|
17
|
-
._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
|
|
18
11
|
._19pku2gc{margin-top:var(--ds-space-100,8px)}
|
|
19
12
|
._1bsb1gwv{width:360px}
|
|
20
13
|
._1bsb1osq{width:100%}
|
|
21
14
|
._1bsb7vkz{width:1pc}
|
|
22
15
|
._1e0c1txw{display:flex}
|
|
23
|
-
._1i53muej{border-top-color:var(--ds-border,#091e4224)}
|
|
24
16
|
._1reo15vq{overflow-x:hidden}
|
|
25
17
|
._1ul95x59{min-width:340px}
|
|
26
18
|
._2hwx1ejb{margin-right:var(--ds-space-300,24px)}
|
|
27
19
|
._2hwxpxbi{margin-right:var(--ds-space-200,1pc)}
|
|
28
20
|
._2hwxu2gc{margin-right:var(--ds-space-100,8px)}
|
|
29
21
|
._2lx21bp4{flex-direction:column}
|
|
30
|
-
._4cvr1h6o{align-items:center}
|
|
31
22
|
._4t3i12am{height:50px}
|
|
32
|
-
._4t3i1ul9{height:30px}
|
|
33
23
|
._4t3i1wug{height:auto}
|
|
34
|
-
._4t3i53f4{height:75pt}
|
|
35
24
|
._4t3i7vkz{height:1pc}
|
|
36
25
|
._5ral1dfr{object-fit:cover}
|
|
37
|
-
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
38
26
|
._c71lx2si{max-height:265px}
|
|
39
27
|
._kqswstnw{position:absolute}
|
|
40
28
|
._otyr12x7{margin-bottom:var(--ds-space-075,6px)}
|
|
41
29
|
._otyrpxbi{margin-bottom:var(--ds-space-200,1pc)}
|
|
42
30
|
._s7n4jp4b{vertical-align:top}
|
|
43
|
-
._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
|
|
44
|
-
._u5f31ejb{padding-right:var(--ds-space-300,24px)}
|
|
45
|
-
._uwhke4h9{border-top-width:var(--ds-border-width,1px)}
|
|
31
|
+
._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
/* main.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
2
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
3
3
|
import "./main.compiled.css";
|
|
4
|
+
import * as React from 'react';
|
|
4
5
|
import { ax, ix } from "@compiled/react/runtime";
|
|
5
|
-
import
|
|
6
|
+
import { useCallback, useMemo } from 'react';
|
|
6
7
|
import { FormattedMessage } from 'react-intl-next';
|
|
7
8
|
import { useAnalyticsEvents } from '@atlaskit/analytics-next';
|
|
8
9
|
import AvatarGroup from '@atlaskit/avatar-group';
|
|
@@ -10,48 +11,27 @@ import Heading from '@atlaskit/heading';
|
|
|
10
11
|
import LinkItem from '@atlaskit/menu/link-item';
|
|
11
12
|
import { VerifiedTeamIcon } from '@atlaskit/people-teams-ui-public/verified-team-icon';
|
|
12
13
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
|
-
import { Box, Flex, Inline,
|
|
14
|
+
import { Box, Flex, Inline, Stack, Text } from '@atlaskit/primitives/compiled';
|
|
14
15
|
import { useAnalyticsEvents as useAnalyticsEventsNext } from '@atlaskit/teams-app-internal-analytics';
|
|
15
16
|
import TeamAvatar from '@atlaskit/teams-avatar';
|
|
16
17
|
import { TeamContainers, useTeamContainers } from '@atlaskit/teams-public';
|
|
17
18
|
import { fireEvent } from '../../util/analytics';
|
|
18
19
|
import TeamAppTile from '../common/assets/TeamAppTile.svg';
|
|
19
20
|
import { TeamActions } from './team-actions';
|
|
20
|
-
import {
|
|
21
|
+
import { TeamConnections } from './team-connections/main';
|
|
21
22
|
import { TeamContainersSkeleton } from './team-containers-skeleton';
|
|
22
23
|
const noop = () => {};
|
|
23
24
|
const styles = {
|
|
24
25
|
wrapperStyles: "_2rko1mok _v564nm7n _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bsb1gwv _1ul95x59 _4t3i1wug",
|
|
25
26
|
containerStyles: "_otyrpxbi",
|
|
26
27
|
avatarImageStyles: "_kqswstnw _18u01ejb",
|
|
27
|
-
headerImageStyles: "_5ral1dfr _s7n4jp4b
|
|
28
|
-
newHeaderImageStyles: "_5ral1dfr _s7n4jp4b _4t3i12am _1bsb1osq",
|
|
28
|
+
headerImageStyles: "_5ral1dfr _s7n4jp4b _4t3i12am _1bsb1osq",
|
|
29
29
|
teamInformationStyles: "_18u01ejb _19pku2gc _2hwx1ejb",
|
|
30
|
-
teamConnectionHeaderStyles: "_18u0u2gc _2hwxu2gc _c71lx2si _18m91wug",
|
|
31
|
-
teamConnectionContainerStyles: "_18u0u2gc _2hwxu2gc",
|
|
32
30
|
teamConnectionStyles: "_18u0u2gc _2hwxu2gc",
|
|
33
31
|
teamConnectionItemsStyles: "_c71lx2si _18m91wug",
|
|
34
32
|
connectionTitleStyles: "_11c81vhk _18u0pxbi _19pk1b66 _2hwxpxbi _otyr12x7 _syaz1gjq",
|
|
35
|
-
teamAppTileStyles: "_18u01wug _4t3i7vkz _1bsb7vkz"
|
|
36
|
-
viewProfileContainerStyles: "_4cvr1h6o _uwhke4h9 _15a5nqa1 _1i53muej _19bv1ejb _u5f31ejb",
|
|
37
|
-
viewProfileButtonStyles: "_2rko12b0 _189ee4h9 _1dqonqa1 _1h6dmuej _bfhksm61 _syaz1gjq _1bsb1osq _4t3i1ul9 _19pkpxbi"
|
|
33
|
+
teamAppTileStyles: "_18u01wug _4t3i7vkz _1bsb7vkz"
|
|
38
34
|
};
|
|
39
|
-
const TeamCardWrapper = ({
|
|
40
|
-
id,
|
|
41
|
-
children
|
|
42
|
-
}) => /*#__PURE__*/React.createElement(Box, {
|
|
43
|
-
xcss: styles.wrapperStyles,
|
|
44
|
-
testId: `team-card-${id}`
|
|
45
|
-
}, children);
|
|
46
|
-
const HeaderImage = ({
|
|
47
|
-
srcUrl
|
|
48
|
-
}) => /*#__PURE__*/React.createElement(Box, {
|
|
49
|
-
as: "img",
|
|
50
|
-
src: srcUrl,
|
|
51
|
-
xcss: styles.headerImageStyles,
|
|
52
|
-
testId: "profile-header-image",
|
|
53
|
-
alt: "team-header-image"
|
|
54
|
-
});
|
|
55
35
|
export const TeamProfileCard = ({
|
|
56
36
|
containerId,
|
|
57
37
|
teamId,
|
|
@@ -79,9 +59,6 @@ export const TeamProfileCard = ({
|
|
|
79
59
|
} = useAnalyticsEventsNext();
|
|
80
60
|
// Ensure that the current container is not the only connection for this team before showing the "Where we work" section
|
|
81
61
|
const hasOtherTeamConnections = useMemo(() => teamContainers.filter(tc => tc.id === containerId).length < teamContainers.length, [containerId, teamContainers]);
|
|
82
|
-
|
|
83
|
-
// TODO: set isNewLayout to be true when clean up 'team-bi-directional-container-connection' experiment
|
|
84
|
-
const isNewLayout = Boolean(props.isKudosEnabled || props.otherActions);
|
|
85
62
|
const onClick = useCallback(() => {
|
|
86
63
|
if (fg('ptc-enable-profile-card-analytics-refactor')) {
|
|
87
64
|
fireEventNext('ui.button.clicked.viewTeamProfileButton', {});
|
|
@@ -95,117 +72,16 @@ export const TeamProfileCard = ({
|
|
|
95
72
|
});
|
|
96
73
|
}
|
|
97
74
|
}
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
src: headerImageUrl,
|
|
109
|
-
xcss: styles.newHeaderImageStyles,
|
|
110
|
-
testId: "profile-header-image",
|
|
111
|
-
alt: "team-header-image"
|
|
112
|
-
}), /*#__PURE__*/React.createElement(Stack, {
|
|
113
|
-
space: "space.200",
|
|
114
|
-
xcss: styles.containerStyles
|
|
115
|
-
}, /*#__PURE__*/React.createElement(Inline, {
|
|
116
|
-
spread: "space-between",
|
|
117
|
-
alignBlock: "center"
|
|
118
|
-
}, /*#__PURE__*/React.createElement(Box, {
|
|
119
|
-
xcss: styles.avatarImageStyles
|
|
120
|
-
}, /*#__PURE__*/React.createElement(TeamAvatar, {
|
|
121
|
-
size: "medium",
|
|
122
|
-
src: avatarImageUrl
|
|
123
|
-
}))), /*#__PURE__*/React.createElement(Stack, {
|
|
124
|
-
xcss: styles.teamInformationStyles,
|
|
125
|
-
space: "space.200"
|
|
126
|
-
}, /*#__PURE__*/React.createElement(Flex, {
|
|
127
|
-
justifyContent: "space-between"
|
|
128
|
-
}, /*#__PURE__*/React.createElement(Stack, {
|
|
129
|
-
space: "space.050"
|
|
130
|
-
}, /*#__PURE__*/React.createElement(Inline, {
|
|
131
|
-
alignBlock: "center"
|
|
132
|
-
}, /*#__PURE__*/React.createElement(Heading, {
|
|
133
|
-
size: "medium"
|
|
134
|
-
}, displayName), isVerified && /*#__PURE__*/React.createElement(VerifiedTeamIcon, {
|
|
135
|
-
showTooltip: true
|
|
136
|
-
})), /*#__PURE__*/React.createElement(Text, {
|
|
137
|
-
color: "color.text.subtlest"
|
|
138
|
-
}, typeof memberCount === 'string' ? /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
139
|
-
defaultMessage: "Contributing team \u2022 {memberCount} members",
|
|
140
|
-
values: {
|
|
141
|
-
memberCount
|
|
142
|
-
},
|
|
143
|
-
id: "people-and-teams.team-profile-card.large-member-count"
|
|
144
|
-
}) : /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
145
|
-
defaultMessage: "Contributing team \u2022 {count, plural, one {# member} other {# members}}",
|
|
146
|
-
values: {
|
|
147
|
-
count: memberCount
|
|
148
|
-
},
|
|
149
|
-
id: "people-and-teams.team-profile-card.member-count"
|
|
150
|
-
}))), /*#__PURE__*/React.createElement(TeamActions, _extends({
|
|
151
|
-
cloudId: cloudId,
|
|
152
|
-
teamId: teamId
|
|
153
|
-
}, props))), /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement(AvatarGroup, {
|
|
154
|
-
appearance: "stack",
|
|
155
|
-
data: memberAvatars
|
|
156
|
-
})), description && /*#__PURE__*/React.createElement(Text, {
|
|
157
|
-
color: "color.text",
|
|
158
|
-
maxLines: 3
|
|
159
|
-
}, description)), /*#__PURE__*/React.createElement(Box, {
|
|
160
|
-
xcss: styles.teamConnectionStyles
|
|
161
|
-
}, /*#__PURE__*/React.createElement(Box, {
|
|
162
|
-
xcss: styles.connectionTitleStyles
|
|
163
|
-
}, /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
164
|
-
defaultMessage: "Team links",
|
|
165
|
-
id: "people-and-teams.team-profile-card.team-connections"
|
|
166
|
-
})), /*#__PURE__*/React.createElement(Box, {
|
|
167
|
-
xcss: styles.teamConnectionItemsStyles
|
|
168
|
-
}, /*#__PURE__*/React.createElement(LinkItem, {
|
|
169
|
-
href: teamProfileUrl,
|
|
170
|
-
target: "_blank",
|
|
171
|
-
onClick: onClick,
|
|
172
|
-
description: /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
173
|
-
defaultMessage: "Team profile",
|
|
174
|
-
id: "people-and-teams.team-profile-card.team-profile-description"
|
|
175
|
-
}),
|
|
176
|
-
iconBefore: /*#__PURE__*/React.createElement(TeamAvatar, {
|
|
177
|
-
size: "small",
|
|
178
|
-
src: avatarImageUrl
|
|
179
|
-
}),
|
|
180
|
-
iconAfter: /*#__PURE__*/React.createElement(Box, {
|
|
181
|
-
as: "img",
|
|
182
|
-
src: TeamAppTile,
|
|
183
|
-
testId: "team-app-tile",
|
|
184
|
-
alt: "team-app-tile",
|
|
185
|
-
xcss: styles.teamAppTileStyles
|
|
186
|
-
}),
|
|
187
|
-
testId: "team-profile-card-profile-link-item"
|
|
188
|
-
}, /*#__PURE__*/React.createElement(Text, {
|
|
189
|
-
maxLines: 1,
|
|
190
|
-
color: "color.text"
|
|
191
|
-
}, displayName)), (loading || hasOtherTeamConnections) && /*#__PURE__*/React.createElement(TeamContainers, {
|
|
192
|
-
teamId: teamId,
|
|
193
|
-
onAddAContainerClick: noop,
|
|
194
|
-
userId: userId,
|
|
195
|
-
cloudId: cloudId,
|
|
196
|
-
components: {
|
|
197
|
-
ContainerCard: NewTeamConnections,
|
|
198
|
-
TeamContainersSkeleton: TeamContainersSkeleton
|
|
199
|
-
},
|
|
200
|
-
filterContainerId: containerId,
|
|
201
|
-
isDisplayedOnProfileCard: true,
|
|
202
|
-
maxNumberOfContainersToShow: loading ? 0 : 9
|
|
203
|
-
})))));
|
|
204
|
-
}
|
|
205
|
-
return /*#__PURE__*/React.createElement(TeamCardWrapper, {
|
|
206
|
-
id: teamId
|
|
207
|
-
}, /*#__PURE__*/React.createElement(HeaderImage, {
|
|
208
|
-
srcUrl: headerImageUrl
|
|
75
|
+
}, [createAnalyticsEvent, fireEventNext]);
|
|
76
|
+
return /*#__PURE__*/React.createElement(Box, {
|
|
77
|
+
xcss: styles.wrapperStyles,
|
|
78
|
+
testId: `team-card-${teamId}`
|
|
79
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
80
|
+
as: "img",
|
|
81
|
+
src: headerImageUrl,
|
|
82
|
+
xcss: styles.headerImageStyles,
|
|
83
|
+
testId: "profile-header-image",
|
|
84
|
+
alt: "team-header-image"
|
|
209
85
|
}), /*#__PURE__*/React.createElement(Stack, {
|
|
210
86
|
space: "space.200",
|
|
211
87
|
xcss: styles.containerStyles
|
|
@@ -220,6 +96,8 @@ export const TeamProfileCard = ({
|
|
|
220
96
|
}))), /*#__PURE__*/React.createElement(Stack, {
|
|
221
97
|
xcss: styles.teamInformationStyles,
|
|
222
98
|
space: "space.200"
|
|
99
|
+
}, /*#__PURE__*/React.createElement(Flex, {
|
|
100
|
+
justifyContent: "space-between"
|
|
223
101
|
}, /*#__PURE__*/React.createElement(Stack, {
|
|
224
102
|
space: "space.050"
|
|
225
103
|
}, /*#__PURE__*/React.createElement(Inline, {
|
|
@@ -242,20 +120,48 @@ export const TeamProfileCard = ({
|
|
|
242
120
|
count: memberCount
|
|
243
121
|
},
|
|
244
122
|
id: "people-and-teams.team-profile-card.member-count"
|
|
245
|
-
}))), /*#__PURE__*/React.createElement(
|
|
123
|
+
}))), /*#__PURE__*/React.createElement(TeamActions, _extends({
|
|
124
|
+
cloudId: cloudId,
|
|
125
|
+
teamId: teamId
|
|
126
|
+
}, props))), /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement(AvatarGroup, {
|
|
246
127
|
appearance: "stack",
|
|
247
128
|
data: memberAvatars
|
|
248
129
|
})), description && /*#__PURE__*/React.createElement(Text, {
|
|
249
130
|
color: "color.text",
|
|
250
131
|
maxLines: 3
|
|
251
|
-
}, description)),
|
|
252
|
-
xcss:
|
|
253
|
-
},
|
|
132
|
+
}, description)), /*#__PURE__*/React.createElement(Box, {
|
|
133
|
+
xcss: styles.teamConnectionStyles
|
|
134
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
254
135
|
xcss: styles.connectionTitleStyles
|
|
255
136
|
}, /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
256
|
-
defaultMessage: "
|
|
257
|
-
id: "people-and-teams.team-profile-card.team-connections
|
|
258
|
-
})), /*#__PURE__*/React.createElement(
|
|
137
|
+
defaultMessage: "Team links",
|
|
138
|
+
id: "people-and-teams.team-profile-card.team-connections"
|
|
139
|
+
})), /*#__PURE__*/React.createElement(Box, {
|
|
140
|
+
xcss: styles.teamConnectionItemsStyles
|
|
141
|
+
}, /*#__PURE__*/React.createElement(LinkItem, {
|
|
142
|
+
href: teamProfileUrl,
|
|
143
|
+
target: "_blank",
|
|
144
|
+
onClick: onClick,
|
|
145
|
+
description: /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
146
|
+
defaultMessage: "Team profile",
|
|
147
|
+
id: "people-and-teams.team-profile-card.team-profile-description"
|
|
148
|
+
}),
|
|
149
|
+
iconBefore: /*#__PURE__*/React.createElement(TeamAvatar, {
|
|
150
|
+
size: "small",
|
|
151
|
+
src: avatarImageUrl
|
|
152
|
+
}),
|
|
153
|
+
iconAfter: /*#__PURE__*/React.createElement(Box, {
|
|
154
|
+
as: "img",
|
|
155
|
+
src: TeamAppTile,
|
|
156
|
+
testId: "team-app-tile",
|
|
157
|
+
alt: "team-app-tile",
|
|
158
|
+
xcss: styles.teamAppTileStyles
|
|
159
|
+
}),
|
|
160
|
+
testId: "team-profile-card-profile-link-item"
|
|
161
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
162
|
+
maxLines: 1,
|
|
163
|
+
color: "color.text"
|
|
164
|
+
}, displayName)), (loading || hasOtherTeamConnections) && /*#__PURE__*/React.createElement(TeamContainers, {
|
|
259
165
|
teamId: teamId,
|
|
260
166
|
onAddAContainerClick: noop,
|
|
261
167
|
userId: userId,
|
|
@@ -265,15 +171,7 @@ export const TeamProfileCard = ({
|
|
|
265
171
|
TeamContainersSkeleton: TeamContainersSkeleton
|
|
266
172
|
},
|
|
267
173
|
filterContainerId: containerId,
|
|
268
|
-
isDisplayedOnProfileCard: true
|
|
269
|
-
|
|
270
|
-
xcss: styles.viewProfileContainerStyles
|
|
271
|
-
}, /*#__PURE__*/React.createElement(Pressable, {
|
|
272
|
-
onClick: onClick,
|
|
273
|
-
xcss: styles.viewProfileButtonStyles,
|
|
274
|
-
testId: "view-profile-button"
|
|
275
|
-
}, /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
276
|
-
defaultMessage: "View profile",
|
|
277
|
-
id: "people-and-teams.team-profile-card.view-profile"
|
|
174
|
+
isDisplayedOnProfileCard: true,
|
|
175
|
+
maxNumberOfContainersToShow: loading ? 0 : 9
|
|
278
176
|
})))));
|
|
279
177
|
};
|
|
@@ -1,8 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
._2rko12b0{border-radius:var(--ds-radius-small,4px)}._18u01wug{margin-left:auto}
|
|
3
|
-
._1bsb1tcg{width:24px}
|
|
1
|
+
._18u01wug{margin-left:auto}
|
|
4
2
|
._1bsb7vkz{width:1pc}
|
|
5
|
-
._1e0c1txw{display:flex}
|
|
6
|
-
._4cvr1h6o{align-items:center}
|
|
7
|
-
._4t3i1tcg{height:24px}
|
|
8
3
|
._4t3i7vkz{height:1pc}
|
|
@@ -5,13 +5,11 @@ import React, { useCallback } from 'react';
|
|
|
5
5
|
import { useAnalyticsEvents } from '@atlaskit/analytics-next';
|
|
6
6
|
import { LinkItem } from '@atlaskit/menu';
|
|
7
7
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
|
-
import { Box, Inline,
|
|
8
|
+
import { Box, Inline, Text } from '@atlaskit/primitives/compiled';
|
|
9
9
|
import { useAnalyticsEvents as useAnalyticsEventsNext } from '@atlaskit/teams-app-internal-analytics';
|
|
10
10
|
import { ContainerIcon, getContainerProperties } from '@atlaskit/teams-public';
|
|
11
11
|
import { fireEvent } from '../../../util/analytics';
|
|
12
12
|
const styles = {
|
|
13
|
-
containerWrapperStyles: "_1e0c1txw _4cvr1h6o",
|
|
14
|
-
containerIconStyles: "_2rko12b0 _4t3i1tcg _1bsb1tcg",
|
|
15
13
|
containerTypeIconButtonStyles: "_18u01wug _4t3i7vkz _1bsb7vkz"
|
|
16
14
|
};
|
|
17
15
|
export const TeamConnections = ({
|
|
@@ -19,72 +17,6 @@ export const TeamConnections = ({
|
|
|
19
17
|
title,
|
|
20
18
|
containerIcon,
|
|
21
19
|
link
|
|
22
|
-
}) => {
|
|
23
|
-
const {
|
|
24
|
-
description,
|
|
25
|
-
icon,
|
|
26
|
-
containerTypeText
|
|
27
|
-
} = getContainerProperties({
|
|
28
|
-
containerType,
|
|
29
|
-
iconSize: 'medium',
|
|
30
|
-
isDisplayedOnProfileCard: true
|
|
31
|
-
});
|
|
32
|
-
const {
|
|
33
|
-
createAnalyticsEvent
|
|
34
|
-
} = useAnalyticsEvents();
|
|
35
|
-
const {
|
|
36
|
-
fireEvent: fireEventNext
|
|
37
|
-
} = useAnalyticsEventsNext();
|
|
38
|
-
const onClick = useCallback(() => {
|
|
39
|
-
if (fg('ptc-enable-profile-card-analytics-refactor')) {
|
|
40
|
-
fireEventNext('ui.teamConnectionItem.clicked.teamProfileCard', {
|
|
41
|
-
container: containerType
|
|
42
|
-
});
|
|
43
|
-
} else {
|
|
44
|
-
fireEvent(createAnalyticsEvent, {
|
|
45
|
-
action: 'clicked',
|
|
46
|
-
actionSubject: 'teamConnectionItem',
|
|
47
|
-
actionSubjectId: 'teamProfileCard',
|
|
48
|
-
attributes: {
|
|
49
|
-
container: containerType
|
|
50
|
-
}
|
|
51
|
-
});
|
|
52
|
-
}
|
|
53
|
-
}, [containerType, createAnalyticsEvent, fireEventNext]);
|
|
54
|
-
return /*#__PURE__*/React.createElement(LinkItem, {
|
|
55
|
-
href: link,
|
|
56
|
-
onClick: onClick,
|
|
57
|
-
target: "_blank"
|
|
58
|
-
}, /*#__PURE__*/React.createElement(Inline, {
|
|
59
|
-
space: "space.100",
|
|
60
|
-
xcss: styles.containerWrapperStyles
|
|
61
|
-
}, /*#__PURE__*/React.createElement(ContainerIcon, {
|
|
62
|
-
containerType: containerType,
|
|
63
|
-
title: title,
|
|
64
|
-
containerIcon: containerIcon,
|
|
65
|
-
size: "small"
|
|
66
|
-
}), /*#__PURE__*/React.createElement(Stack, null, /*#__PURE__*/React.createElement(Text, {
|
|
67
|
-
maxLines: 1,
|
|
68
|
-
color: "color.text"
|
|
69
|
-
}, title), /*#__PURE__*/React.createElement(Inline, {
|
|
70
|
-
space: "space.050"
|
|
71
|
-
}, /*#__PURE__*/React.createElement(Text, {
|
|
72
|
-
size: "small",
|
|
73
|
-
color: "color.text.subtlest"
|
|
74
|
-
}, description), /*#__PURE__*/React.createElement(Text, {
|
|
75
|
-
size: "small",
|
|
76
|
-
color: "color.text.subtlest"
|
|
77
|
-
}, containerTypeText))), /*#__PURE__*/React.createElement(Box, {
|
|
78
|
-
backgroundColor: 'color.background.neutral.subtle',
|
|
79
|
-
xcss: styles.containerTypeIconButtonStyles,
|
|
80
|
-
testId: "container-type-icon"
|
|
81
|
-
}, icon)));
|
|
82
|
-
};
|
|
83
|
-
export const NewTeamConnections = ({
|
|
84
|
-
containerType,
|
|
85
|
-
title,
|
|
86
|
-
containerIcon,
|
|
87
|
-
link
|
|
88
20
|
}) => {
|
|
89
21
|
const {
|
|
90
22
|
description,
|
|
@@ -4,7 +4,7 @@ import { getPageTime } from './performance';
|
|
|
4
4
|
const ANALYTICS_CHANNEL = 'peopleTeams';
|
|
5
5
|
export const PACKAGE_META_DATA = {
|
|
6
6
|
packageName: "@atlaskit/profilecard",
|
|
7
|
-
packageVersion: "
|
|
7
|
+
packageVersion: "0.0.0-development"
|
|
8
8
|
};
|
|
9
9
|
const runItLater = cb => {
|
|
10
10
|
const requestIdleCallback = window.requestIdleCallback;
|
|
@@ -45,7 +45,7 @@ const createEvent = (eventType, action, actionSubject, actionSubjectId, attribut
|
|
|
45
45
|
actionSubjectId,
|
|
46
46
|
attributes: {
|
|
47
47
|
packageName: "@atlaskit/profilecard",
|
|
48
|
-
packageVersion: "
|
|
48
|
+
packageVersion: "0.0.0-development",
|
|
49
49
|
...attributes,
|
|
50
50
|
firedAt: Math.round(getPageTime())
|
|
51
51
|
}
|
|
@@ -4,7 +4,7 @@ import { AGGQuery } from './graphqlUtils';
|
|
|
4
4
|
var ORG_ID_FROM_CLOUD_ID_QUERY = "query OrgIdFromCloudId($cloudId: ID!) {\n\ttenantContexts(cloudIds: [$cloudId]) {\n\t\torgId\n\t}\n}";
|
|
5
5
|
var addHeaders = function addHeaders(headers) {
|
|
6
6
|
headers.append('atl-client-name', "@atlaskit/profilecard");
|
|
7
|
-
headers.append('atl-client-version', "
|
|
7
|
+
headers.append('atl-client-version', "0.0.0-development");
|
|
8
8
|
return headers;
|
|
9
9
|
};
|
|
10
10
|
export function getOrgIdForCloudIdFromAGG(_x, _x2) {
|
|
@@ -59,7 +59,7 @@ export var addHeaders = function addHeaders(headers) {
|
|
|
59
59
|
headers.append('X-ExperimentalApi', 'teams-beta');
|
|
60
60
|
headers.append('X-ExperimentalApi', 'team-members-beta');
|
|
61
61
|
headers.append('atl-client-name', "@atlaskit/profilecard");
|
|
62
|
-
headers.append('atl-client-version', "
|
|
62
|
+
headers.append('atl-client-version', "0.0.0-development");
|
|
63
63
|
return headers;
|
|
64
64
|
};
|
|
65
65
|
export function getTeamFromAGG(_x, _x2, _x3) {
|
|
@@ -122,27 +122,23 @@ function ProfileCardTriggerInner(_ref, ref) {
|
|
|
122
122
|
}));
|
|
123
123
|
},
|
|
124
124
|
content: function content() {
|
|
125
|
-
return (
|
|
126
|
-
|
|
127
|
-
// eslint-disable-next-line @atlassian/a11y/
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
profileData: profileData,
|
|
143
|
-
error: error
|
|
144
|
-
}))
|
|
145
|
-
);
|
|
125
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
126
|
+
onMouseEnter: onMouseEnter
|
|
127
|
+
// eslint-disable-next-line @atlassian/a11y/mouse-events-have-key-events
|
|
128
|
+
,
|
|
129
|
+
onMouseLeave: hideProfilecard,
|
|
130
|
+
onFocus: showProfilecard,
|
|
131
|
+
"data-testid": "profile-card--trigger-content"
|
|
132
|
+
}, isLoading ? /*#__PURE__*/React.createElement(ProfileCardWrapper, {
|
|
133
|
+
testId: "profilecard.profilecardtrigger.loading"
|
|
134
|
+
}, /*#__PURE__*/React.createElement(LoadingState, {
|
|
135
|
+
fireAnalytics: fireAnalytics,
|
|
136
|
+
fireAnalyticsNext: fireAnalyticsNext,
|
|
137
|
+
profileType: profileCardType
|
|
138
|
+
})) : renderProfileCard({
|
|
139
|
+
profileData: profileData,
|
|
140
|
+
error: error
|
|
141
|
+
}));
|
|
146
142
|
}
|
|
147
143
|
}));
|
|
148
144
|
}
|
|
@@ -1,45 +1,31 @@
|
|
|
1
1
|
._11c81vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
2
|
-
._2rko12b0{border-radius:var(--ds-radius-small,4px)}
|
|
3
2
|
._2rko1mok{border-radius:var(--ds-radius-large,8px)}
|
|
4
3
|
._v564nm7n{transition:box-shadow .25s ease-in-out}
|
|
5
|
-
._189ee4h9{border-width:var(--ds-border-width,1px)}
|
|
6
|
-
._1dqonqa1{border-style:solid}
|
|
7
|
-
._1h6dmuej{border-color:var(--ds-border,#091e4224)}
|
|
8
|
-
._15a5nqa1{border-top-style:solid}
|
|
9
4
|
._18m915vq{overflow-y:hidden}
|
|
10
5
|
._18m91wug{overflow-y:auto}
|
|
11
6
|
._18u01ejb{margin-left:var(--ds-space-300,24px)}
|
|
12
7
|
._18u01wug{margin-left:auto}
|
|
13
8
|
._18u0pxbi{margin-left:var(--ds-space-200,1pc)}
|
|
14
9
|
._18u0u2gc{margin-left:var(--ds-space-100,8px)}
|
|
15
|
-
._19bv1ejb{padding-left:var(--ds-space-300,24px)}
|
|
16
10
|
._19pk1b66{margin-top:var(--ds-space-050,4px)}
|
|
17
|
-
._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
|
|
18
11
|
._19pku2gc{margin-top:var(--ds-space-100,8px)}
|
|
19
12
|
._1bsb1gwv{width:360px}
|
|
20
13
|
._1bsb1osq{width:100%}
|
|
21
14
|
._1bsb7vkz{width:1pc}
|
|
22
15
|
._1e0c1txw{display:flex}
|
|
23
|
-
._1i53muej{border-top-color:var(--ds-border,#091e4224)}
|
|
24
16
|
._1reo15vq{overflow-x:hidden}
|
|
25
17
|
._1ul95x59{min-width:340px}
|
|
26
18
|
._2hwx1ejb{margin-right:var(--ds-space-300,24px)}
|
|
27
19
|
._2hwxpxbi{margin-right:var(--ds-space-200,1pc)}
|
|
28
20
|
._2hwxu2gc{margin-right:var(--ds-space-100,8px)}
|
|
29
21
|
._2lx21bp4{flex-direction:column}
|
|
30
|
-
._4cvr1h6o{align-items:center}
|
|
31
22
|
._4t3i12am{height:50px}
|
|
32
|
-
._4t3i1ul9{height:30px}
|
|
33
23
|
._4t3i1wug{height:auto}
|
|
34
|
-
._4t3i53f4{height:75pt}
|
|
35
24
|
._4t3i7vkz{height:1pc}
|
|
36
25
|
._5ral1dfr{object-fit:cover}
|
|
37
|
-
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
38
26
|
._c71lx2si{max-height:265px}
|
|
39
27
|
._kqswstnw{position:absolute}
|
|
40
28
|
._otyr12x7{margin-bottom:var(--ds-space-075,6px)}
|
|
41
29
|
._otyrpxbi{margin-bottom:var(--ds-space-200,1pc)}
|
|
42
30
|
._s7n4jp4b{vertical-align:top}
|
|
43
|
-
._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
|
|
44
|
-
._u5f31ejb{padding-right:var(--ds-space-300,24px)}
|
|
45
|
-
._uwhke4h9{border-top-width:var(--ds-border-width,1px)}
|
|
31
|
+
._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
|