@atlaskit/smart-card 16.1.0 → 16.3.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 +58 -0
- package/dist/cjs/client/utils/environments.js +1 -1
- package/dist/cjs/extractors/block/index.js +2 -2
- package/dist/cjs/extractors/common/actions/extractPreviewAction.js +2 -2
- package/dist/cjs/index.js +42 -0
- package/dist/cjs/providers/editor/transformer.js +6 -2
- package/dist/cjs/state/actions/index.js +14 -7
- package/dist/cjs/state/analytics/index.js +32 -84
- package/dist/cjs/state/analytics/ufoExperiences.js +63 -0
- package/dist/cjs/state/analytics/useSmartLinkAnalytics.js +114 -0
- package/dist/cjs/state/hooks/useSmartLink.js +6 -6
- package/dist/cjs/utils/analytics/analytics.js +6 -6
- package/dist/cjs/version.json +1 -1
- package/dist/cjs/view/BlockCard/index.js +1 -1
- package/dist/cjs/view/CardWithUrl/component-lazy/index.js +1 -1
- package/dist/cjs/view/CardWithUrl/component.js +8 -3
- package/dist/cjs/view/CardWithUrl/loader.js +106 -134
- package/dist/cjs/view/EmbedCard/index.js +1 -1
- package/dist/es2019/client/utils/environments.js +1 -1
- package/dist/es2019/extractors/block/index.js +2 -2
- package/dist/es2019/extractors/common/actions/extractPreviewAction.js +2 -2
- package/dist/es2019/index.js +1 -1
- package/dist/es2019/providers/editor/transformer.js +4 -2
- package/dist/es2019/state/actions/index.js +10 -5
- package/dist/es2019/state/analytics/index.js +2 -40
- package/dist/es2019/state/analytics/ufoExperiences.js +43 -0
- package/dist/es2019/state/analytics/useSmartLinkAnalytics.js +76 -0
- package/dist/es2019/state/hooks/useSmartLink.js +4 -5
- package/dist/es2019/utils/analytics/analytics.js +6 -6
- package/dist/es2019/version.json +1 -1
- package/dist/es2019/view/BlockCard/index.js +2 -2
- package/dist/es2019/view/CardWithUrl/component-lazy/index.js +1 -1
- package/dist/es2019/view/CardWithUrl/component.js +8 -3
- package/dist/es2019/view/CardWithUrl/loader.js +83 -92
- package/dist/es2019/view/EmbedCard/index.js +2 -2
- package/dist/esm/client/utils/environments.js +1 -1
- package/dist/esm/extractors/block/index.js +2 -2
- package/dist/esm/extractors/common/actions/extractPreviewAction.js +2 -2
- package/dist/esm/index.js +1 -1
- package/dist/esm/providers/editor/transformer.js +6 -2
- package/dist/esm/state/actions/index.js +13 -7
- package/dist/esm/state/analytics/index.js +2 -80
- package/dist/esm/state/analytics/ufoExperiences.js +43 -0
- package/dist/esm/state/analytics/useSmartLinkAnalytics.js +102 -0
- package/dist/esm/state/hooks/useSmartLink.js +6 -6
- package/dist/esm/utils/analytics/analytics.js +6 -6
- package/dist/esm/version.json +1 -1
- package/dist/esm/view/BlockCard/index.js +2 -2
- package/dist/esm/view/CardWithUrl/component-lazy/index.js +1 -1
- package/dist/esm/view/CardWithUrl/component.js +8 -3
- package/dist/esm/view/CardWithUrl/loader.js +101 -130
- package/dist/esm/view/EmbedCard/index.js +2 -2
- package/dist/types/extractors/block/types.d.ts +1 -1
- package/dist/types/extractors/common/actions/extractPreviewAction.d.ts +1 -1
- package/dist/types/index.d.ts +1 -1
- package/dist/types/state/analytics/index.d.ts +3 -32
- package/dist/types/state/analytics/ufoExperiences.d.ts +7 -0
- package/dist/types/state/analytics/useSmartLinkAnalytics.d.ts +31 -0
- package/dist/types/state/hooks/useSmartLink.d.ts +5 -6
- package/dist/types/utils/analytics/analytics.d.ts +3 -3
- package/dist/types/view/CardWithUrl/component-lazy/index.d.ts +1 -1
- package/dist/types/view/CardWithUrl/loader.d.ts +1 -15
- package/package.json +19 -16
|
@@ -69,7 +69,7 @@ export const unresolvedEvent = (id, status, definitionId, extensionKey, resource
|
|
|
69
69
|
} : undefined
|
|
70
70
|
}
|
|
71
71
|
});
|
|
72
|
-
export const invokeSucceededEvent = (id,
|
|
72
|
+
export const invokeSucceededEvent = (id, extensionKey, actionType, display) => {
|
|
73
73
|
const measure = getMeasure(id, 'resolved') || {
|
|
74
74
|
duration: undefined
|
|
75
75
|
};
|
|
@@ -81,12 +81,12 @@ export const invokeSucceededEvent = (id, providerKey, actionType, display) => {
|
|
|
81
81
|
id,
|
|
82
82
|
actionType,
|
|
83
83
|
display,
|
|
84
|
-
|
|
84
|
+
extensionKey,
|
|
85
85
|
duration: measure.duration
|
|
86
86
|
}
|
|
87
87
|
};
|
|
88
88
|
};
|
|
89
|
-
export const invokeFailedEvent = (id,
|
|
89
|
+
export const invokeFailedEvent = (id, extensionKey, actionType, display, reason) => {
|
|
90
90
|
const measure = getMeasure(id, 'errored') || {
|
|
91
91
|
duration: undefined
|
|
92
92
|
};
|
|
@@ -98,7 +98,7 @@ export const invokeFailedEvent = (id, providerKey, actionType, display, reason)
|
|
|
98
98
|
id,
|
|
99
99
|
actionType,
|
|
100
100
|
display,
|
|
101
|
-
|
|
101
|
+
extensionKey,
|
|
102
102
|
duration: measure.duration,
|
|
103
103
|
reason
|
|
104
104
|
}
|
|
@@ -179,13 +179,13 @@ export const uiCardClickedEvent = (display, definitionId, extensionKey) => ({
|
|
|
179
179
|
display
|
|
180
180
|
}
|
|
181
181
|
});
|
|
182
|
-
export const uiActionClickedEvent = (
|
|
182
|
+
export const uiActionClickedEvent = (extensionKey, actionType, display) => ({
|
|
183
183
|
action: 'clicked',
|
|
184
184
|
actionSubject: 'smartLinkAction',
|
|
185
185
|
eventType: 'ui',
|
|
186
186
|
attributes: { ...context,
|
|
187
187
|
display,
|
|
188
|
-
|
|
188
|
+
extensionKey,
|
|
189
189
|
actionType: actionType
|
|
190
190
|
}
|
|
191
191
|
});
|
package/dist/es2019/version.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { CardLinkView, BlockCardResolvingView, BlockCardErroredView, BlockCardUnauthorisedView, BlockCardForbiddenView, BlockCardResolvedView, BlockCardNotFoundView, AuthorizeAction, ForbiddenAction } from '@atlaskit/media-ui';
|
|
4
|
-
import {
|
|
4
|
+
import { getExtensionKey } from '../../state/helpers';
|
|
5
5
|
import { extractBlockProps } from '../../extractors/block';
|
|
6
6
|
import { getEmptyJsonLd, getUnauthorizedJsonLd } from '../../utils/jsonld';
|
|
7
7
|
import { extractRequestAccessContext } from '../../extractors/common/context';
|
|
@@ -31,7 +31,7 @@ export const BlockCard = ({
|
|
|
31
31
|
const extractorOpts = {
|
|
32
32
|
handleAnalytics: handlePreviewAnalytics,
|
|
33
33
|
handleInvoke,
|
|
34
|
-
|
|
34
|
+
extensionKey: getExtensionKey(details)
|
|
35
35
|
};
|
|
36
36
|
|
|
37
37
|
switch (status) {
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import { isIntersectionObserverSupported } from '@atlaskit/media-ui';
|
|
3
3
|
import { LazyLazilyRenderCard } from './LazyLazilyRenderCard';
|
|
4
4
|
import { LazyIntersectionObserverCard } from './LazyIntersectionObserverCard';
|
|
5
|
-
export function LazyCardWithUrlContent(props) {
|
|
5
|
+
export default function LazyCardWithUrlContent(props) {
|
|
6
6
|
if (isIntersectionObserverSupported()) {
|
|
7
7
|
return /*#__PURE__*/React.createElement(LazyIntersectionObserverCard, props);
|
|
8
8
|
} else {
|
|
@@ -28,7 +28,8 @@ export function CardWithUrlContent({
|
|
|
28
28
|
actions,
|
|
29
29
|
config,
|
|
30
30
|
analytics,
|
|
31
|
-
renderers
|
|
31
|
+
renderers,
|
|
32
|
+
error
|
|
32
33
|
} = useSmartLink(id, url, dispatchAnalytics);
|
|
33
34
|
const definitionId = getDefinitionId(state.details);
|
|
34
35
|
const extensionKey = getExtensionKey(state.details);
|
|
@@ -67,9 +68,13 @@ export function CardWithUrlContent({
|
|
|
67
68
|
|
|
68
69
|
useEffect(() => {
|
|
69
70
|
if (isFinalState(state.status)) {
|
|
70
|
-
analytics.ui.renderSuccessEvent(appearance, definitionId, extensionKey);
|
|
71
|
+
analytics.ui.renderSuccessEvent(appearance, id, definitionId, extensionKey);
|
|
71
72
|
}
|
|
72
|
-
}, [appearance, state.details, state.status, url, definitionId, extensionKey, analytics.ui]);
|
|
73
|
+
}, [appearance, state.details, state.status, url, definitionId, extensionKey, analytics.ui, id]); // We have to keep this last to prevent hook order from being violated
|
|
74
|
+
|
|
75
|
+
if (error) {
|
|
76
|
+
throw error;
|
|
77
|
+
}
|
|
73
78
|
|
|
74
79
|
switch (appearance) {
|
|
75
80
|
case 'inline':
|
|
@@ -1,60 +1,59 @@
|
|
|
1
|
-
import
|
|
2
|
-
import React from 'react';
|
|
1
|
+
import React, { lazy, useEffect, useState, Suspense, useCallback } from 'react';
|
|
3
2
|
import uuid from 'uuid';
|
|
4
3
|
import { CardLinkView } from '@atlaskit/media-ui';
|
|
5
4
|
import { uiRenderFailedEvent, fireSmartLinkEvent } from '../../utils/analytics';
|
|
6
5
|
import { clearMarks, clearMeasures } from '../../utils/performance';
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
6
|
+
import { ErrorBoundary } from 'react-error-boundary';
|
|
7
|
+
import { failUfoExperience, startUfoExperience } from '../../state/analytics/ufoExperiences';
|
|
8
|
+
const LazyCardWithUrlContent = /*#__PURE__*/lazy(() => import(
|
|
9
|
+
/* webpackChunkName: "@atlaskit-internal_smartcard-urlcardcontent" */
|
|
10
|
+
'./component-lazy/index'));
|
|
11
|
+
export function CardWithURLRenderer(props) {
|
|
12
|
+
const [id] = useState(() => uuid()); // Equivalent to ComponentWillMount
|
|
10
13
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
if (!analyticsPayload.attributes.display) {
|
|
21
|
-
analyticsPayload.attributes.display = appearance;
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
fireSmartLinkEvent(analyticsPayload, createAnalyticsEvent);
|
|
26
|
-
});
|
|
27
|
-
|
|
28
|
-
this.state = {
|
|
29
|
-
id: uuid()
|
|
14
|
+
useState(() => {
|
|
15
|
+
// We want to start timing of render event only once and right at the start
|
|
16
|
+
startUfoExperience('smart-link-rendered', id);
|
|
17
|
+
});
|
|
18
|
+
useEffect(() => {
|
|
19
|
+
// ComponentWillUnmount
|
|
20
|
+
return () => {
|
|
21
|
+
clearMarks(id);
|
|
22
|
+
clearMeasures(id);
|
|
30
23
|
};
|
|
31
|
-
}
|
|
24
|
+
}, [id]);
|
|
25
|
+
const {
|
|
26
|
+
url,
|
|
27
|
+
appearance,
|
|
28
|
+
isSelected,
|
|
29
|
+
isFrameVisible,
|
|
30
|
+
onClick,
|
|
31
|
+
container,
|
|
32
|
+
onResolve,
|
|
33
|
+
testId,
|
|
34
|
+
showActions,
|
|
35
|
+
inheritDimensions,
|
|
36
|
+
platform,
|
|
37
|
+
embedIframeRef,
|
|
38
|
+
inlinePreloaderStyle,
|
|
39
|
+
createAnalyticsEvent
|
|
40
|
+
} = props; // Wrapper around analytics.
|
|
32
41
|
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
componentDidMount() {
|
|
43
|
-
if (CardWithURLRenderer.CardContent === null) {
|
|
44
|
-
(this.props.importer || CardWithURLRenderer.moduleImporter)(this);
|
|
42
|
+
const dispatchAnalytics = useCallback(analyticsPayload => {
|
|
43
|
+
if (analyticsPayload && analyticsPayload.attributes) {
|
|
44
|
+
// Update if we haven't already set the display - possible
|
|
45
|
+
// in the case of `preview` which is rendered differently.
|
|
46
|
+
if (!analyticsPayload.attributes.display) {
|
|
47
|
+
analyticsPayload.attributes.display = appearance;
|
|
48
|
+
}
|
|
45
49
|
}
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
componentWillUnmount() {
|
|
49
|
-
const id = this.state.id;
|
|
50
|
-
clearMarks(id);
|
|
51
|
-
clearMeasures(id);
|
|
52
|
-
}
|
|
53
50
|
|
|
54
|
-
|
|
51
|
+
fireSmartLinkEvent(analyticsPayload, createAnalyticsEvent);
|
|
52
|
+
}, [appearance, createAnalyticsEvent]);
|
|
53
|
+
const logError = useCallback((error, info) => {
|
|
55
54
|
const {
|
|
56
|
-
|
|
57
|
-
} =
|
|
55
|
+
componentStack
|
|
56
|
+
} = info; // NB: APIErrors are thrown in response to Object Resolver Service.
|
|
58
57
|
// In these cases, control is handed back to the Editor. We do not
|
|
59
58
|
// fire an event for these, as they do not cover failed UI render events.
|
|
60
59
|
|
|
@@ -64,54 +63,46 @@ export class CardWithURLRenderer extends React.PureComponent {
|
|
|
64
63
|
// to the reliability of the smart-card front-end components. We instrument
|
|
65
64
|
// these in order to measure our front-end reliability.
|
|
66
65
|
else {
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
const {
|
|
74
|
-
url,
|
|
75
|
-
appearance,
|
|
76
|
-
isSelected,
|
|
77
|
-
isFrameVisible,
|
|
78
|
-
onClick,
|
|
79
|
-
container,
|
|
80
|
-
onResolve,
|
|
81
|
-
testId,
|
|
82
|
-
showActions,
|
|
83
|
-
inheritDimensions,
|
|
84
|
-
platform,
|
|
85
|
-
embedIframeRef,
|
|
86
|
-
inlinePreloaderStyle
|
|
87
|
-
} = this.props;
|
|
88
|
-
|
|
89
|
-
if (!url) {
|
|
90
|
-
throw new Error('@atlaskit/smart-card: url property is missing.');
|
|
66
|
+
const errorInfo = {
|
|
67
|
+
componentStack
|
|
68
|
+
};
|
|
69
|
+
failUfoExperience('smart-link-rendered', id);
|
|
70
|
+
failUfoExperience('smart-link-authenticated', id);
|
|
71
|
+
dispatchAnalytics(uiRenderFailedEvent(appearance, error, errorInfo));
|
|
91
72
|
}
|
|
73
|
+
}, [appearance, dispatchAnalytics, id]);
|
|
92
74
|
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
url: url,
|
|
96
|
-
appearance: appearance,
|
|
97
|
-
onClick: onClick,
|
|
98
|
-
isSelected: isSelected,
|
|
99
|
-
isFrameVisible: isFrameVisible,
|
|
100
|
-
dispatchAnalytics: this.dispatchAnalytics,
|
|
101
|
-
container: container,
|
|
102
|
-
onResolve: onResolve,
|
|
103
|
-
testId: testId,
|
|
104
|
-
showActions: showActions,
|
|
105
|
-
inheritDimensions: inheritDimensions,
|
|
106
|
-
platform: platform,
|
|
107
|
-
embedIframeRef: embedIframeRef,
|
|
108
|
-
inlinePreloaderStyle: inlinePreloaderStyle
|
|
109
|
-
}) : /*#__PURE__*/React.createElement(CardLinkView, {
|
|
110
|
-
key: 'chunk-placeholder',
|
|
111
|
-
link: url
|
|
112
|
-
});
|
|
75
|
+
if (!url) {
|
|
76
|
+
throw new Error('@atlaskit/smart-card: url property is missing.');
|
|
113
77
|
}
|
|
114
78
|
|
|
79
|
+
return /*#__PURE__*/React.createElement(ErrorBoundary, {
|
|
80
|
+
FallbackComponent: ErrorFallback,
|
|
81
|
+
onError: logError
|
|
82
|
+
}, /*#__PURE__*/React.createElement(Suspense, {
|
|
83
|
+
fallback: /*#__PURE__*/React.createElement(CardLinkView, {
|
|
84
|
+
key: 'chunk-placeholder',
|
|
85
|
+
link: url
|
|
86
|
+
})
|
|
87
|
+
}, /*#__PURE__*/React.createElement(LazyCardWithUrlContent, {
|
|
88
|
+
id: id,
|
|
89
|
+
url: url,
|
|
90
|
+
appearance: appearance,
|
|
91
|
+
onClick: onClick,
|
|
92
|
+
isSelected: isSelected,
|
|
93
|
+
isFrameVisible: isFrameVisible,
|
|
94
|
+
dispatchAnalytics: dispatchAnalytics,
|
|
95
|
+
container: container,
|
|
96
|
+
onResolve: onResolve,
|
|
97
|
+
testId: testId,
|
|
98
|
+
showActions: showActions,
|
|
99
|
+
inheritDimensions: inheritDimensions,
|
|
100
|
+
platform: platform,
|
|
101
|
+
embedIframeRef: embedIframeRef,
|
|
102
|
+
inlinePreloaderStyle: inlinePreloaderStyle
|
|
103
|
+
})));
|
|
115
104
|
}
|
|
116
105
|
|
|
117
|
-
|
|
106
|
+
const ErrorFallback = () => {
|
|
107
|
+
return /*#__PURE__*/React.createElement("span", null);
|
|
108
|
+
};
|
|
@@ -6,7 +6,7 @@ import { extractEmbedProps } from '../../extractors/embed';
|
|
|
6
6
|
import { getEmptyJsonLd, getUnauthorizedJsonLd } from '../../utils/jsonld';
|
|
7
7
|
import { extractInlineProps } from '../../extractors/inline';
|
|
8
8
|
import { extractBlockProps } from '../../extractors/block';
|
|
9
|
-
import {
|
|
9
|
+
import { getExtensionKey } from '../../state/helpers';
|
|
10
10
|
import { extractRequestAccessContext } from '../../extractors/common/context';
|
|
11
11
|
export const EmbedCard = /*#__PURE__*/React.forwardRef(({
|
|
12
12
|
url,
|
|
@@ -75,7 +75,7 @@ export const EmbedCard = /*#__PURE__*/React.forwardRef(({
|
|
|
75
75
|
const resolvedBlockViewProps = extractBlockProps(data, meta, {
|
|
76
76
|
handleAnalytics,
|
|
77
77
|
handleInvoke,
|
|
78
|
-
|
|
78
|
+
extensionKey: getExtensionKey(details)
|
|
79
79
|
});
|
|
80
80
|
return /*#__PURE__*/React.createElement(BlockCardResolvedView, _extends({}, resolvedBlockViewProps, {
|
|
81
81
|
isSelected: isSelected,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
var devBaseUrl = 'https://api-private.dev.atlassian.com';
|
|
2
|
-
var stgBaseUrl = 'https://
|
|
2
|
+
var stgBaseUrl = 'https://commerce-components-preview.dev.atlassian.com/gateway/api';
|
|
3
3
|
var prodBaseUrl = 'https://api-private.atlassian.com';
|
|
4
4
|
export var BaseUrls = {
|
|
5
5
|
dev: devBaseUrl,
|
|
@@ -44,10 +44,10 @@ export var extractBlockActions = function extractBlockActions(props, jsonLd, opt
|
|
|
44
44
|
if (opts) {
|
|
45
45
|
var handleInvoke = opts.handleInvoke,
|
|
46
46
|
handleAnalytics = opts.handleAnalytics,
|
|
47
|
-
|
|
47
|
+
extensionKey = opts.extensionKey,
|
|
48
48
|
testId = opts.testId;
|
|
49
49
|
var actions = extractActions(jsonLd, handleInvoke);
|
|
50
|
-
var previewAction = extractPreviewAction(
|
|
50
|
+
var previewAction = extractPreviewAction(extensionKey, props, jsonLd, handleInvoke, handleAnalytics, testId, platform); // The previewAction should always be the last action
|
|
51
51
|
|
|
52
52
|
if (previewAction) {
|
|
53
53
|
actions.push(previewAction);
|
|
@@ -53,7 +53,7 @@ var getInvokeOpts = function getInvokeOpts(key, action, source) {
|
|
|
53
53
|
};
|
|
54
54
|
|
|
55
55
|
export var extractPreviewAction = function extractPreviewAction() {
|
|
56
|
-
var
|
|
56
|
+
var extensionKey = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'empty-object-provider';
|
|
57
57
|
var viewProps = arguments.length > 1 ? arguments[1] : undefined;
|
|
58
58
|
var jsonLd = arguments.length > 2 ? arguments[2] : undefined;
|
|
59
59
|
var handleInvoke = arguments.length > 3 ? arguments[3] : undefined;
|
|
@@ -69,7 +69,7 @@ export var extractPreviewAction = function extractPreviewAction() {
|
|
|
69
69
|
|
|
70
70
|
if (metadataFromJsonLd.src) {
|
|
71
71
|
// Build action using instrumentation hooks.
|
|
72
|
-
var key =
|
|
72
|
+
var key = extensionKey;
|
|
73
73
|
var previewAction = PreviewAction(_objectSpread(_objectSpread({}, metadata), {}, {
|
|
74
74
|
testId: testId,
|
|
75
75
|
onOpen: function onOpen() {
|
package/dist/esm/index.js
CHANGED
|
@@ -9,5 +9,5 @@ export { embedHeaderHeight } from '@atlaskit/media-ui/embeds';
|
|
|
9
9
|
export { SmartLinkEvents } from './utils/analytics/analytics';
|
|
10
10
|
export { useSmartLinkEvents } from './view/SmartLinkEvents/useSmartLinkEvents'; // Classnames for integrators
|
|
11
11
|
|
|
12
|
-
export { contentFooterClassName, metadataListClassName, blockCardResolvingViewClassName, blockCardResolvedViewClassName, blockCardForbiddenViewClassName, blockCardIconImageClassName } from '@atlaskit/media-ui/classNames';
|
|
12
|
+
export { contentFooterClassName, metadataListClassName, blockCardResolvingViewClassName, blockCardResolvedViewClassName, blockCardForbiddenViewClassName, blockCardIconImageClassName, blockCardResolvedViewByClassName, blockCardForbiddenViewLinkClassName, blockCardContentClassName, blockCardContentHeaderClassName, blockCardContentHeaderNameClassName, blockCardNotFoundViewClassName, blockCardErroredViewClassName } from '@atlaskit/media-ui/classNames';
|
|
13
13
|
export { loadingPlaceholderClassName } from './view/CardWithUrl/component-lazy/LazyFallback';
|
|
@@ -6,7 +6,11 @@ var isJiraRoadMap = function isJiraRoadMap(url) {
|
|
|
6
6
|
};
|
|
7
7
|
|
|
8
8
|
var isPolarisView = function isPolarisView(url) {
|
|
9
|
-
return url.match(/^https:\/\/.*?\/jira\/polaris\/projects\/[^\/]+?\/ideas\/view\/\d
|
|
9
|
+
return url.match(/^https:\/\/.*?\/jira\/polaris\/projects\/[^\/]+?\/ideas\/view\/\d+$|^https:\/\/.*?\/secure\/JiraProductDiscoveryAnonymous\.jspa\?hash=\w+|^https:\/\/.*?\/jira\/polaris\/share\/\w+/);
|
|
10
|
+
};
|
|
11
|
+
|
|
12
|
+
var isJwmView = function isJwmView(url) {
|
|
13
|
+
return url.match(/^https:\/\/.*?\/jira\/core\/projects\/[^\/]+?\/(timeline|calendar)\/?/);
|
|
10
14
|
};
|
|
11
15
|
|
|
12
16
|
var isSlackMessage = function isSlackMessage(url) {
|
|
@@ -52,7 +56,7 @@ export var Transformer = /*#__PURE__*/function () {
|
|
|
52
56
|
}, {
|
|
53
57
|
key: "toAdf",
|
|
54
58
|
value: function toAdf(url, appearance) {
|
|
55
|
-
if (isJiraRoadMap(url) || isPolarisView(url)) {
|
|
59
|
+
if (isJiraRoadMap(url) || isPolarisView(url) || isJwmView(url)) {
|
|
56
60
|
return this.buildEmbedAdf(url);
|
|
57
61
|
} else if (isSlackMessage(url)) {
|
|
58
62
|
return this.buildBlockAdf(url);
|
|
@@ -9,6 +9,7 @@ import { useSmartLinkContext } from '../context';
|
|
|
9
9
|
import * as measure from '../../utils/performance';
|
|
10
10
|
import { APIError } from '../../client/errors';
|
|
11
11
|
import { getUnauthorizedJsonLd } from '../../utils/jsonld';
|
|
12
|
+
import { addMetadataToExperience } from '../analytics';
|
|
12
13
|
export var useSmartCardActions = function useSmartCardActions(id, url, analytics) {
|
|
13
14
|
var _useSmartLinkContext = useSmartLinkContext(),
|
|
14
15
|
store = _useSmartLinkContext.store,
|
|
@@ -98,7 +99,7 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
|
|
|
98
99
|
isReloading = _args.length > 1 && _args[1] !== undefined ? _args[1] : false;
|
|
99
100
|
|
|
100
101
|
if (!(isReloading || !hasData)) {
|
|
101
|
-
_context.next =
|
|
102
|
+
_context.next = 6;
|
|
102
103
|
break;
|
|
103
104
|
}
|
|
104
105
|
|
|
@@ -108,13 +109,18 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
|
|
|
108
109
|
return handleResolvedLinkError(resourceUrl, error);
|
|
109
110
|
}));
|
|
110
111
|
|
|
111
|
-
case
|
|
112
|
+
case 6:
|
|
113
|
+
addMetadataToExperience('smart-link-rendered', id, {
|
|
114
|
+
cached: true
|
|
115
|
+
});
|
|
116
|
+
|
|
117
|
+
case 7:
|
|
112
118
|
case "end":
|
|
113
119
|
return _context.stop();
|
|
114
120
|
}
|
|
115
121
|
}
|
|
116
122
|
}, _callee);
|
|
117
|
-
})), [url, hasData, connections.client, handleResolvedLinkResponse, handleResolvedLinkError]);
|
|
123
|
+
})), [url, hasData, connections.client, handleResolvedLinkResponse, handleResolvedLinkError, id]);
|
|
118
124
|
var register = useCallback(function () {
|
|
119
125
|
if (!details) {
|
|
120
126
|
dispatch(cardAction(ACTION_PENDING, {
|
|
@@ -152,10 +158,10 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
|
|
|
152
158
|
analytics.screen.authPopupEvent(definitionId, extensionKey);
|
|
153
159
|
auth(services[0].url).then(function () {
|
|
154
160
|
analytics.track.appAccountConnected(definitionId, extensionKey);
|
|
155
|
-
analytics.operational.connectSucceededEvent(definitionId, extensionKey);
|
|
161
|
+
analytics.operational.connectSucceededEvent(id, definitionId, extensionKey);
|
|
156
162
|
reload();
|
|
157
163
|
}, function (err) {
|
|
158
|
-
analytics.operational.connectFailedEvent(definitionId, extensionKey, err.type);
|
|
164
|
+
analytics.operational.connectFailedEvent(id, definitionId, extensionKey, err.type);
|
|
159
165
|
|
|
160
166
|
if (err.type === 'auth_window_closed') {
|
|
161
167
|
analytics.ui.closedAuthEvent(appearance, definitionId, extensionKey);
|
|
@@ -164,7 +170,7 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
|
|
|
164
170
|
reload();
|
|
165
171
|
});
|
|
166
172
|
}
|
|
167
|
-
}, [analytics.ui, analytics.screen, analytics.track, analytics.operational, reload, details, status]);
|
|
173
|
+
}, [analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload, details, status]);
|
|
168
174
|
var invoke = useCallback( /*#__PURE__*/function () {
|
|
169
175
|
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(opts, appearance) {
|
|
170
176
|
var key, action, source, markName, response;
|
|
@@ -179,7 +185,7 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
|
|
|
179
185
|
measure.mark(markName, 'pending');
|
|
180
186
|
_context2.prev = 4;
|
|
181
187
|
// Begin analytics instrumentation.
|
|
182
|
-
analytics.ui.actionClickedEvent(key, action.type, source); // Invoke action - either client-side or server-side.
|
|
188
|
+
analytics.ui.actionClickedEvent(id, key, action.type, source, opts.type); // Invoke action - either client-side or server-side.
|
|
183
189
|
|
|
184
190
|
if (!(opts.type === 'client')) {
|
|
185
191
|
_context2.next = 12;
|
|
@@ -1,80 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
export var useSmartLinkAnalytics = function useSmartLinkAnalytics(dispatchAnalytics) {
|
|
4
|
-
var ui = useMemo(function () {
|
|
5
|
-
return {
|
|
6
|
-
authEvent: function authEvent(display, definitionId, extensionKey) {
|
|
7
|
-
return dispatchAnalytics(uiAuthEvent(display, definitionId, extensionKey));
|
|
8
|
-
},
|
|
9
|
-
authAlternateAccountEvent: function authAlternateAccountEvent(display, definitionId, extensionKey) {
|
|
10
|
-
return dispatchAnalytics(uiAuthAlternateAccountEvent(display, definitionId, extensionKey));
|
|
11
|
-
},
|
|
12
|
-
cardClickedEvent: function cardClickedEvent(display, definitionId, extensionKey) {
|
|
13
|
-
return dispatchAnalytics(uiCardClickedEvent(display, definitionId, extensionKey));
|
|
14
|
-
},
|
|
15
|
-
actionClickedEvent: function actionClickedEvent(providerKey, actionType, display) {
|
|
16
|
-
return dispatchAnalytics(uiActionClickedEvent(providerKey, actionType, display));
|
|
17
|
-
},
|
|
18
|
-
closedAuthEvent: function closedAuthEvent(display, definitionId, extensionKey) {
|
|
19
|
-
return dispatchAnalytics(uiClosedAuthEvent(display, definitionId, extensionKey));
|
|
20
|
-
},
|
|
21
|
-
renderSuccessEvent: function renderSuccessEvent(display, definitionId, extensionKey) {
|
|
22
|
-
return dispatchAnalytics(uiRenderSuccessEvent(display, definitionId, extensionKey));
|
|
23
|
-
},
|
|
24
|
-
renderFailedEvent: function renderFailedEvent(display, error, errorInfo) {
|
|
25
|
-
return dispatchAnalytics(uiRenderFailedEvent(display, error, errorInfo));
|
|
26
|
-
}
|
|
27
|
-
};
|
|
28
|
-
}, [dispatchAnalytics]);
|
|
29
|
-
var operational = useMemo(function () {
|
|
30
|
-
return {
|
|
31
|
-
resolvedEvent: function resolvedEvent(id, definitionId, extensionKey, resourceType) {
|
|
32
|
-
return dispatchAnalytics(_resolvedEvent(id, definitionId, extensionKey, resourceType));
|
|
33
|
-
},
|
|
34
|
-
unresolvedEvent: function unresolvedEvent(id, status, definitionId, extensionKey, resourceType) {
|
|
35
|
-
return dispatchAnalytics(_unresolvedEvent(id, status, definitionId, extensionKey, resourceType));
|
|
36
|
-
},
|
|
37
|
-
invokeSucceededEvent: function invokeSucceededEvent(id, providerKey, actionType, display) {
|
|
38
|
-
return dispatchAnalytics(_invokeSucceededEvent(id, providerKey, actionType, display));
|
|
39
|
-
},
|
|
40
|
-
invokeFailedEvent: function invokeFailedEvent(id, providerKey, actionType, display, reason) {
|
|
41
|
-
return dispatchAnalytics(_invokeFailedEvent(id, providerKey, actionType, display, reason));
|
|
42
|
-
},
|
|
43
|
-
connectSucceededEvent: function connectSucceededEvent(definitionId, extensionKey) {
|
|
44
|
-
return dispatchAnalytics(_connectSucceededEvent(definitionId, extensionKey));
|
|
45
|
-
},
|
|
46
|
-
connectFailedEvent: function connectFailedEvent(definitionId, extensionKey, reason) {
|
|
47
|
-
return dispatchAnalytics(_connectFailedEvent(definitionId, extensionKey, reason));
|
|
48
|
-
},
|
|
49
|
-
instrument: function instrument(id, status, definitionId, extensionKey, resourceType, error) {
|
|
50
|
-
var event = instrumentEvent(id, status, definitionId, extensionKey, resourceType, error);
|
|
51
|
-
|
|
52
|
-
if (event) {
|
|
53
|
-
dispatchAnalytics(event);
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
};
|
|
57
|
-
}, [dispatchAnalytics]);
|
|
58
|
-
var track = useMemo(function () {
|
|
59
|
-
return {
|
|
60
|
-
appAccountConnected: function appAccountConnected(definitionId, extensionKey) {
|
|
61
|
-
return dispatchAnalytics(trackAppAccountConnected(definitionId, extensionKey));
|
|
62
|
-
}
|
|
63
|
-
};
|
|
64
|
-
}, [dispatchAnalytics]);
|
|
65
|
-
var screen = useMemo(function () {
|
|
66
|
-
return {
|
|
67
|
-
authPopupEvent: function authPopupEvent(definitionId, extensionKey) {
|
|
68
|
-
return dispatchAnalytics(screenAuthPopupEvent(definitionId, extensionKey));
|
|
69
|
-
}
|
|
70
|
-
};
|
|
71
|
-
}, [dispatchAnalytics]);
|
|
72
|
-
return useMemo(function () {
|
|
73
|
-
return {
|
|
74
|
-
ui: ui,
|
|
75
|
-
operational: operational,
|
|
76
|
-
track: track,
|
|
77
|
-
screen: screen
|
|
78
|
-
};
|
|
79
|
-
}, [ui, operational, track, screen]);
|
|
80
|
-
};
|
|
1
|
+
export { startUfoExperience, succeedUfoExperience, failUfoExperience, addMetadataToExperience } from './ufoExperiences';
|
|
2
|
+
export { useSmartLinkAnalytics } from './useSmartLinkAnalytics';
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { ConcurrentExperience, ExperiencePerformanceTypes, ExperienceTypes } from '@atlaskit/ufo';
|
|
2
|
+
var inlineExperience = {
|
|
3
|
+
platform: {
|
|
4
|
+
component: 'smart-links'
|
|
5
|
+
},
|
|
6
|
+
type: ExperienceTypes.Experience,
|
|
7
|
+
performanceType: ExperiencePerformanceTypes.InlineResult
|
|
8
|
+
};
|
|
9
|
+
var renderExperience = {
|
|
10
|
+
platform: {
|
|
11
|
+
component: 'smart-links'
|
|
12
|
+
},
|
|
13
|
+
type: ExperienceTypes.Load,
|
|
14
|
+
performanceType: ExperiencePerformanceTypes.PageSegmentLoad
|
|
15
|
+
};
|
|
16
|
+
var ufoExperiences = {
|
|
17
|
+
'smart-link-rendered': new ConcurrentExperience('smart-link-rendered', renderExperience),
|
|
18
|
+
'smart-link-authenticated': new ConcurrentExperience('smart-link-authenticated', inlineExperience),
|
|
19
|
+
'smart-link-action-invocation': new ConcurrentExperience('smart-link-action-invocation', inlineExperience)
|
|
20
|
+
};
|
|
21
|
+
export var startUfoExperience = function startUfoExperience(experienceName, id, properties) {
|
|
22
|
+
var experience = ufoExperiences[experienceName].getInstance(id);
|
|
23
|
+
experience.start();
|
|
24
|
+
|
|
25
|
+
if (properties) {
|
|
26
|
+
experience.addMetadata(properties);
|
|
27
|
+
}
|
|
28
|
+
};
|
|
29
|
+
export var succeedUfoExperience = function succeedUfoExperience(experienceName, id, properties) {
|
|
30
|
+
var experience = ufoExperiences[experienceName].getInstance(id);
|
|
31
|
+
experience.success({
|
|
32
|
+
metadata: properties
|
|
33
|
+
});
|
|
34
|
+
};
|
|
35
|
+
export var failUfoExperience = function failUfoExperience(experienceName, id, properties) {
|
|
36
|
+
var experience = ufoExperiences[experienceName].getInstance(id);
|
|
37
|
+
experience.failure({
|
|
38
|
+
metadata: properties
|
|
39
|
+
});
|
|
40
|
+
};
|
|
41
|
+
export var addMetadataToExperience = function addMetadataToExperience(experienceName, id, properties) {
|
|
42
|
+
ufoExperiences[experienceName].getInstance(id).addMetadata(properties);
|
|
43
|
+
};
|