@atlaskit/smart-card 45.6.6 → 45.6.7
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 +9 -0
- package/dist/cjs/extractors/flexible/actions/index.js +3 -3
- package/dist/cjs/extractors/flexible/index.js +3 -5
- package/dist/cjs/utils/analytics/analytics.js +1 -1
- package/dist/cjs/view/EmbedModal/components/link-info/index.js +1 -2
- package/dist/cjs/view/FlexibleCard/components/actions/ai-summary-action/ai-summarise-action.js +3 -8
- package/dist/cjs/view/FlexibleCard/components/actions/automation-action/index.js +3 -8
- package/dist/cjs/view/FlexibleCard/components/actions/copy-link-action/index.js +3 -8
- package/dist/cjs/view/FlexibleCard/components/actions/preview-action/index.js +7 -13
- package/dist/cjs/view/FlexibleCard/components/blocks/action-group/index.js +12 -7
- package/dist/cjs/view/FlexibleCard/components/blocks/footer-block/resolved/index.js +11 -6
- package/dist/cjs/view/FlexibleCard/index.js +5 -12
- package/dist/cjs/view/LinkUrl/index.js +1 -1
- package/dist/es2019/extractors/flexible/actions/index.js +8 -10
- package/dist/es2019/extractors/flexible/index.js +2 -4
- package/dist/es2019/utils/analytics/analytics.js +1 -1
- package/dist/es2019/view/EmbedModal/components/link-info/index.js +1 -2
- package/dist/es2019/view/FlexibleCard/components/actions/ai-summary-action/ai-summarise-action.js +3 -9
- package/dist/es2019/view/FlexibleCard/components/actions/automation-action/index.js +3 -9
- package/dist/es2019/view/FlexibleCard/components/actions/copy-link-action/index.js +3 -9
- package/dist/es2019/view/FlexibleCard/components/actions/preview-action/index.js +7 -14
- package/dist/es2019/view/FlexibleCard/components/blocks/action-group/index.js +10 -7
- package/dist/es2019/view/FlexibleCard/components/blocks/footer-block/resolved/index.js +9 -6
- package/dist/es2019/view/FlexibleCard/index.js +3 -7
- package/dist/es2019/view/LinkUrl/index.js +1 -1
- package/dist/esm/extractors/flexible/actions/index.js +3 -3
- package/dist/esm/extractors/flexible/index.js +3 -5
- package/dist/esm/utils/analytics/analytics.js +1 -1
- package/dist/esm/view/EmbedModal/components/link-info/index.js +1 -2
- package/dist/esm/view/FlexibleCard/components/actions/ai-summary-action/ai-summarise-action.js +3 -8
- package/dist/esm/view/FlexibleCard/components/actions/automation-action/index.js +3 -8
- package/dist/esm/view/FlexibleCard/components/actions/copy-link-action/index.js +3 -8
- package/dist/esm/view/FlexibleCard/components/actions/preview-action/index.js +7 -13
- package/dist/esm/view/FlexibleCard/components/blocks/action-group/index.js +12 -7
- package/dist/esm/view/FlexibleCard/components/blocks/footer-block/resolved/index.js +11 -6
- package/dist/esm/view/FlexibleCard/index.js +5 -12
- package/dist/esm/view/LinkUrl/index.js +1 -1
- package/package.json +1 -4
|
@@ -2,12 +2,10 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
2
2
|
import React, { useCallback, useState } from 'react';
|
|
3
3
|
import { FormattedMessage, useIntl } from 'react-intl';
|
|
4
4
|
import LinkIcon from '@atlaskit/icon/core/link';
|
|
5
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
6
5
|
import { ActionName } from '../../../../../constants';
|
|
7
6
|
import { messages } from '../../../../../messages';
|
|
8
7
|
import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
|
|
9
8
|
import useInvokeClientAction from '../../../../../state/hooks/use-invoke-client-action';
|
|
10
|
-
import useRovoConfig from '../../../../../state/hooks/use-rovo-config';
|
|
11
9
|
import Action from '../action';
|
|
12
10
|
const CopyLinkAction = ({
|
|
13
11
|
onClick: onClickCallback,
|
|
@@ -19,9 +17,6 @@ const CopyLinkAction = ({
|
|
|
19
17
|
const invoke = useInvokeClientAction({});
|
|
20
18
|
const data = context === null || context === void 0 ? void 0 : (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[ActionName.CopyLinkAction];
|
|
21
19
|
const [tooltipMessage, setTooltipMessage] = useState(messages.copy_url_to_clipboard);
|
|
22
|
-
const {
|
|
23
|
-
product
|
|
24
|
-
} = useRovoConfig();
|
|
25
20
|
const onClick = useCallback(() => {
|
|
26
21
|
if (data !== null && data !== void 0 && data.invokeAction) {
|
|
27
22
|
invoke({
|
|
@@ -38,13 +33,12 @@ const CopyLinkAction = ({
|
|
|
38
33
|
return data ? /*#__PURE__*/React.createElement(Action, _extends({
|
|
39
34
|
ariaLabel: intl.formatMessage(messages.copy_url_to_clipboard),
|
|
40
35
|
content: /*#__PURE__*/React.createElement(FormattedMessage, messages.copy_url_to_clipboard),
|
|
41
|
-
icon: /*#__PURE__*/React.createElement(LinkIcon,
|
|
36
|
+
icon: /*#__PURE__*/React.createElement(LinkIcon, {
|
|
42
37
|
color: "currentColor",
|
|
43
38
|
label: "",
|
|
44
|
-
spacing: "spacious"
|
|
45
|
-
}, fg('platform_sl_3p_auth_rovo_action_kill_switch') || !!product && product === 'CONFLUENCE' ? {
|
|
39
|
+
spacing: "spacious",
|
|
46
40
|
size: props.iconSize
|
|
47
|
-
}
|
|
41
|
+
}),
|
|
48
42
|
onClick: onClick,
|
|
49
43
|
testId: "smart-action-copy-link-action",
|
|
50
44
|
tooltipMessage: /*#__PURE__*/React.createElement(FormattedMessage, tooltipMessage),
|
|
@@ -3,13 +3,11 @@ import React, { useCallback, useMemo } from 'react';
|
|
|
3
3
|
import { FormattedMessage, useIntl } from 'react-intl';
|
|
4
4
|
import MediaServicesActualSizeIcon from '@atlaskit/icon/core/grow-diagonal';
|
|
5
5
|
import PanelRightIcon from '@atlaskit/icon/core/panel-right';
|
|
6
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
7
6
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
8
7
|
import { ActionName } from '../../../../../constants';
|
|
9
8
|
import { messages } from '../../../../../messages';
|
|
10
9
|
import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
|
|
11
10
|
import useInvokeClientAction from '../../../../../state/hooks/use-invoke-client-action';
|
|
12
|
-
import useRovoConfig from '../../../../../state/hooks/use-rovo-config';
|
|
13
11
|
import Action from '../action';
|
|
14
12
|
const PreviewAction = ({
|
|
15
13
|
onClick: onClickCallback,
|
|
@@ -21,9 +19,6 @@ const PreviewAction = ({
|
|
|
21
19
|
const invoke = useInvokeClientAction({});
|
|
22
20
|
const data = context === null || context === void 0 ? void 0 : (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[ActionName.PreviewAction];
|
|
23
21
|
const hasPreviewPanel = data === null || data === void 0 ? void 0 : data.hasPreviewPanel;
|
|
24
|
-
const {
|
|
25
|
-
product
|
|
26
|
-
} = useRovoConfig();
|
|
27
22
|
const onClick = useCallback(() => {
|
|
28
23
|
if (data !== null && data !== void 0 && data.invokeAction) {
|
|
29
24
|
invoke(data.invokeAction);
|
|
@@ -35,22 +30,20 @@ const PreviewAction = ({
|
|
|
35
30
|
const actionIcon = useCallback(() => {
|
|
36
31
|
// Only use panel icon if experiment is enabled and hasPreviewPanel is true
|
|
37
32
|
if (expValEquals('platform_hover_card_preview_panel', 'cohort', 'test') && hasPreviewPanel) {
|
|
38
|
-
return /*#__PURE__*/React.createElement(PanelRightIcon,
|
|
33
|
+
return /*#__PURE__*/React.createElement(PanelRightIcon, {
|
|
39
34
|
color: "currentColor",
|
|
40
35
|
spacing: "spacious",
|
|
41
|
-
label: ""
|
|
42
|
-
}, fg('platform_sl_3p_auth_rovo_action_kill_switch') || !!product && product === 'CONFLUENCE' ? {
|
|
36
|
+
label: "",
|
|
43
37
|
size: props.iconSize
|
|
44
|
-
}
|
|
38
|
+
});
|
|
45
39
|
}
|
|
46
|
-
return /*#__PURE__*/React.createElement(MediaServicesActualSizeIcon,
|
|
40
|
+
return /*#__PURE__*/React.createElement(MediaServicesActualSizeIcon, {
|
|
47
41
|
color: "currentColor",
|
|
48
42
|
spacing: "spacious",
|
|
49
|
-
label: ""
|
|
50
|
-
}, fg('platform_sl_3p_auth_rovo_action_kill_switch') || !!product && product === 'CONFLUENCE' ? {
|
|
43
|
+
label: "",
|
|
51
44
|
size: props.iconSize
|
|
52
|
-
}
|
|
53
|
-
}, [hasPreviewPanel, props.iconSize
|
|
45
|
+
});
|
|
46
|
+
}, [hasPreviewPanel, props.iconSize]);
|
|
54
47
|
const actionLabel = useMemo(() => {
|
|
55
48
|
// Only use panel message if experiment is enabled and hasPreviewPanel is true
|
|
56
49
|
if (expValEquals('platform_hover_card_preview_panel', 'cohort', 'test') && hasPreviewPanel) {
|
|
@@ -60,6 +60,9 @@ const ActionGroup = ({
|
|
|
60
60
|
const renderableActionItems = useMemo(() => filterActionItems(items, context, product), [context, items, product]);
|
|
61
61
|
const isMoreThenTwoItems = renderableActionItems.length > visibleButtonsNum;
|
|
62
62
|
const rovoChatAction = context === null || context === void 0 ? void 0 : (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[ActionName.RovoChatAction];
|
|
63
|
+
const isRovoActionsEnabled = useMemo(() => {
|
|
64
|
+
return !!rovoChatAction && rovoChatAction.product === 'CONFLUENCE' && items.some(action => action.name === 'RovoChatAction');
|
|
65
|
+
}, [rovoChatAction, items]);
|
|
63
66
|
const onOpenChange = useCallback(attrs => {
|
|
64
67
|
setIsOpen(attrs.isOpen);
|
|
65
68
|
if (onDropdownOpenChange) {
|
|
@@ -74,7 +77,7 @@ const ActionGroup = ({
|
|
|
74
77
|
}
|
|
75
78
|
}, [isOpen, onOpenChange]);
|
|
76
79
|
const actionButtons = useMemo(() => {
|
|
77
|
-
if (
|
|
80
|
+
if (isRovoActionsEnabled) {
|
|
78
81
|
const rovoActions = [...(containerWidth >= REDUCED_ACTIONS_SIZE ? renderableActionItems.slice(0, visibleButtonsNum - 1) : []), ...(containerWidth >= OVERFLOW_ONLY_ACTIONS_SIZE ? [{
|
|
79
82
|
name: ActionName.RovoChatAction,
|
|
80
83
|
prompts: [RovoChatPromptKey.ASK_ROVO_ANYTHING],
|
|
@@ -94,10 +97,10 @@ const ActionGroup = ({
|
|
|
94
97
|
}
|
|
95
98
|
const actionItems = isMoreThenTwoItems ? renderableActionItems.slice(0, visibleButtonsNum - 1) : renderableActionItems;
|
|
96
99
|
return renderActionItems(actionItems, size, appearance, false, onActionItemClick);
|
|
97
|
-
}, [appearance, isMoreThenTwoItems, onActionItemClick, renderableActionItems, size, visibleButtonsNum,
|
|
100
|
+
}, [appearance, isMoreThenTwoItems, onActionItemClick, renderableActionItems, size, visibleButtonsNum, isRovoActionsEnabled, containerWidth]);
|
|
98
101
|
const moreActionDropdown = useMemo(() => {
|
|
99
102
|
let actionItems;
|
|
100
|
-
if (
|
|
103
|
+
if (isRovoActionsEnabled && containerWidth < OVERFLOW_ONLY_ACTIONS_SIZE) {
|
|
101
104
|
actionItems = [...renderableActionItems, {
|
|
102
105
|
name: ActionName.RovoChatAction,
|
|
103
106
|
prompts: [RovoChatPromptKey.ASK_ROVO_ANYTHING],
|
|
@@ -110,7 +113,7 @@ const ActionGroup = ({
|
|
|
110
113
|
name: ActionName.PreviewAction,
|
|
111
114
|
iconSize: 'small'
|
|
112
115
|
}];
|
|
113
|
-
} else if (
|
|
116
|
+
} else if (isRovoActionsEnabled && containerWidth < REDUCED_ACTIONS_SIZE) {
|
|
114
117
|
actionItems = renderableActionItems;
|
|
115
118
|
} else {
|
|
116
119
|
actionItems = isMoreThenTwoItems ? renderableActionItems.slice(visibleButtonsNum - 1) : [];
|
|
@@ -134,11 +137,11 @@ const ActionGroup = ({
|
|
|
134
137
|
testId: "action-group-more-button-tooltip",
|
|
135
138
|
tag: "span"
|
|
136
139
|
}, /*#__PURE__*/React.createElement(Button, _extends({}, props, {
|
|
137
|
-
spacing:
|
|
140
|
+
spacing: isRovoActionsEnabled ? size === SmartLinkSize.XLarge ? 'default' : 'compact' : spacing,
|
|
138
141
|
testId: "action-group-more-button",
|
|
139
142
|
iconBefore: moreIcon,
|
|
140
143
|
ref: triggerRef
|
|
141
|
-
},
|
|
144
|
+
}, isRovoActionsEnabled ? {
|
|
142
145
|
appearance
|
|
143
146
|
} : {}))),
|
|
144
147
|
testId: "action-group-dropdown",
|
|
@@ -146,7 +149,7 @@ const ActionGroup = ({
|
|
|
146
149
|
}, renderActionItems(actionItems, size, appearance, true, onActionItemClick));
|
|
147
150
|
}
|
|
148
151
|
return null;
|
|
149
|
-
}, [appearance, isMoreThenTwoItems, isOpen, onActionItemClick, onOpenChange, renderableActionItems, size, ui === null || ui === void 0 ? void 0 : ui.zIndex, visibleButtonsNum,
|
|
152
|
+
}, [appearance, isMoreThenTwoItems, isOpen, onActionItemClick, onOpenChange, renderableActionItems, size, ui === null || ui === void 0 ? void 0 : ui.zIndex, visibleButtonsNum, isRovoActionsEnabled, containerWidth]);
|
|
150
153
|
return renderableActionItems.length > 0 ? /*#__PURE__*/React.createElement("div", {
|
|
151
154
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
152
155
|
className: ax(["_1e0c116y _dzc21h6o _1ilq1i6y", "actions-button-group"]),
|
|
@@ -29,7 +29,10 @@ const FooterBlockResolvedView = props => {
|
|
|
29
29
|
} = props;
|
|
30
30
|
const context = useFlexibleUiContext();
|
|
31
31
|
const rovoChatAction = context === null || context === void 0 ? void 0 : (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[ActionName.RovoChatAction];
|
|
32
|
-
const
|
|
32
|
+
const isRovoActionsEnabled = useMemo(() => {
|
|
33
|
+
return !!rovoChatAction && rovoChatAction.product === 'CONFLUENCE' && (actions === null || actions === void 0 ? void 0 : actions.some(action => action.name === 'RovoChatAction'));
|
|
34
|
+
}, [rovoChatAction, actions]);
|
|
35
|
+
const hasPreview = isRovoActionsEnabled && !!(context !== null && context !== void 0 && context.preview) && !isPreviewBlockErrored;
|
|
33
36
|
const hasActions = useMemo(() => {
|
|
34
37
|
var _filterActionItems;
|
|
35
38
|
return ((_filterActionItems = filterActionItems(actions, context)) === null || _filterActionItems === void 0 ? void 0 : _filterActionItems.length) > 0;
|
|
@@ -55,22 +58,22 @@ const FooterBlockResolvedView = props => {
|
|
|
55
58
|
appearance: "subtle",
|
|
56
59
|
testId: `${testId}-provider`,
|
|
57
60
|
hideLabel: hasPreview,
|
|
58
|
-
className: ax([
|
|
61
|
+
className: ax([isRovoActionsEnabled && "_1wpz1h6o"])
|
|
59
62
|
}), actions && hasActions ? /*#__PURE__*/React.createElement(ElementGroup, {
|
|
60
63
|
testId: "smart-element-group-actions",
|
|
61
64
|
align: SmartLinkAlignment.Right,
|
|
62
65
|
direction: SmartLinkDirection.Horizontal,
|
|
63
66
|
width: SmartLinkWidth.Flexible,
|
|
64
|
-
className: ax([size === SmartLinkSize.XLarge && "_c71lxy5q", safari && "_4t3i1osq",
|
|
67
|
+
className: ax([size === SmartLinkSize.XLarge && "_c71lxy5q", safari && "_4t3i1osq", isRovoActionsEnabled && "_kqswh2mm"])
|
|
65
68
|
}, !!rovoChatAction && (rovoChatAction === null || rovoChatAction === void 0 ? void 0 : rovoChatAction.product) === 'CONFLUENCE' && /*#__PURE__*/React.createElement(WidthObserver, {
|
|
66
69
|
setWidth: setContainerWidth,
|
|
67
70
|
offscreen: true
|
|
68
71
|
}), /*#__PURE__*/React.createElement(ActionGroup, {
|
|
69
72
|
onDropdownOpenChange: onDropdownOpenChange,
|
|
70
73
|
items: actions,
|
|
71
|
-
appearance:
|
|
72
|
-
size:
|
|
73
|
-
containerWidth:
|
|
74
|
+
appearance: isRovoActionsEnabled ? 'subtle' : 'default',
|
|
75
|
+
size: isRovoActionsEnabled ? SmartLinkSize.Small : size,
|
|
76
|
+
containerWidth: isRovoActionsEnabled ? containerWidth : undefined
|
|
74
77
|
})) : null);
|
|
75
78
|
};
|
|
76
79
|
export default FooterBlockResolvedView;
|
|
@@ -51,9 +51,7 @@ const FlexibleCard = ({
|
|
|
51
51
|
openPreviewPanel,
|
|
52
52
|
product
|
|
53
53
|
} = useSmartLinkContext();
|
|
54
|
-
const rovoConfig =
|
|
55
|
-
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
56
|
-
useRovoConfig() : undefined;
|
|
54
|
+
const rovoConfig = useRovoConfig();
|
|
57
55
|
const {
|
|
58
56
|
fireEvent
|
|
59
57
|
} = useAnalyticsEvents();
|
|
@@ -85,10 +83,8 @@ const FlexibleCard = ({
|
|
|
85
83
|
origin,
|
|
86
84
|
renderers,
|
|
87
85
|
resolve,
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
rovoConfig
|
|
91
|
-
} : undefined),
|
|
86
|
+
product,
|
|
87
|
+
rovoConfig,
|
|
92
88
|
actionOptions,
|
|
93
89
|
status: placeholderCardState ? placeHolderStatus : status,
|
|
94
90
|
url,
|
|
@@ -9,7 +9,7 @@ import LinkWarningModal from './LinkWarningModal';
|
|
|
9
9
|
import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
|
|
10
10
|
const PACKAGE_DATA = {
|
|
11
11
|
packageName: "@atlaskit/smart-card",
|
|
12
|
-
packageVersion: "45.6.
|
|
12
|
+
packageVersion: "45.6.6",
|
|
13
13
|
componentName: 'linkUrl'
|
|
14
14
|
};
|
|
15
15
|
const LinkUrl = ({
|
|
@@ -25,7 +25,7 @@ export var extractFlexibleCardActions = function extractFlexibleCardActions(_ref
|
|
|
25
25
|
url = _ref.url,
|
|
26
26
|
isPreviewPanelAvailable = _ref.isPreviewPanelAvailable,
|
|
27
27
|
openPreviewPanel = _ref.openPreviewPanel;
|
|
28
|
-
var action =
|
|
28
|
+
var action = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, ActionName.CopyLinkAction, extractCopyLinkClientAction({
|
|
29
29
|
actionOptions: actionOptions,
|
|
30
30
|
appearance: appearance,
|
|
31
31
|
id: id,
|
|
@@ -46,14 +46,14 @@ export var extractFlexibleCardActions = function extractFlexibleCardActions(_ref
|
|
|
46
46
|
openPreviewPanel: openPreviewPanel
|
|
47
47
|
}, fg('platform_smartlink_xpc_url_wrapping') ? {
|
|
48
48
|
transformUrl: transformUrl
|
|
49
|
-
} : undefined))), ActionName.AutomationAction, extractAutomationAction(response)), InternalActionName.AISummaryAction, extractAISummaryAction(response, url, actionOptions, aiSummaryConfig)),
|
|
49
|
+
} : undefined))), ActionName.AutomationAction, extractAutomationAction(response)), InternalActionName.AISummaryAction, extractAISummaryAction(response, url, actionOptions, aiSummaryConfig)), ActionName.RovoChatAction, extractRovoChatAction({
|
|
50
50
|
actionOptions: actionOptions,
|
|
51
51
|
appearance: appearance,
|
|
52
52
|
id: id,
|
|
53
53
|
product: product,
|
|
54
54
|
response: response,
|
|
55
55
|
rovoConfig: rovoConfig
|
|
56
|
-
}))
|
|
56
|
+
})), InternalActionName.ViewRelatedLinksAction, extractViewRelatedLinksAction(response));
|
|
57
57
|
return Object.values(action).some(function (value) {
|
|
58
58
|
return Boolean(value);
|
|
59
59
|
}) ? action : undefined;
|
|
@@ -43,17 +43,15 @@ var extractFlexibleUiContext = function extractFlexibleUiContext() {
|
|
|
43
43
|
var meta = response.meta;
|
|
44
44
|
var url = extractSmartLinkUrl(response);
|
|
45
45
|
return {
|
|
46
|
-
actions: extractFlexibleCardActions(_objectSpread(
|
|
46
|
+
actions: extractFlexibleCardActions(_objectSpread({
|
|
47
47
|
actionOptions: actionOptions,
|
|
48
48
|
aiSummaryConfig: aiSummaryConfig,
|
|
49
49
|
appearance: appearance,
|
|
50
50
|
fireEvent: fireEvent,
|
|
51
51
|
id: id,
|
|
52
|
-
origin: origin
|
|
53
|
-
}, fg('platform_sl_3p_auth_rovo_action_kill_switch') ? {
|
|
52
|
+
origin: origin,
|
|
54
53
|
product: product,
|
|
55
|
-
rovoConfig: rovoConfig
|
|
56
|
-
} : undefined), {}, {
|
|
54
|
+
rovoConfig: rovoConfig,
|
|
57
55
|
response: response,
|
|
58
56
|
url: props.url,
|
|
59
57
|
// Use the original URL in edge cases, such as short links for AI summary and copy link actions.
|
|
@@ -4,7 +4,7 @@ export var ANALYTICS_CHANNEL = 'media';
|
|
|
4
4
|
export var context = {
|
|
5
5
|
componentName: 'smart-cards',
|
|
6
6
|
packageName: "@atlaskit/smart-card" || '',
|
|
7
|
-
packageVersion: "45.6.
|
|
7
|
+
packageVersion: "45.6.6" || ''
|
|
8
8
|
};
|
|
9
9
|
export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
|
|
10
10
|
TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
|
|
@@ -9,7 +9,6 @@ import VidFullScreenOnIcon from '@atlaskit/icon/core/fullscreen-enter';
|
|
|
9
9
|
import FullscreenExitIcon from '@atlaskit/icon/core/fullscreen-exit';
|
|
10
10
|
import ShortcutIcon from '@atlaskit/icon/core/link-external';
|
|
11
11
|
import { CloseButton, useModal } from '@atlaskit/modal-dialog';
|
|
12
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
12
|
import Tooltip from '@atlaskit/tooltip';
|
|
14
13
|
import { messages } from '../../../../messages';
|
|
15
14
|
import { Icon } from '../../../common/Icon';
|
|
@@ -56,7 +55,7 @@ var LinkInfo = function LinkInfo(_ref) {
|
|
|
56
55
|
}, [onDownloadButtonClick, testId, formatMessage]);
|
|
57
56
|
var urlButton = useMemo(function () {
|
|
58
57
|
if (onViewButtonClick) {
|
|
59
|
-
var label = providerName
|
|
58
|
+
var label = providerName ? formatMessage(messages.viewInProvider, {
|
|
60
59
|
providerName: providerName
|
|
61
60
|
}) : formatMessage(messages.viewOriginal);
|
|
62
61
|
var content = providerName ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormattedMessage, messages.viewIn), " ", providerName) : /*#__PURE__*/React.createElement(FormattedMessage, messages.viewOriginal);
|
package/dist/esm/view/FlexibleCard/components/actions/ai-summary-action/ai-summarise-action.js
CHANGED
|
@@ -4,10 +4,8 @@ var _excluded = ["onClick", "onError", "testId", "status", "summariseUrl"];
|
|
|
4
4
|
import React, { useCallback } from 'react';
|
|
5
5
|
import { FormattedMessage } from 'react-intl';
|
|
6
6
|
import RovoIcon from '@atlaskit/icon-lab/core/rovo';
|
|
7
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
7
|
import { useAnalyticsEvents } from '../../../../../common/analytics/generated/use-analytics-events';
|
|
9
8
|
import { messages } from '../../../../../messages';
|
|
10
|
-
import useRovoConfig from '../../../../../state/hooks/use-rovo-config';
|
|
11
9
|
import Action from '../action';
|
|
12
10
|
import { getErrorMessage } from './utils';
|
|
13
11
|
export function AISummariseAction(_ref) {
|
|
@@ -19,8 +17,6 @@ export function AISummariseAction(_ref) {
|
|
|
19
17
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
20
18
|
var _useAnalyticsEvents = useAnalyticsEvents(),
|
|
21
19
|
fireEvent = _useAnalyticsEvents.fireEvent;
|
|
22
|
-
var _useRovoConfig = useRovoConfig(),
|
|
23
|
-
product = _useRovoConfig.product;
|
|
24
20
|
var onCompleted = useCallback(function (state) {
|
|
25
21
|
if ((state === null || state === void 0 ? void 0 : state.status) === 'error') {
|
|
26
22
|
onErrorCallback === null || onErrorCallback === void 0 || onErrorCallback(getErrorMessage(state.error));
|
|
@@ -39,13 +35,12 @@ export function AISummariseAction(_ref) {
|
|
|
39
35
|
}, [fireEvent, onClickCallback, onCompleted, summariseUrl]);
|
|
40
36
|
return /*#__PURE__*/React.createElement(Action, _extends({
|
|
41
37
|
content: /*#__PURE__*/React.createElement(FormattedMessage, messages.ai_summary_action_rebrand),
|
|
42
|
-
icon: /*#__PURE__*/React.createElement(RovoIcon,
|
|
38
|
+
icon: /*#__PURE__*/React.createElement(RovoIcon, {
|
|
43
39
|
spacing: "spacious",
|
|
44
40
|
color: "currentColor",
|
|
45
|
-
label: "Summarise with AI"
|
|
46
|
-
}, fg('platform_sl_3p_auth_rovo_action_kill_switch') || !!product && product === 'CONFLUENCE' ? {
|
|
41
|
+
label: "Summarise with AI",
|
|
47
42
|
size: props.iconSize
|
|
48
|
-
}
|
|
43
|
+
}),
|
|
49
44
|
onClick: handleActionClick,
|
|
50
45
|
testId: "".concat(testId, "-summarise-action"),
|
|
51
46
|
isLoading: status === 'loading',
|
|
@@ -2,13 +2,11 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
2
2
|
import React, { lazy, useCallback } from 'react';
|
|
3
3
|
import { FormattedMessage, useIntl } from 'react-intl';
|
|
4
4
|
import AutomationIcon from '@atlaskit/icon/core/automation';
|
|
5
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
6
5
|
import { Text } from '@atlaskit/primitives/compiled';
|
|
7
6
|
import { useAnalyticsEvents } from '../../../../../common/analytics/generated/use-analytics-events';
|
|
8
7
|
import { ActionName } from '../../../../../constants';
|
|
9
8
|
import { messages } from '../../../../../messages';
|
|
10
9
|
import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
|
|
11
|
-
import useRovoConfig from '../../../../../state/hooks/use-rovo-config';
|
|
12
10
|
import { useSmartLinkModal } from '../../../../../state/modal';
|
|
13
11
|
import Action from '../action';
|
|
14
12
|
import { getModalContent } from './utils';
|
|
@@ -25,8 +23,6 @@ var AutomationAction = function AutomationAction(props) {
|
|
|
25
23
|
var _useAnalyticsEvents = useAnalyticsEvents(),
|
|
26
24
|
fireEvent = _useAnalyticsEvents.fireEvent;
|
|
27
25
|
var automationActionData = context === null || context === void 0 || (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[ActionName.AutomationAction];
|
|
28
|
-
var _useRovoConfig = useRovoConfig(),
|
|
29
|
-
rovoProduct = _useRovoConfig.product;
|
|
30
26
|
var automationActionOnClick = useCallback(function (automationActionData) {
|
|
31
27
|
var product = automationActionData.product,
|
|
32
28
|
resourceType = automationActionData.resourceType,
|
|
@@ -74,13 +70,12 @@ var AutomationAction = function AutomationAction(props) {
|
|
|
74
70
|
var automationActionIconLabel = formatMessage(messages.automation_action_icon_label);
|
|
75
71
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Action, _extends({
|
|
76
72
|
content: automationActionTitle,
|
|
77
|
-
icon: /*#__PURE__*/React.createElement(AutomationIcon,
|
|
73
|
+
icon: /*#__PURE__*/React.createElement(AutomationIcon, {
|
|
78
74
|
spacing: "spacious",
|
|
79
75
|
color: "currentColor",
|
|
80
|
-
label: automationActionIconLabel
|
|
81
|
-
}, fg('platform_sl_3p_auth_rovo_action_kill_switch') || !!rovoProduct && rovoProduct === 'CONFLUENCE' ? {
|
|
76
|
+
label: automationActionIconLabel,
|
|
82
77
|
size: props.iconSize
|
|
83
|
-
}
|
|
78
|
+
}),
|
|
84
79
|
testId: "smart-action-automation-action",
|
|
85
80
|
tooltipMessage: automationActionTooltip
|
|
86
81
|
}, props, {
|
|
@@ -10,12 +10,10 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
10
10
|
import React, { useCallback, useState } from 'react';
|
|
11
11
|
import { FormattedMessage, useIntl } from 'react-intl';
|
|
12
12
|
import LinkIcon from '@atlaskit/icon/core/link';
|
|
13
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
14
13
|
import { ActionName } from '../../../../../constants';
|
|
15
14
|
import { messages } from '../../../../../messages';
|
|
16
15
|
import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
|
|
17
16
|
import useInvokeClientAction from '../../../../../state/hooks/use-invoke-client-action';
|
|
18
|
-
import useRovoConfig from '../../../../../state/hooks/use-rovo-config';
|
|
19
17
|
import Action from '../action';
|
|
20
18
|
var CopyLinkAction = function CopyLinkAction(_ref) {
|
|
21
19
|
var _context$actions;
|
|
@@ -29,8 +27,6 @@ var CopyLinkAction = function CopyLinkAction(_ref) {
|
|
|
29
27
|
_useState2 = _slicedToArray(_useState, 2),
|
|
30
28
|
tooltipMessage = _useState2[0],
|
|
31
29
|
setTooltipMessage = _useState2[1];
|
|
32
|
-
var _useRovoConfig = useRovoConfig(),
|
|
33
|
-
product = _useRovoConfig.product;
|
|
34
30
|
var onClick = useCallback(function () {
|
|
35
31
|
if (data !== null && data !== void 0 && data.invokeAction) {
|
|
36
32
|
invoke(_objectSpread(_objectSpread({}, data.invokeAction), {}, {
|
|
@@ -62,13 +58,12 @@ var CopyLinkAction = function CopyLinkAction(_ref) {
|
|
|
62
58
|
return data ? /*#__PURE__*/React.createElement(Action, _extends({
|
|
63
59
|
ariaLabel: intl.formatMessage(messages.copy_url_to_clipboard),
|
|
64
60
|
content: /*#__PURE__*/React.createElement(FormattedMessage, messages.copy_url_to_clipboard),
|
|
65
|
-
icon: /*#__PURE__*/React.createElement(LinkIcon,
|
|
61
|
+
icon: /*#__PURE__*/React.createElement(LinkIcon, {
|
|
66
62
|
color: "currentColor",
|
|
67
63
|
label: "",
|
|
68
|
-
spacing: "spacious"
|
|
69
|
-
}, fg('platform_sl_3p_auth_rovo_action_kill_switch') || !!product && product === 'CONFLUENCE' ? {
|
|
64
|
+
spacing: "spacious",
|
|
70
65
|
size: props.iconSize
|
|
71
|
-
}
|
|
66
|
+
}),
|
|
72
67
|
onClick: onClick,
|
|
73
68
|
testId: "smart-action-copy-link-action",
|
|
74
69
|
tooltipMessage: /*#__PURE__*/React.createElement(FormattedMessage, tooltipMessage),
|
|
@@ -5,13 +5,11 @@ import React, { useCallback, useMemo } from 'react';
|
|
|
5
5
|
import { FormattedMessage, useIntl } from 'react-intl';
|
|
6
6
|
import MediaServicesActualSizeIcon from '@atlaskit/icon/core/grow-diagonal';
|
|
7
7
|
import PanelRightIcon from '@atlaskit/icon/core/panel-right';
|
|
8
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
9
8
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
10
9
|
import { ActionName } from '../../../../../constants';
|
|
11
10
|
import { messages } from '../../../../../messages';
|
|
12
11
|
import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
|
|
13
12
|
import useInvokeClientAction from '../../../../../state/hooks/use-invoke-client-action';
|
|
14
|
-
import useRovoConfig from '../../../../../state/hooks/use-rovo-config';
|
|
15
13
|
import Action from '../action';
|
|
16
14
|
var PreviewAction = function PreviewAction(_ref) {
|
|
17
15
|
var _context$actions;
|
|
@@ -22,8 +20,6 @@ var PreviewAction = function PreviewAction(_ref) {
|
|
|
22
20
|
var invoke = useInvokeClientAction({});
|
|
23
21
|
var data = context === null || context === void 0 || (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[ActionName.PreviewAction];
|
|
24
22
|
var hasPreviewPanel = data === null || data === void 0 ? void 0 : data.hasPreviewPanel;
|
|
25
|
-
var _useRovoConfig = useRovoConfig(),
|
|
26
|
-
product = _useRovoConfig.product;
|
|
27
23
|
var onClick = useCallback(function () {
|
|
28
24
|
if (data !== null && data !== void 0 && data.invokeAction) {
|
|
29
25
|
invoke(data.invokeAction);
|
|
@@ -35,22 +31,20 @@ var PreviewAction = function PreviewAction(_ref) {
|
|
|
35
31
|
var actionIcon = useCallback(function () {
|
|
36
32
|
// Only use panel icon if experiment is enabled and hasPreviewPanel is true
|
|
37
33
|
if (expValEquals('platform_hover_card_preview_panel', 'cohort', 'test') && hasPreviewPanel) {
|
|
38
|
-
return /*#__PURE__*/React.createElement(PanelRightIcon,
|
|
34
|
+
return /*#__PURE__*/React.createElement(PanelRightIcon, {
|
|
39
35
|
color: "currentColor",
|
|
40
36
|
spacing: "spacious",
|
|
41
|
-
label: ""
|
|
42
|
-
}, fg('platform_sl_3p_auth_rovo_action_kill_switch') || !!product && product === 'CONFLUENCE' ? {
|
|
37
|
+
label: "",
|
|
43
38
|
size: props.iconSize
|
|
44
|
-
}
|
|
39
|
+
});
|
|
45
40
|
}
|
|
46
|
-
return /*#__PURE__*/React.createElement(MediaServicesActualSizeIcon,
|
|
41
|
+
return /*#__PURE__*/React.createElement(MediaServicesActualSizeIcon, {
|
|
47
42
|
color: "currentColor",
|
|
48
43
|
spacing: "spacious",
|
|
49
|
-
label: ""
|
|
50
|
-
}, fg('platform_sl_3p_auth_rovo_action_kill_switch') || !!product && product === 'CONFLUENCE' ? {
|
|
44
|
+
label: "",
|
|
51
45
|
size: props.iconSize
|
|
52
|
-
}
|
|
53
|
-
}, [hasPreviewPanel, props.iconSize
|
|
46
|
+
});
|
|
47
|
+
}, [hasPreviewPanel, props.iconSize]);
|
|
54
48
|
var actionLabel = useMemo(function () {
|
|
55
49
|
// Only use panel message if experiment is enabled and hasPreviewPanel is true
|
|
56
50
|
if (expValEquals('platform_hover_card_preview_panel', 'cohort', 'test') && hasPreviewPanel) {
|
|
@@ -80,6 +80,11 @@ var ActionGroup = function ActionGroup(_ref) {
|
|
|
80
80
|
}, [context, items, product]);
|
|
81
81
|
var isMoreThenTwoItems = renderableActionItems.length > visibleButtonsNum;
|
|
82
82
|
var rovoChatAction = context === null || context === void 0 || (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[ActionName.RovoChatAction];
|
|
83
|
+
var isRovoActionsEnabled = useMemo(function () {
|
|
84
|
+
return !!rovoChatAction && rovoChatAction.product === 'CONFLUENCE' && items.some(function (action) {
|
|
85
|
+
return action.name === 'RovoChatAction';
|
|
86
|
+
});
|
|
87
|
+
}, [rovoChatAction, items]);
|
|
83
88
|
var onOpenChange = useCallback(function (attrs) {
|
|
84
89
|
setIsOpen(attrs.isOpen);
|
|
85
90
|
if (onDropdownOpenChange) {
|
|
@@ -94,7 +99,7 @@ var ActionGroup = function ActionGroup(_ref) {
|
|
|
94
99
|
}
|
|
95
100
|
}, [isOpen, onOpenChange]);
|
|
96
101
|
var actionButtons = useMemo(function () {
|
|
97
|
-
if (
|
|
102
|
+
if (isRovoActionsEnabled) {
|
|
98
103
|
var rovoActions = [].concat(_toConsumableArray(containerWidth >= REDUCED_ACTIONS_SIZE ? renderableActionItems.slice(0, visibleButtonsNum - 1) : []), _toConsumableArray(containerWidth >= OVERFLOW_ONLY_ACTIONS_SIZE ? [{
|
|
99
104
|
name: ActionName.RovoChatAction,
|
|
100
105
|
prompts: [RovoChatPromptKey.ASK_ROVO_ANYTHING],
|
|
@@ -114,10 +119,10 @@ var ActionGroup = function ActionGroup(_ref) {
|
|
|
114
119
|
}
|
|
115
120
|
var actionItems = isMoreThenTwoItems ? renderableActionItems.slice(0, visibleButtonsNum - 1) : renderableActionItems;
|
|
116
121
|
return renderActionItems(actionItems, size, appearance, false, onActionItemClick);
|
|
117
|
-
}, [appearance, isMoreThenTwoItems, onActionItemClick, renderableActionItems, size, visibleButtonsNum,
|
|
122
|
+
}, [appearance, isMoreThenTwoItems, onActionItemClick, renderableActionItems, size, visibleButtonsNum, isRovoActionsEnabled, containerWidth]);
|
|
118
123
|
var moreActionDropdown = useMemo(function () {
|
|
119
124
|
var actionItems;
|
|
120
|
-
if (
|
|
125
|
+
if (isRovoActionsEnabled && containerWidth < OVERFLOW_ONLY_ACTIONS_SIZE) {
|
|
121
126
|
actionItems = [].concat(_toConsumableArray(renderableActionItems), [{
|
|
122
127
|
name: ActionName.RovoChatAction,
|
|
123
128
|
prompts: [RovoChatPromptKey.ASK_ROVO_ANYTHING],
|
|
@@ -130,7 +135,7 @@ var ActionGroup = function ActionGroup(_ref) {
|
|
|
130
135
|
name: ActionName.PreviewAction,
|
|
131
136
|
iconSize: 'small'
|
|
132
137
|
}]);
|
|
133
|
-
} else if (
|
|
138
|
+
} else if (isRovoActionsEnabled && containerWidth < REDUCED_ACTIONS_SIZE) {
|
|
134
139
|
actionItems = renderableActionItems;
|
|
135
140
|
} else {
|
|
136
141
|
actionItems = isMoreThenTwoItems ? renderableActionItems.slice(visibleButtonsNum - 1) : [];
|
|
@@ -154,11 +159,11 @@ var ActionGroup = function ActionGroup(_ref) {
|
|
|
154
159
|
testId: "action-group-more-button-tooltip",
|
|
155
160
|
tag: "span"
|
|
156
161
|
}, /*#__PURE__*/React.createElement(Button, _extends({}, props, {
|
|
157
|
-
spacing:
|
|
162
|
+
spacing: isRovoActionsEnabled ? size === SmartLinkSize.XLarge ? 'default' : 'compact' : spacing,
|
|
158
163
|
testId: "action-group-more-button",
|
|
159
164
|
iconBefore: moreIcon,
|
|
160
165
|
ref: triggerRef
|
|
161
|
-
},
|
|
166
|
+
}, isRovoActionsEnabled ? {
|
|
162
167
|
appearance: appearance
|
|
163
168
|
} : {})));
|
|
164
169
|
},
|
|
@@ -167,7 +172,7 @@ var ActionGroup = function ActionGroup(_ref) {
|
|
|
167
172
|
}, renderActionItems(actionItems, size, appearance, true, onActionItemClick));
|
|
168
173
|
}
|
|
169
174
|
return null;
|
|
170
|
-
}, [appearance, isMoreThenTwoItems, isOpen, onActionItemClick, onOpenChange, renderableActionItems, size, ui === null || ui === void 0 ? void 0 : ui.zIndex, visibleButtonsNum,
|
|
175
|
+
}, [appearance, isMoreThenTwoItems, isOpen, onActionItemClick, onOpenChange, renderableActionItems, size, ui === null || ui === void 0 ? void 0 : ui.zIndex, visibleButtonsNum, isRovoActionsEnabled, containerWidth]);
|
|
171
176
|
return renderableActionItems.length > 0 ? /*#__PURE__*/React.createElement("div", {
|
|
172
177
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
173
178
|
className: ax(["_1e0c116y _dzc21h6o _1ilq1i6y", "actions-button-group"]),
|
|
@@ -29,7 +29,12 @@ var FooterBlockResolvedView = function FooterBlockResolvedView(props) {
|
|
|
29
29
|
isPreviewBlockErrored = props.isPreviewBlockErrored;
|
|
30
30
|
var context = useFlexibleUiContext();
|
|
31
31
|
var rovoChatAction = context === null || context === void 0 || (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[ActionName.RovoChatAction];
|
|
32
|
-
var
|
|
32
|
+
var isRovoActionsEnabled = useMemo(function () {
|
|
33
|
+
return !!rovoChatAction && rovoChatAction.product === 'CONFLUENCE' && (actions === null || actions === void 0 ? void 0 : actions.some(function (action) {
|
|
34
|
+
return action.name === 'RovoChatAction';
|
|
35
|
+
}));
|
|
36
|
+
}, [rovoChatAction, actions]);
|
|
37
|
+
var hasPreview = isRovoActionsEnabled && !!(context !== null && context !== void 0 && context.preview) && !isPreviewBlockErrored;
|
|
33
38
|
var hasActions = useMemo(function () {
|
|
34
39
|
var _filterActionItems;
|
|
35
40
|
return ((_filterActionItems = filterActionItems(actions, context)) === null || _filterActionItems === void 0 ? void 0 : _filterActionItems.length) > 0;
|
|
@@ -60,22 +65,22 @@ var FooterBlockResolvedView = function FooterBlockResolvedView(props) {
|
|
|
60
65
|
appearance: "subtle",
|
|
61
66
|
testId: "".concat(testId, "-provider"),
|
|
62
67
|
hideLabel: hasPreview,
|
|
63
|
-
className: ax([
|
|
68
|
+
className: ax([isRovoActionsEnabled && "_1wpz1h6o"])
|
|
64
69
|
}), actions && hasActions ? /*#__PURE__*/React.createElement(ElementGroup, {
|
|
65
70
|
testId: "smart-element-group-actions",
|
|
66
71
|
align: SmartLinkAlignment.Right,
|
|
67
72
|
direction: SmartLinkDirection.Horizontal,
|
|
68
73
|
width: SmartLinkWidth.Flexible,
|
|
69
|
-
className: ax([size === SmartLinkSize.XLarge && "_c71lxy5q", safari && "_4t3i1osq",
|
|
74
|
+
className: ax([size === SmartLinkSize.XLarge && "_c71lxy5q", safari && "_4t3i1osq", isRovoActionsEnabled && "_kqswh2mm"])
|
|
70
75
|
}, !!rovoChatAction && (rovoChatAction === null || rovoChatAction === void 0 ? void 0 : rovoChatAction.product) === 'CONFLUENCE' && /*#__PURE__*/React.createElement(WidthObserver, {
|
|
71
76
|
setWidth: setContainerWidth,
|
|
72
77
|
offscreen: true
|
|
73
78
|
}), /*#__PURE__*/React.createElement(ActionGroup, {
|
|
74
79
|
onDropdownOpenChange: onDropdownOpenChange,
|
|
75
80
|
items: actions,
|
|
76
|
-
appearance:
|
|
77
|
-
size:
|
|
78
|
-
containerWidth:
|
|
81
|
+
appearance: isRovoActionsEnabled ? 'subtle' : 'default',
|
|
82
|
+
size: isRovoActionsEnabled ? SmartLinkSize.Small : size,
|
|
83
|
+
containerWidth: isRovoActionsEnabled ? containerWidth : undefined
|
|
79
84
|
})) : null);
|
|
80
85
|
};
|
|
81
86
|
export default FooterBlockResolvedView;
|