@atlaskit/smart-card 44.9.7 → 44.9.8
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 +19 -0
- package/dist/cjs/extractors/flexible/icon/index.js +12 -2
- package/dist/cjs/extractors/inline/index.js +7 -5
- package/dist/cjs/utils/analytics/analytics.js +1 -1
- package/dist/cjs/view/EmbedCard/views/ResolvedView.js +10 -4
- package/dist/cjs/view/InlineCard/IconAndTitleLayout/index.js +93 -32
- package/dist/cjs/view/LinkUrl/index.js +1 -1
- package/dist/es2019/extractors/flexible/icon/index.js +12 -2
- package/dist/es2019/extractors/inline/index.js +8 -6
- package/dist/es2019/utils/analytics/analytics.js +1 -1
- package/dist/es2019/view/EmbedCard/views/ResolvedView.js +11 -5
- package/dist/es2019/view/InlineCard/IconAndTitleLayout/index.js +86 -30
- package/dist/es2019/view/LinkUrl/index.js +1 -1
- package/dist/esm/extractors/flexible/icon/index.js +12 -2
- package/dist/esm/extractors/inline/index.js +8 -6
- package/dist/esm/utils/analytics/analytics.js +1 -1
- package/dist/esm/view/EmbedCard/views/ResolvedView.js +10 -4
- package/dist/esm/view/InlineCard/IconAndTitleLayout/index.js +93 -32
- package/dist/esm/view/LinkUrl/index.js +1 -1
- package/dist/types/__fixtures__/atlas-project-with-ai-summary.d.ts +2 -1
- package/dist/types/__fixtures__/atlas-project.d.ts +2 -2
- package/dist/types/__fixtures__/bitbucket-pull-request.d.ts +3 -75
- package/dist/types/__fixtures__/compass-scorecard.d.ts +3 -46
- package/dist/types/__fixtures__/confluence-blog.d.ts +3 -51
- package/dist/types/__fixtures__/confluence-page.d.ts +3 -51
- package/dist/types/__fixtures__/confluence-space.d.ts +3 -38
- package/dist/types/__fixtures__/confluence-template.d.ts +3 -33
- package/dist/types/__fixtures__/dropbox-file.d.ts +2 -2
- package/dist/types/__fixtures__/figma-entity.d.ts +3 -58
- package/dist/types/__fixtures__/figma.d.ts +3 -45
- package/dist/types/__fixtures__/jira-roadmap.d.ts +3 -37
- package/dist/types/__fixtures__/jira-task.d.ts +3 -80
- package/dist/types/__fixtures__/jira-timeline.d.ts +3 -37
- package/dist/types/__fixtures__/youtube-video.d.ts +3 -46
- package/dist/types/extractors/flexible/icon/index.d.ts +3 -3
- package/dist/types/view/EmbedCard/types.d.ts +1 -0
- package/dist/types-ts4.5/__fixtures__/atlas-project-with-ai-summary.d.ts +2 -1
- package/dist/types-ts4.5/__fixtures__/atlas-project.d.ts +2 -2
- package/dist/types-ts4.5/__fixtures__/bitbucket-pull-request.d.ts +3 -75
- package/dist/types-ts4.5/__fixtures__/compass-scorecard.d.ts +3 -46
- package/dist/types-ts4.5/__fixtures__/confluence-blog.d.ts +3 -51
- package/dist/types-ts4.5/__fixtures__/confluence-page.d.ts +3 -51
- package/dist/types-ts4.5/__fixtures__/confluence-space.d.ts +3 -38
- package/dist/types-ts4.5/__fixtures__/confluence-template.d.ts +3 -33
- package/dist/types-ts4.5/__fixtures__/dropbox-file.d.ts +2 -2
- package/dist/types-ts4.5/__fixtures__/figma-entity.d.ts +3 -58
- package/dist/types-ts4.5/__fixtures__/figma.d.ts +3 -45
- package/dist/types-ts4.5/__fixtures__/jira-roadmap.d.ts +3 -37
- package/dist/types-ts4.5/__fixtures__/jira-task.d.ts +3 -80
- package/dist/types-ts4.5/__fixtures__/jira-timeline.d.ts +3 -37
- package/dist/types-ts4.5/__fixtures__/youtube-video.d.ts +3 -46
- package/dist/types-ts4.5/extractors/flexible/icon/index.d.ts +3 -3
- package/dist/types-ts4.5/view/EmbedCard/types.d.ts +1 -0
- package/package.json +7 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,24 @@
|
|
|
1
1
|
# @atlaskit/smart-card
|
|
2
2
|
|
|
3
|
+
## 44.9.8
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`00d5363469512`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/00d5363469512) -
|
|
8
|
+
Two changes:
|
|
9
|
+
1. When response has `entityData`, Smart Card icon extraction now tries entity-specific icon URL
|
|
10
|
+
for main icon rendering.
|
|
11
|
+
2. For image-icon cases, Smart Card passes an `alt` label for the icon image (entity
|
|
12
|
+
design/document icon labels and provider label paths).
|
|
13
|
+
|
|
14
|
+
Public API change:
|
|
15
|
+
- In `@atlaskit/link-extractors` (main entrypoint), exported `LinkProvider` type now includes
|
|
16
|
+
optional `iconLabel?: string`.
|
|
17
|
+
|
|
18
|
+
All changes behind feature gate: `platform_lp_use_entity_icon_url_for_icon`.
|
|
19
|
+
|
|
20
|
+
- Updated dependencies
|
|
21
|
+
|
|
3
22
|
## 44.9.7
|
|
4
23
|
|
|
5
24
|
### Patch Changes
|
|
@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.extractSmartLinkIcon = exports.extractLinkIcon = exports.extractErrorIcon = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _linkExtractors = require("@atlaskit/link-extractors");
|
|
10
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
10
11
|
var _constants = require("../../../constants");
|
|
11
12
|
var _extractIconRenderer = _interopRequireDefault(require("./extract-icon-renderer"));
|
|
12
13
|
var _extractJsonldDataIcon = _interopRequireDefault(require("./extract-jsonld-data-icon"));
|
|
@@ -62,8 +63,17 @@ var extractSmartLinkIcon = exports.extractSmartLinkIcon = function extractSmartL
|
|
|
62
63
|
if (!response || !(response !== null && response !== void 0 && response.data)) {
|
|
63
64
|
return undefined;
|
|
64
65
|
}
|
|
65
|
-
if ((0,
|
|
66
|
-
|
|
66
|
+
if ((0, _platformFeatureFlags.fg)('platform_lp_use_entity_icon_url_for_icon')) {
|
|
67
|
+
if ((0, _linkExtractors.isEntityPresent)(response)) {
|
|
68
|
+
var entityIcon = (0, _linkExtractors.extractEntityIcon)(response);
|
|
69
|
+
if (entityIcon) {
|
|
70
|
+
return entityIcon;
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
} else {
|
|
74
|
+
if ((0, _linkExtractors.isEntityPresent)(response)) {
|
|
75
|
+
return (0, _linkExtractors.extractEntityIcon)(response);
|
|
76
|
+
}
|
|
67
77
|
}
|
|
68
78
|
return extractLinkIcon(response, renderers);
|
|
69
79
|
};
|
|
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.extractInlineProps = void 0;
|
|
7
7
|
var _linkExtractors = require("@atlaskit/link-extractors");
|
|
8
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
8
9
|
var _jsonld = require("../../utils/jsonld");
|
|
9
10
|
var _icon = require("../common/icon");
|
|
10
11
|
var _lozenge = require("../common/lozenge");
|
|
@@ -28,15 +29,16 @@ var extractInlineIcon = function extractInlineIcon(jsonLd) {
|
|
|
28
29
|
var extractSmartLinkInlineIcon = function extractSmartLinkInlineIcon(response) {
|
|
29
30
|
var showLabel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
30
31
|
if ((0, _linkExtractors.isEntityPresent)(response)) {
|
|
32
|
+
if ((0, _platformFeatureFlags.fg)('platform_lp_use_entity_icon_url_for_icon')) {
|
|
33
|
+
var entityIcon = (0, _linkExtractors.extractEntityIcon)(response);
|
|
34
|
+
if (entityIcon) {
|
|
35
|
+
return [entityIcon.url, entityIcon.label];
|
|
36
|
+
}
|
|
37
|
+
}
|
|
31
38
|
var provider = (0, _linkExtractors.extractEntityProvider)(response);
|
|
32
39
|
if (provider) {
|
|
33
40
|
return provider.icon;
|
|
34
41
|
}
|
|
35
|
-
// We don't need this for design entities,
|
|
36
|
-
// but we can add it back when we support more entities
|
|
37
|
-
// it requires extractInlineIcon to be moved to the smart link extractor package.
|
|
38
|
-
// see: https://product-fabric.atlassian.net/browse/EDM-12375
|
|
39
|
-
// return extractSmartLinkIcon(response);
|
|
40
42
|
}
|
|
41
43
|
return extractInlineIcon((response === null || response === void 0 ? void 0 : response.data) || (0, _jsonld.getEmptyJsonLd)(), showLabel);
|
|
42
44
|
};
|
|
@@ -11,7 +11,7 @@ var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
|
|
|
11
11
|
var context = exports.context = {
|
|
12
12
|
componentName: 'smart-cards',
|
|
13
13
|
packageName: "@atlaskit/smart-card" || '',
|
|
14
|
-
packageVersion: "44.9.
|
|
14
|
+
packageVersion: "44.9.7" || ''
|
|
15
15
|
};
|
|
16
16
|
var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
|
|
17
17
|
TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
|
|
@@ -6,8 +6,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.EmbedCardResolvedView = void 0;
|
|
8
8
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
9
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
10
|
var _react = _interopRequireDefault(require("react"));
|
|
10
11
|
var _link = _interopRequireDefault(require("@atlaskit/icon/core/link"));
|
|
12
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
11
13
|
var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
|
|
12
14
|
var _tokens = require("@atlaskit/tokens");
|
|
13
15
|
var _utils = require("../../../utils");
|
|
@@ -109,6 +111,7 @@ var EmbedCardResolvedViewUpdated = /*#__PURE__*/_react.default.forwardRef(functi
|
|
|
109
111
|
hideIconLoadingSkeleton = _ref2.hideIconLoadingSkeleton,
|
|
110
112
|
extensionKey = _ref2.extensionKey;
|
|
111
113
|
var iconFromContext = context === null || context === void 0 ? void 0 : context.icon;
|
|
114
|
+
var iconLabel = context === null || context === void 0 ? void 0 : context.iconLabel;
|
|
112
115
|
var src = typeof iconFromContext === 'string' ? iconFromContext : undefined;
|
|
113
116
|
var text = title || (context === null || context === void 0 ? void 0 : context.text);
|
|
114
117
|
var linkGlyph = _react.default.useMemo(function () {
|
|
@@ -122,13 +125,16 @@ var EmbedCardResolvedViewUpdated = /*#__PURE__*/_react.default.forwardRef(functi
|
|
|
122
125
|
if ( /*#__PURE__*/_react.default.isValidElement(iconFromContext)) {
|
|
123
126
|
return iconFromContext;
|
|
124
127
|
}
|
|
125
|
-
return /*#__PURE__*/_react.default.createElement(_ImageIcon.ImageIcon, {
|
|
126
|
-
src: src
|
|
128
|
+
return /*#__PURE__*/_react.default.createElement(_ImageIcon.ImageIcon, (0, _extends2.default)({
|
|
129
|
+
src: src
|
|
130
|
+
}, (0, _platformFeatureFlags.fg)('platform_lp_use_entity_icon_url_for_icon') ? {
|
|
131
|
+
alt: iconLabel
|
|
132
|
+
} : undefined, {
|
|
127
133
|
default: linkGlyph,
|
|
128
134
|
appearance: (0, _utils.isProfileType)(type) ? 'round' : 'square',
|
|
129
135
|
hideLoadingSkeleton: hideIconLoadingSkeleton
|
|
130
|
-
});
|
|
131
|
-
}, [iconFromContext, src, linkGlyph, type, hideIconLoadingSkeleton]);
|
|
136
|
+
}));
|
|
137
|
+
}, [iconFromContext, src, linkGlyph, type, hideIconLoadingSkeleton, iconLabel]);
|
|
132
138
|
(0, _useEmbedResolvePostMessageListener.useEmbedResolvePostMessageListener)({
|
|
133
139
|
url: link,
|
|
134
140
|
embedIframeRef: embedIframeRef
|
|
@@ -16,6 +16,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
16
16
|
var _reactMagneticDi = require("react-magnetic-di");
|
|
17
17
|
var _reactRenderImage = _interopRequireDefault(require("react-render-image"));
|
|
18
18
|
var _link = _interopRequireDefault(require("@atlaskit/icon/core/link"));
|
|
19
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
19
20
|
var _compiled = require("@atlaskit/primitives/compiled");
|
|
20
21
|
var _utils = require("../../../utils");
|
|
21
22
|
var _Icon = require("../Icon");
|
|
@@ -66,46 +67,106 @@ var IconAndTitleLayout = exports.IconAndTitleLayout = function IconAndTitleLayou
|
|
|
66
67
|
hasImageErrored = _useState2[0],
|
|
67
68
|
setHasImageErrored = _useState2[1];
|
|
68
69
|
var renderAtlaskitIcon = _react.default.useCallback(function () {
|
|
69
|
-
if (
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
70
|
+
if ((0, _platformFeatureFlags.fg)('platform_lp_use_entity_icon_url_for_icon')) {
|
|
71
|
+
if (emoji) {
|
|
72
|
+
return emoji;
|
|
73
|
+
}
|
|
74
|
+
if (!icon || typeof icon === 'string' || Array.isArray(icon)) {
|
|
75
|
+
return null;
|
|
76
|
+
}
|
|
77
|
+
return icon;
|
|
78
|
+
} else {
|
|
79
|
+
if (emoji) {
|
|
80
|
+
return emoji;
|
|
81
|
+
}
|
|
82
|
+
if (!icon || typeof icon === 'string') {
|
|
83
|
+
return null;
|
|
84
|
+
}
|
|
85
|
+
return icon;
|
|
74
86
|
}
|
|
75
|
-
return icon;
|
|
76
87
|
}, [emoji, icon]);
|
|
77
88
|
var profileType = (0, _utils.isProfileType)(type);
|
|
78
89
|
var renderImageIcon = _react.default.useCallback(function (errored, testId) {
|
|
79
|
-
if (
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
if (hideIconLoadingSkeleton) {
|
|
83
|
-
if (hasImageErrored) {
|
|
84
|
-
return errored;
|
|
90
|
+
if ((0, _platformFeatureFlags.fg)('platform_lp_use_entity_icon_url_for_icon')) {
|
|
91
|
+
if (!icon) {
|
|
92
|
+
return null;
|
|
85
93
|
}
|
|
86
|
-
|
|
94
|
+
var iconUrl;
|
|
95
|
+
var iconLabel = '';
|
|
96
|
+
if (Array.isArray(icon)) {
|
|
97
|
+
var _ref3 = icon,
|
|
98
|
+
_ref4 = (0, _slicedToArray2.default)(_ref3, 2),
|
|
99
|
+
tupleIconUrl = _ref4[0],
|
|
100
|
+
tupleIconLabel = _ref4[1];
|
|
101
|
+
if (typeof tupleIconUrl !== 'string') {
|
|
102
|
+
return null;
|
|
103
|
+
}
|
|
104
|
+
iconUrl = tupleIconUrl;
|
|
105
|
+
iconLabel = typeof tupleIconLabel === 'string' ? tupleIconLabel : '';
|
|
106
|
+
} else if (typeof icon === 'string') {
|
|
107
|
+
iconUrl = icon;
|
|
108
|
+
} else {
|
|
109
|
+
return null;
|
|
110
|
+
}
|
|
111
|
+
if (hideIconLoadingSkeleton) {
|
|
112
|
+
if (hasImageErrored) {
|
|
113
|
+
return errored;
|
|
114
|
+
}
|
|
115
|
+
return /*#__PURE__*/_react.default.createElement("img", {
|
|
116
|
+
src: iconUrl,
|
|
117
|
+
"data-testid": "".concat(testId, "-image"),
|
|
118
|
+
alt: iconLabel,
|
|
119
|
+
onError: function onError() {
|
|
120
|
+
return setHasImageErrored(true);
|
|
121
|
+
},
|
|
122
|
+
className: (0, _runtime.ax)(["_c71l7vkz _p12f7vkz _1bsb1osq", profileType && styles.roundImageStyle])
|
|
123
|
+
});
|
|
124
|
+
}
|
|
125
|
+
return /*#__PURE__*/_react.default.createElement(_reactRenderImage.default, {
|
|
126
|
+
src: iconUrl,
|
|
127
|
+
loaded: /*#__PURE__*/_react.default.createElement("img", {
|
|
128
|
+
src: iconUrl,
|
|
129
|
+
"data-testid": "".concat(testId, "-image"),
|
|
130
|
+
alt: iconLabel,
|
|
131
|
+
className: (0, _runtime.ax)(["_c71l7vkz _p12f7vkz _1bsb1osq", profileType && styles.roundImageStyle])
|
|
132
|
+
}),
|
|
133
|
+
errored: errored,
|
|
134
|
+
loading: /*#__PURE__*/_react.default.createElement(_Icon.Shimmer, {
|
|
135
|
+
testId: "".concat(testId, "-loading")
|
|
136
|
+
})
|
|
137
|
+
});
|
|
138
|
+
} else {
|
|
139
|
+
if (!icon || typeof icon !== 'string') {
|
|
140
|
+
return null;
|
|
141
|
+
}
|
|
142
|
+
if (hideIconLoadingSkeleton) {
|
|
143
|
+
if (hasImageErrored) {
|
|
144
|
+
return errored;
|
|
145
|
+
}
|
|
146
|
+
return /*#__PURE__*/_react.default.createElement("img", {
|
|
147
|
+
src: icon,
|
|
148
|
+
"data-testid": "".concat(testId, "-image"),
|
|
149
|
+
alt: "",
|
|
150
|
+
onError: function onError() {
|
|
151
|
+
return setHasImageErrored(true);
|
|
152
|
+
},
|
|
153
|
+
className: (0, _runtime.ax)(["_c71l7vkz _p12f7vkz _1bsb1osq", profileType && styles.roundImageStyle])
|
|
154
|
+
});
|
|
155
|
+
}
|
|
156
|
+
return /*#__PURE__*/_react.default.createElement(_reactRenderImage.default, {
|
|
87
157
|
src: icon,
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
158
|
+
loaded: /*#__PURE__*/_react.default.createElement("img", {
|
|
159
|
+
src: icon,
|
|
160
|
+
"data-testid": "".concat(testId, "-image"),
|
|
161
|
+
alt: "",
|
|
162
|
+
className: (0, _runtime.ax)(["_c71l7vkz _p12f7vkz _1bsb1osq", profileType && styles.roundImageStyle])
|
|
163
|
+
}),
|
|
164
|
+
errored: errored,
|
|
165
|
+
loading: /*#__PURE__*/_react.default.createElement(_Icon.Shimmer, {
|
|
166
|
+
testId: "".concat(testId, "-loading")
|
|
167
|
+
})
|
|
94
168
|
});
|
|
95
169
|
}
|
|
96
|
-
return /*#__PURE__*/_react.default.createElement(_reactRenderImage.default, {
|
|
97
|
-
src: icon,
|
|
98
|
-
loaded: /*#__PURE__*/_react.default.createElement("img", {
|
|
99
|
-
src: icon,
|
|
100
|
-
"data-testid": "".concat(testId, "-image"),
|
|
101
|
-
alt: "",
|
|
102
|
-
className: (0, _runtime.ax)(["_c71l7vkz _p12f7vkz _1bsb1osq", profileType && styles.roundImageStyle])
|
|
103
|
-
}),
|
|
104
|
-
errored: errored,
|
|
105
|
-
loading: /*#__PURE__*/_react.default.createElement(_Icon.Shimmer, {
|
|
106
|
-
testId: "".concat(testId, "-loading")
|
|
107
|
-
})
|
|
108
|
-
});
|
|
109
170
|
}, [icon, profileType, hideIconLoadingSkeleton, hasImageErrored]);
|
|
110
171
|
var renderIconPlaceholder = _react.default.useCallback(function (testId) {
|
|
111
172
|
return defaultIcon || /*#__PURE__*/_react.default.createElement(_link.default, {
|
|
@@ -22,7 +22,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId", "isLink
|
|
|
22
22
|
_excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
|
|
23
23
|
var PACKAGE_DATA = {
|
|
24
24
|
packageName: "@atlaskit/smart-card",
|
|
25
|
-
packageVersion: "44.9.
|
|
25
|
+
packageVersion: "44.9.7",
|
|
26
26
|
componentName: 'linkUrl'
|
|
27
27
|
};
|
|
28
28
|
var Anchor = (0, _click.withLinkClickedEvent)('a');
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { extractEntityIcon, isEntityPresent } from '@atlaskit/link-extractors';
|
|
2
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
2
3
|
import { IconType, SmartLinkStatus } from '../../../constants';
|
|
3
4
|
import extractIconRenderer from './extract-icon-renderer';
|
|
4
5
|
import extractJsonldDataIcon from './extract-jsonld-data-icon';
|
|
@@ -54,8 +55,17 @@ export const extractSmartLinkIcon = (response, renderers) => {
|
|
|
54
55
|
if (!response || !(response !== null && response !== void 0 && response.data)) {
|
|
55
56
|
return undefined;
|
|
56
57
|
}
|
|
57
|
-
if (
|
|
58
|
-
|
|
58
|
+
if (fg('platform_lp_use_entity_icon_url_for_icon')) {
|
|
59
|
+
if (isEntityPresent(response)) {
|
|
60
|
+
const entityIcon = extractEntityIcon(response);
|
|
61
|
+
if (entityIcon) {
|
|
62
|
+
return entityIcon;
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
} else {
|
|
66
|
+
if (isEntityPresent(response)) {
|
|
67
|
+
return extractEntityIcon(response);
|
|
68
|
+
}
|
|
59
69
|
}
|
|
60
70
|
return extractLinkIcon(response, renderers);
|
|
61
71
|
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { extractEntityProvider, extractProvider, extractSmartLinkTitle, extractSmartLinkUrl, extractType, isEntityPresent } from '@atlaskit/link-extractors';
|
|
1
|
+
import { extractEntityIcon, extractEntityProvider, extractProvider, extractSmartLinkTitle, extractSmartLinkUrl, extractType, isEntityPresent } from '@atlaskit/link-extractors';
|
|
2
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
2
3
|
import { getEmptyJsonLd } from '../../utils/jsonld';
|
|
3
4
|
import { extractIcon } from '../common/icon';
|
|
4
5
|
import { extractLozenge } from '../common/lozenge';
|
|
@@ -20,15 +21,16 @@ const extractInlineIcon = (jsonLd, showIconLabel = true) => {
|
|
|
20
21
|
*/
|
|
21
22
|
const extractSmartLinkInlineIcon = (response, showLabel = true) => {
|
|
22
23
|
if (isEntityPresent(response)) {
|
|
24
|
+
if (fg('platform_lp_use_entity_icon_url_for_icon')) {
|
|
25
|
+
const entityIcon = extractEntityIcon(response);
|
|
26
|
+
if (entityIcon) {
|
|
27
|
+
return [entityIcon.url, entityIcon.label];
|
|
28
|
+
}
|
|
29
|
+
}
|
|
23
30
|
const provider = extractEntityProvider(response);
|
|
24
31
|
if (provider) {
|
|
25
32
|
return provider.icon;
|
|
26
33
|
}
|
|
27
|
-
// We don't need this for design entities,
|
|
28
|
-
// but we can add it back when we support more entities
|
|
29
|
-
// it requires extractInlineIcon to be moved to the smart link extractor package.
|
|
30
|
-
// see: https://product-fabric.atlassian.net/browse/EDM-12375
|
|
31
|
-
// return extractSmartLinkIcon(response);
|
|
32
34
|
}
|
|
33
35
|
return extractInlineIcon((response === null || response === void 0 ? void 0 : response.data) || getEmptyJsonLd(), showLabel);
|
|
34
36
|
};
|
|
@@ -2,7 +2,7 @@ export const ANALYTICS_CHANNEL = 'media';
|
|
|
2
2
|
export const context = {
|
|
3
3
|
componentName: 'smart-cards',
|
|
4
4
|
packageName: "@atlaskit/smart-card" || '',
|
|
5
|
-
packageVersion: "44.9.
|
|
5
|
+
packageVersion: "44.9.7" || ''
|
|
6
6
|
};
|
|
7
7
|
export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
|
|
8
8
|
TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
|
|
@@ -1,5 +1,7 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
1
2
|
import React from 'react';
|
|
2
3
|
import LinkGlyph from '@atlaskit/icon/core/link';
|
|
4
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
3
5
|
import { componentWithFG } from '@atlaskit/platform-feature-flags-react';
|
|
4
6
|
import { useThemeObserver } from '@atlaskit/tokens';
|
|
5
7
|
import { getPreviewUrlWithTheme, isProfileType } from '../../../utils';
|
|
@@ -99,6 +101,7 @@ const EmbedCardResolvedViewUpdated = /*#__PURE__*/React.forwardRef(({
|
|
|
99
101
|
extensionKey
|
|
100
102
|
}, embedIframeRef) => {
|
|
101
103
|
const iconFromContext = context === null || context === void 0 ? void 0 : context.icon;
|
|
104
|
+
const iconLabel = context === null || context === void 0 ? void 0 : context.iconLabel;
|
|
102
105
|
const src = typeof iconFromContext === 'string' ? iconFromContext : undefined;
|
|
103
106
|
const text = title || (context === null || context === void 0 ? void 0 : context.text);
|
|
104
107
|
const linkGlyph = React.useMemo(() => /*#__PURE__*/React.createElement(LinkGlyph, {
|
|
@@ -106,17 +109,20 @@ const EmbedCardResolvedViewUpdated = /*#__PURE__*/React.forwardRef(({
|
|
|
106
109
|
testId: "embed-card-fallback-icon",
|
|
107
110
|
color: "currentColor"
|
|
108
111
|
}), []);
|
|
109
|
-
|
|
112
|
+
const icon = React.useMemo(() => {
|
|
110
113
|
if ( /*#__PURE__*/React.isValidElement(iconFromContext)) {
|
|
111
114
|
return iconFromContext;
|
|
112
115
|
}
|
|
113
|
-
return /*#__PURE__*/React.createElement(ImageIcon, {
|
|
114
|
-
src: src
|
|
116
|
+
return /*#__PURE__*/React.createElement(ImageIcon, _extends({
|
|
117
|
+
src: src
|
|
118
|
+
}, fg('platform_lp_use_entity_icon_url_for_icon') ? {
|
|
119
|
+
alt: iconLabel
|
|
120
|
+
} : undefined, {
|
|
115
121
|
default: linkGlyph,
|
|
116
122
|
appearance: isProfileType(type) ? 'round' : 'square',
|
|
117
123
|
hideLoadingSkeleton: hideIconLoadingSkeleton
|
|
118
|
-
});
|
|
119
|
-
}, [iconFromContext, src, linkGlyph, type, hideIconLoadingSkeleton]);
|
|
124
|
+
}));
|
|
125
|
+
}, [iconFromContext, src, linkGlyph, type, hideIconLoadingSkeleton, iconLabel]);
|
|
120
126
|
useEmbedResolvePostMessageListener({
|
|
121
127
|
url: link,
|
|
122
128
|
embedIframeRef
|
|
@@ -7,6 +7,7 @@ import React, { useState } from 'react';
|
|
|
7
7
|
import { di } from 'react-magnetic-di';
|
|
8
8
|
import ImageLoader from 'react-render-image';
|
|
9
9
|
import LinkIcon from '@atlaskit/icon/core/link';
|
|
10
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
10
11
|
import { Box } from '@atlaskit/primitives/compiled';
|
|
11
12
|
import { isProfileType } from '../../../utils';
|
|
12
13
|
import { Shimmer } from '../Icon';
|
|
@@ -52,44 +53,99 @@ export const IconAndTitleLayout = ({
|
|
|
52
53
|
}) => {
|
|
53
54
|
const [hasImageErrored, setHasImageErrored] = useState(false);
|
|
54
55
|
const renderAtlaskitIcon = React.useCallback(() => {
|
|
55
|
-
if (
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
56
|
+
if (fg('platform_lp_use_entity_icon_url_for_icon')) {
|
|
57
|
+
if (emoji) {
|
|
58
|
+
return emoji;
|
|
59
|
+
}
|
|
60
|
+
if (!icon || typeof icon === 'string' || Array.isArray(icon)) {
|
|
61
|
+
return null;
|
|
62
|
+
}
|
|
63
|
+
return icon;
|
|
64
|
+
} else {
|
|
65
|
+
if (emoji) {
|
|
66
|
+
return emoji;
|
|
67
|
+
}
|
|
68
|
+
if (!icon || typeof icon === 'string') {
|
|
69
|
+
return null;
|
|
70
|
+
}
|
|
71
|
+
return icon;
|
|
60
72
|
}
|
|
61
|
-
return icon;
|
|
62
73
|
}, [emoji, icon]);
|
|
63
74
|
const profileType = isProfileType(type);
|
|
64
75
|
const renderImageIcon = React.useCallback((errored, testId) => {
|
|
65
|
-
if (
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
if (hideIconLoadingSkeleton) {
|
|
69
|
-
if (hasImageErrored) {
|
|
70
|
-
return errored;
|
|
76
|
+
if (fg('platform_lp_use_entity_icon_url_for_icon')) {
|
|
77
|
+
if (!icon) {
|
|
78
|
+
return null;
|
|
71
79
|
}
|
|
72
|
-
|
|
80
|
+
let iconUrl;
|
|
81
|
+
let iconLabel = '';
|
|
82
|
+
if (Array.isArray(icon)) {
|
|
83
|
+
const [tupleIconUrl, tupleIconLabel] = icon;
|
|
84
|
+
if (typeof tupleIconUrl !== 'string') {
|
|
85
|
+
return null;
|
|
86
|
+
}
|
|
87
|
+
iconUrl = tupleIconUrl;
|
|
88
|
+
iconLabel = typeof tupleIconLabel === 'string' ? tupleIconLabel : '';
|
|
89
|
+
} else if (typeof icon === 'string') {
|
|
90
|
+
iconUrl = icon;
|
|
91
|
+
} else {
|
|
92
|
+
return null;
|
|
93
|
+
}
|
|
94
|
+
if (hideIconLoadingSkeleton) {
|
|
95
|
+
if (hasImageErrored) {
|
|
96
|
+
return errored;
|
|
97
|
+
}
|
|
98
|
+
return /*#__PURE__*/React.createElement("img", {
|
|
99
|
+
src: iconUrl,
|
|
100
|
+
"data-testid": `${testId}-image`,
|
|
101
|
+
alt: iconLabel,
|
|
102
|
+
onError: () => setHasImageErrored(true),
|
|
103
|
+
className: ax(["_c71l7vkz _p12f7vkz _1bsb1osq", profileType && styles.roundImageStyle])
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
return /*#__PURE__*/React.createElement(ImageLoader, {
|
|
107
|
+
src: iconUrl,
|
|
108
|
+
loaded: /*#__PURE__*/React.createElement("img", {
|
|
109
|
+
src: iconUrl,
|
|
110
|
+
"data-testid": `${testId}-image`,
|
|
111
|
+
alt: iconLabel,
|
|
112
|
+
className: ax(["_c71l7vkz _p12f7vkz _1bsb1osq", profileType && styles.roundImageStyle])
|
|
113
|
+
}),
|
|
114
|
+
errored: errored,
|
|
115
|
+
loading: /*#__PURE__*/React.createElement(Shimmer, {
|
|
116
|
+
testId: `${testId}-loading`
|
|
117
|
+
})
|
|
118
|
+
});
|
|
119
|
+
} else {
|
|
120
|
+
if (!icon || typeof icon !== 'string') {
|
|
121
|
+
return null;
|
|
122
|
+
}
|
|
123
|
+
if (hideIconLoadingSkeleton) {
|
|
124
|
+
if (hasImageErrored) {
|
|
125
|
+
return errored;
|
|
126
|
+
}
|
|
127
|
+
return /*#__PURE__*/React.createElement("img", {
|
|
128
|
+
src: icon,
|
|
129
|
+
"data-testid": `${testId}-image`,
|
|
130
|
+
alt: "",
|
|
131
|
+
onError: () => setHasImageErrored(true),
|
|
132
|
+
className: ax(["_c71l7vkz _p12f7vkz _1bsb1osq", profileType && styles.roundImageStyle])
|
|
133
|
+
});
|
|
134
|
+
}
|
|
135
|
+
return /*#__PURE__*/React.createElement(ImageLoader, {
|
|
73
136
|
src: icon,
|
|
74
|
-
"
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
137
|
+
loaded: /*#__PURE__*/React.createElement("img", {
|
|
138
|
+
src: icon,
|
|
139
|
+
"data-testid": `${testId}-image`,
|
|
140
|
+
alt: "",
|
|
141
|
+
className: ax(["_c71l7vkz _p12f7vkz _1bsb1osq", profileType && styles.roundImageStyle])
|
|
142
|
+
}),
|
|
143
|
+
errored: errored,
|
|
144
|
+
loading: /*#__PURE__*/React.createElement(Shimmer, {
|
|
145
|
+
testId: `${testId}-loading`
|
|
146
|
+
})
|
|
78
147
|
});
|
|
79
148
|
}
|
|
80
|
-
return /*#__PURE__*/React.createElement(ImageLoader, {
|
|
81
|
-
src: icon,
|
|
82
|
-
loaded: /*#__PURE__*/React.createElement("img", {
|
|
83
|
-
src: icon,
|
|
84
|
-
"data-testid": `${testId}-image`,
|
|
85
|
-
alt: "",
|
|
86
|
-
className: ax(["_c71l7vkz _p12f7vkz _1bsb1osq", profileType && styles.roundImageStyle])
|
|
87
|
-
}),
|
|
88
|
-
errored: errored,
|
|
89
|
-
loading: /*#__PURE__*/React.createElement(Shimmer, {
|
|
90
|
-
testId: `${testId}-loading`
|
|
91
|
-
})
|
|
92
|
-
});
|
|
93
149
|
}, [icon, profileType, hideIconLoadingSkeleton, hasImageErrored]);
|
|
94
150
|
const renderIconPlaceholder = React.useCallback(testId => {
|
|
95
151
|
return defaultIcon || /*#__PURE__*/React.createElement(LinkIcon, {
|
|
@@ -12,7 +12,7 @@ import LinkWarningModal from './LinkWarningModal';
|
|
|
12
12
|
import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
|
|
13
13
|
const PACKAGE_DATA = {
|
|
14
14
|
packageName: "@atlaskit/smart-card",
|
|
15
|
-
packageVersion: "44.9.
|
|
15
|
+
packageVersion: "44.9.7",
|
|
16
16
|
componentName: 'linkUrl'
|
|
17
17
|
};
|
|
18
18
|
const Anchor = withLinkClickedEvent('a');
|
|
@@ -2,6 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
|
2
2
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
3
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
4
|
import { extractEntityIcon, isEntityPresent } from '@atlaskit/link-extractors';
|
|
5
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
5
6
|
import { IconType, SmartLinkStatus } from '../../../constants';
|
|
6
7
|
import extractIconRenderer from './extract-icon-renderer';
|
|
7
8
|
import extractJsonldDataIcon from './extract-jsonld-data-icon';
|
|
@@ -55,8 +56,17 @@ export var extractSmartLinkIcon = function extractSmartLinkIcon(response, render
|
|
|
55
56
|
if (!response || !(response !== null && response !== void 0 && response.data)) {
|
|
56
57
|
return undefined;
|
|
57
58
|
}
|
|
58
|
-
if (
|
|
59
|
-
|
|
59
|
+
if (fg('platform_lp_use_entity_icon_url_for_icon')) {
|
|
60
|
+
if (isEntityPresent(response)) {
|
|
61
|
+
var entityIcon = extractEntityIcon(response);
|
|
62
|
+
if (entityIcon) {
|
|
63
|
+
return entityIcon;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
} else {
|
|
67
|
+
if (isEntityPresent(response)) {
|
|
68
|
+
return extractEntityIcon(response);
|
|
69
|
+
}
|
|
60
70
|
}
|
|
61
71
|
return extractLinkIcon(response, renderers);
|
|
62
72
|
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { extractEntityProvider, extractProvider, extractSmartLinkTitle, extractSmartLinkUrl, extractType, isEntityPresent } from '@atlaskit/link-extractors';
|
|
1
|
+
import { extractEntityIcon, extractEntityProvider, extractProvider, extractSmartLinkTitle, extractSmartLinkUrl, extractType, isEntityPresent } from '@atlaskit/link-extractors';
|
|
2
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
2
3
|
import { getEmptyJsonLd } from '../../utils/jsonld';
|
|
3
4
|
import { extractIcon } from '../common/icon';
|
|
4
5
|
import { extractLozenge } from '../common/lozenge';
|
|
@@ -22,15 +23,16 @@ var extractInlineIcon = function extractInlineIcon(jsonLd) {
|
|
|
22
23
|
var extractSmartLinkInlineIcon = function extractSmartLinkInlineIcon(response) {
|
|
23
24
|
var showLabel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
24
25
|
if (isEntityPresent(response)) {
|
|
26
|
+
if (fg('platform_lp_use_entity_icon_url_for_icon')) {
|
|
27
|
+
var entityIcon = extractEntityIcon(response);
|
|
28
|
+
if (entityIcon) {
|
|
29
|
+
return [entityIcon.url, entityIcon.label];
|
|
30
|
+
}
|
|
31
|
+
}
|
|
25
32
|
var provider = extractEntityProvider(response);
|
|
26
33
|
if (provider) {
|
|
27
34
|
return provider.icon;
|
|
28
35
|
}
|
|
29
|
-
// We don't need this for design entities,
|
|
30
|
-
// but we can add it back when we support more entities
|
|
31
|
-
// it requires extractInlineIcon to be moved to the smart link extractor package.
|
|
32
|
-
// see: https://product-fabric.atlassian.net/browse/EDM-12375
|
|
33
|
-
// return extractSmartLinkIcon(response);
|
|
34
36
|
}
|
|
35
37
|
return extractInlineIcon((response === null || response === void 0 ? void 0 : response.data) || getEmptyJsonLd(), showLabel);
|
|
36
38
|
};
|
|
@@ -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: "44.9.
|
|
7
|
+
packageVersion: "44.9.7" || ''
|
|
8
8
|
};
|
|
9
9
|
export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
|
|
10
10
|
TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
3
|
import React from 'react';
|
|
3
4
|
import LinkGlyph from '@atlaskit/icon/core/link';
|
|
5
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
4
6
|
import { componentWithFG } from '@atlaskit/platform-feature-flags-react';
|
|
5
7
|
import { useThemeObserver } from '@atlaskit/tokens';
|
|
6
8
|
import { getPreviewUrlWithTheme, isProfileType } from '../../../utils';
|
|
@@ -102,6 +104,7 @@ var EmbedCardResolvedViewUpdated = /*#__PURE__*/React.forwardRef(function (_ref2
|
|
|
102
104
|
hideIconLoadingSkeleton = _ref2.hideIconLoadingSkeleton,
|
|
103
105
|
extensionKey = _ref2.extensionKey;
|
|
104
106
|
var iconFromContext = context === null || context === void 0 ? void 0 : context.icon;
|
|
107
|
+
var iconLabel = context === null || context === void 0 ? void 0 : context.iconLabel;
|
|
105
108
|
var src = typeof iconFromContext === 'string' ? iconFromContext : undefined;
|
|
106
109
|
var text = title || (context === null || context === void 0 ? void 0 : context.text);
|
|
107
110
|
var linkGlyph = React.useMemo(function () {
|
|
@@ -115,13 +118,16 @@ var EmbedCardResolvedViewUpdated = /*#__PURE__*/React.forwardRef(function (_ref2
|
|
|
115
118
|
if ( /*#__PURE__*/React.isValidElement(iconFromContext)) {
|
|
116
119
|
return iconFromContext;
|
|
117
120
|
}
|
|
118
|
-
return /*#__PURE__*/React.createElement(ImageIcon, {
|
|
119
|
-
src: src
|
|
121
|
+
return /*#__PURE__*/React.createElement(ImageIcon, _extends({
|
|
122
|
+
src: src
|
|
123
|
+
}, fg('platform_lp_use_entity_icon_url_for_icon') ? {
|
|
124
|
+
alt: iconLabel
|
|
125
|
+
} : undefined, {
|
|
120
126
|
default: linkGlyph,
|
|
121
127
|
appearance: isProfileType(type) ? 'round' : 'square',
|
|
122
128
|
hideLoadingSkeleton: hideIconLoadingSkeleton
|
|
123
|
-
});
|
|
124
|
-
}, [iconFromContext, src, linkGlyph, type, hideIconLoadingSkeleton]);
|
|
129
|
+
}));
|
|
130
|
+
}, [iconFromContext, src, linkGlyph, type, hideIconLoadingSkeleton, iconLabel]);
|
|
125
131
|
useEmbedResolvePostMessageListener({
|
|
126
132
|
url: link,
|
|
127
133
|
embedIframeRef: embedIframeRef
|