@atlaskit/media-card 82.2.14 → 82.3.1
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/AGENTS.md +10 -0
- package/CHANGELOG.md +20 -0
- package/dist/cjs/card/card.js +1 -1
- package/dist/cjs/card/cardView.js +4 -2
- package/dist/cjs/card/fileCard.js +34 -16
- package/dist/cjs/card/media-card-analytics-error-boundary.js +1 -1
- package/dist/cjs/inline/loader.js +1 -1
- package/dist/cjs/utils/ufoExperiences.js +1 -1
- package/dist/es2019/card/card.js +1 -1
- package/dist/es2019/card/cardView.js +3 -2
- package/dist/es2019/card/fileCard.js +34 -16
- package/dist/es2019/card/media-card-analytics-error-boundary.js +1 -1
- package/dist/es2019/inline/loader.js +1 -1
- package/dist/es2019/utils/ufoExperiences.js +1 -1
- package/dist/esm/card/card.js +1 -1
- package/dist/esm/card/cardView.js +4 -2
- package/dist/esm/card/fileCard.js +34 -16
- package/dist/esm/card/media-card-analytics-error-boundary.js +1 -1
- package/dist/esm/inline/loader.js +1 -1
- package/dist/esm/utils/ufoExperiences.js +1 -1
- package/dist/types/card/cardView.d.ts +3 -1
- package/dist/types/card/fileCard.d.ts +3 -1
- package/dist/types/types.d.ts +6 -0
- package/package.json +9 -6
package/AGENTS.md
CHANGED
|
@@ -51,3 +51,13 @@ first, edit, then `kg.py edit <path> --message "<reason>"`.
|
|
|
51
51
|
- Integration tests exist under `examples/Test-Integration-*.tsx`
|
|
52
52
|
- All new behaviour changes must be behind a feature gate (`fg()` from
|
|
53
53
|
`@atlaskit/platform-feature-flags`)
|
|
54
|
+
|
|
55
|
+
## Cards without Media reads
|
|
56
|
+
|
|
57
|
+
With `platform_media_upload_without_read` enabled, pass `skipRemoteFileState: true` to reuse
|
|
58
|
+
`FileCard` with cached file state and local blob previews. Missing cache entries never trigger
|
|
59
|
+
metadata requests, and pending preview processing does not leave uploads stuck in progress.
|
|
60
|
+
|
|
61
|
+
Remote SVG rendering, inline playback, built-in downloads and the Media Viewer are disabled. Custom
|
|
62
|
+
actions remain the caller's responsibility. With the prop absent or the gate off, the existing
|
|
63
|
+
remote flow is preserved.
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,25 @@
|
|
|
1
1
|
# @atlaskit/media-card
|
|
2
2
|
|
|
3
|
+
## 82.3.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 82.3.0
|
|
10
|
+
|
|
11
|
+
### Minor Changes
|
|
12
|
+
|
|
13
|
+
- [`9826a3254f648`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/9826a3254f648) -
|
|
14
|
+
Add `CardProps.skipRemoteFileState` behind `platform_media_upload_without_read` to reuse FileCard
|
|
15
|
+
with cached upload state and local blob previews, without fetching remote metadata or previews.
|
|
16
|
+
Remote SVG rendering, inline playback, built-in downloads and the Media Viewer remain disabled in
|
|
17
|
+
this mode.
|
|
18
|
+
|
|
19
|
+
### Patch Changes
|
|
20
|
+
|
|
21
|
+
- Updated dependencies
|
|
22
|
+
|
|
3
23
|
## 82.2.14
|
|
4
24
|
|
|
5
25
|
### Patch Changes
|
package/dist/cjs/card/card.js
CHANGED
|
@@ -8,7 +8,7 @@ var _reactIntl = require("react-intl");
|
|
|
8
8
|
var _withMediaAnalyticsContext = require("@atlaskit/media-common/withMediaAnalyticsContext");
|
|
9
9
|
var _CardWithPerformanceObserver = require("./CardWithPerformanceObserver");
|
|
10
10
|
var packageName = "@atlaskit/media-card";
|
|
11
|
-
var packageVersion = "82.
|
|
11
|
+
var packageVersion = "82.3.0";
|
|
12
12
|
var Card = exports.Card = (0, _withMediaAnalyticsContext.withMediaAnalyticsContext)({
|
|
13
13
|
packageVersion: packageVersion,
|
|
14
14
|
packageName: packageName,
|
|
@@ -87,6 +87,8 @@ var CardViewBase = exports.CardViewBase = function CardViewBase(_ref) {
|
|
|
87
87
|
forceSyncDisplay = _ref.forceSyncDisplay,
|
|
88
88
|
actions = _ref.actions,
|
|
89
89
|
disableOverlay = _ref.disableOverlay,
|
|
90
|
+
_ref$disablePreview = _ref.disablePreview,
|
|
91
|
+
disablePreview = _ref$disablePreview === void 0 ? false : _ref$disablePreview,
|
|
90
92
|
titleBoxBgColor = _ref.titleBoxBgColor,
|
|
91
93
|
titleBoxIcon = _ref.titleBoxIcon,
|
|
92
94
|
error = _ref.error,
|
|
@@ -170,8 +172,8 @@ var CardViewBase = exports.CardViewBase = function CardViewBase(_ref) {
|
|
|
170
172
|
var isZeroSize = metadata && metadata.size === 0;
|
|
171
173
|
var defaultConfig = {
|
|
172
174
|
renderTypeIcon: !didImageRender && !didSvgRender,
|
|
173
|
-
renderImageRenderer: !didSvgRender,
|
|
174
|
-
renderSvgView: mimeType === 'image/svg+xml',
|
|
175
|
+
renderImageRenderer: !disablePreview && !didSvgRender,
|
|
176
|
+
renderSvgView: !disablePreview && mimeType === 'image/svg+xml',
|
|
175
177
|
renderPlayButton: !!cardPreview && mediaType === 'video',
|
|
176
178
|
renderBlanket: !disableOverlay,
|
|
177
179
|
renderTitleBox: !disableOverlay,
|
|
@@ -90,9 +90,10 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
90
90
|
contextId = _ref.contextId,
|
|
91
91
|
alt = _ref.alt,
|
|
92
92
|
actions = _ref.actions,
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
93
|
+
enableDownloadButton = _ref.shouldEnableDownloadButton,
|
|
94
|
+
enableInlinePlayer = _ref.useInlinePlayer,
|
|
95
|
+
enableMediaViewer = _ref.shouldOpenMediaViewer,
|
|
96
|
+
skipRemoteFileStateProp = _ref.skipRemoteFileState,
|
|
96
97
|
onFullscreenChange = _ref.onFullscreenChange,
|
|
97
98
|
selectable = _ref.selectable,
|
|
98
99
|
selected = _ref.selected,
|
|
@@ -118,6 +119,10 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
118
119
|
onError = _ref.onError,
|
|
119
120
|
mediaViewerExtensions = _ref.mediaViewerExtensions,
|
|
120
121
|
fallbackMediaNameFetcher = _ref.fallbackMediaNameFetcher;
|
|
122
|
+
var skipRemoteFileState = (0, _fg.fg)('platform_media_upload_without_read') && Boolean(skipRemoteFileStateProp);
|
|
123
|
+
var shouldEnableDownloadButton = !skipRemoteFileState && enableDownloadButton;
|
|
124
|
+
var useInlinePlayer = !skipRemoteFileState && enableInlinePlayer;
|
|
125
|
+
var shouldOpenMediaViewer = !skipRemoteFileState && enableMediaViewer;
|
|
121
126
|
var _useIntl = (0, _reactIntl.useIntl)(),
|
|
122
127
|
formatMessage = _useIntl.formatMessage;
|
|
123
128
|
var _useState = (0, _react.useState)(false),
|
|
@@ -165,7 +170,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
165
170
|
return (0, _fg.fg)('platform_media_ssr_data_seed') ? ssrFileState !== null && ssrFileState !== void 0 ? ssrFileState : (0, _ssrMediaItem.mapSsrMediaItemToFileState)(ssrMediaItem) : undefined;
|
|
166
171
|
}, [ssrFileState, ssrMediaItem]);
|
|
167
172
|
var _useFileState = (0, _useFileState2.useFileState)(identifier.id, {
|
|
168
|
-
skipRemote: !isCardVisible,
|
|
173
|
+
skipRemote: skipRemoteFileState || !isCardVisible,
|
|
169
174
|
collectionName: identifier.collectionName,
|
|
170
175
|
occurrenceKey: identifier.occurrenceKey,
|
|
171
176
|
includeHashForDuplicateFiles: includeHashForDuplicateFiles,
|
|
@@ -192,7 +197,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
192
197
|
fallbackMediaNameFetchAttempted.current = false;
|
|
193
198
|
setFallbackMediaName(undefined);
|
|
194
199
|
lastFetchedFileId.current = currentId;
|
|
195
|
-
if (fileStateValue && !fileStateValue.name && fallbackMediaNameFetcher && !fallbackMediaNameFetchAttempted.current) {
|
|
200
|
+
if (!skipRemoteFileState && fileStateValue && !fileStateValue.name && fallbackMediaNameFetcher && !fallbackMediaNameFetchAttempted.current) {
|
|
196
201
|
fallbackMediaNameFetchAttempted.current = true;
|
|
197
202
|
fallbackMediaNameFetcher(fileStateValue.id).then(function (name) {
|
|
198
203
|
setFallbackMediaName(name);
|
|
@@ -200,7 +205,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
200
205
|
// Silently ignore fetch failures
|
|
201
206
|
});
|
|
202
207
|
}
|
|
203
|
-
}, [fileStateValue, fallbackMediaNameFetcher]);
|
|
208
|
+
}, [fileStateValue, fallbackMediaNameFetcher, skipRemoteFileState]);
|
|
204
209
|
var dateOverrides = (0, _react.useContext)(_dateOverrideContext.DateOverrideContext);
|
|
205
210
|
var overridenDate = dateOverrides === null || dateOverrides === void 0 ? void 0 : dateOverrides[identifier.id];
|
|
206
211
|
|
|
@@ -262,13 +267,13 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
262
267
|
mediaBlobUrlAttrs: mediaBlobUrlAttrs,
|
|
263
268
|
resizeMode: (0, _imageResizeModeToFileImageMode.imageResizeModeToFileImageMode)(resizeMode),
|
|
264
269
|
identifier: identifier,
|
|
265
|
-
ssr: ssr,
|
|
270
|
+
ssr: skipRemoteFileState ? undefined : ssr,
|
|
266
271
|
dimensions: previewDimensions,
|
|
267
272
|
traceContext: traceContext,
|
|
268
|
-
skipRemote: !isCardVisible,
|
|
273
|
+
skipRemote: skipRemoteFileState || !isCardVisible,
|
|
269
274
|
source: 'mediaCard'
|
|
270
275
|
}),
|
|
271
|
-
|
|
276
|
+
cachedPreview = _useFilePreview.preview,
|
|
272
277
|
previewStatus = _useFilePreview.status,
|
|
273
278
|
previewError = _useFilePreview.error,
|
|
274
279
|
nonCriticalError = _useFilePreview.nonCriticalError,
|
|
@@ -277,6 +282,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
277
282
|
onImageLoadBase = _useFilePreview.onImageLoad,
|
|
278
283
|
getSsrScriptProps = _useFilePreview.getSsrScriptProps,
|
|
279
284
|
copyNodeRef = _useFilePreview.copyNodeRef;
|
|
285
|
+
var preview = !skipRemoteFileState || (cachedPreview === null || cachedPreview === void 0 ? void 0 : cachedPreview.source) === 'local' || (cachedPreview === null || cachedPreview === void 0 ? void 0 : cachedPreview.source) === 'cache-local' ? cachedPreview : undefined;
|
|
280
286
|
var shouldSendPerformanceEvent = (0, _react.useMemo)(function () {
|
|
281
287
|
return (0, _ufoExperiences.shouldPerformanceBeSampled)();
|
|
282
288
|
}, []);
|
|
@@ -292,7 +298,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
292
298
|
setError = _useState16[1];
|
|
293
299
|
|
|
294
300
|
// CXP-2723 TODO: TEMPORARY VARIABLES
|
|
295
|
-
var finalError = error || (previewError && previewError.primaryReason !== 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) !== 'image/svg+xml' ? previewError : undefined);
|
|
301
|
+
var finalError = error || (!skipRemoteFileState && previewError && previewError.primaryReason !== 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) !== 'image/svg+xml' ? previewError : undefined);
|
|
296
302
|
var finalStatus = finalError ? 'error' : status === 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) === 'image/svg+xml' ? 'loading-preview' : status;
|
|
297
303
|
|
|
298
304
|
// Experiment gate for the Confluence comments-in-media-viewer work. Only the
|
|
@@ -305,7 +311,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
305
311
|
onSelectedItemChange = _ref2.onSelectedItemChange;
|
|
306
312
|
var _useState17 = (0, _react.useState)(function () {
|
|
307
313
|
var _getMediaViewerSelect;
|
|
308
|
-
return (_getMediaViewerSelect = getMediaViewerSelectedItem === null || getMediaViewerSelectedItem === void 0 ? void 0 : getMediaViewerSelectedItem(identifier)) !== null && _getMediaViewerSelect !== void 0 ? _getMediaViewerSelect : null;
|
|
314
|
+
return skipRemoteFileState ? null : (_getMediaViewerSelect = getMediaViewerSelectedItem === null || getMediaViewerSelectedItem === void 0 ? void 0 : getMediaViewerSelectedItem(identifier)) !== null && _getMediaViewerSelect !== void 0 ? _getMediaViewerSelect : null;
|
|
309
315
|
}),
|
|
310
316
|
_useState18 = (0, _slicedToArray2.default)(_useState17, 2),
|
|
311
317
|
mediaViewerSelectedItem = _useState18[0],
|
|
@@ -405,7 +411,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
405
411
|
}, _callee, null, [[0, 2]]);
|
|
406
412
|
})), [createAnalyticsEvent, fileAttributes, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.metadataTraceContext, identifier.collectionName, identifier.id, mediaClient.file, metadata.name, traceContext]);
|
|
407
413
|
var computedActions = (0, _react.useMemo)(function () {
|
|
408
|
-
if (finalStatus === 'failed-processing' || shouldEnableDownloadButton) {
|
|
414
|
+
if (!skipRemoteFileState && (finalStatus === 'failed-processing' || shouldEnableDownloadButton)) {
|
|
409
415
|
var handler = /*#__PURE__*/function () {
|
|
410
416
|
var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
|
|
411
417
|
return _regenerator.default.wrap(function (_context2) {
|
|
@@ -439,7 +445,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
439
445
|
} else {
|
|
440
446
|
return actions;
|
|
441
447
|
}
|
|
442
|
-
}, [actions, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, downloadFn]);
|
|
448
|
+
}, [actions, skipRemoteFileState, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, downloadFn]);
|
|
443
449
|
|
|
444
450
|
//----------------------------------------------------------------//
|
|
445
451
|
//---------------------- Analytics ------------------------------//
|
|
@@ -690,8 +696,19 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
690
696
|
var updateFileStateRef = (0, _useCurrentValueRef.useCurrentValueRef)(function () {
|
|
691
697
|
// This effect has race condition with Complete effect. We share the same check to ovid status overrides
|
|
692
698
|
|
|
699
|
+
if (skipRemoteFileState && !fileState) {
|
|
700
|
+
setStatus('loading');
|
|
701
|
+
uploadProgressRef.current = undefined;
|
|
702
|
+
return;
|
|
703
|
+
}
|
|
704
|
+
if (skipRemoteFileState && fileState && fileState.status !== 'error') {
|
|
705
|
+
setStatus(fileState.status === 'uploading' ? 'uploading' : 'complete');
|
|
706
|
+
uploadProgressRef.current = fileState.status === 'uploading' ? fileState.progress : 1;
|
|
707
|
+
return;
|
|
708
|
+
}
|
|
709
|
+
|
|
693
710
|
// do not update the card status if the status is final
|
|
694
|
-
if (['complete', 'error', 'failed-processing'].includes(finalStatus)) {
|
|
711
|
+
if (!skipRemoteFileState && ['complete', 'error', 'failed-processing'].includes(finalStatus)) {
|
|
695
712
|
return;
|
|
696
713
|
}
|
|
697
714
|
if (previewDidRender &&
|
|
@@ -724,7 +741,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
724
741
|
uploadProgressRef.current = newProgress;
|
|
725
742
|
} else {
|
|
726
743
|
var e = (0, _mediaClient.toCommonMediaClientError)(fileState);
|
|
727
|
-
var errorReason = finalStatus === 'uploading' ? 'upload' : 'metadata-fetch';
|
|
744
|
+
var errorReason = skipRemoteFileState || finalStatus === 'uploading' ? 'upload' : 'metadata-fetch';
|
|
728
745
|
setError(new _MediaCardError.MediaCardError(errorReason, e));
|
|
729
746
|
setStatus('error');
|
|
730
747
|
}
|
|
@@ -806,6 +823,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
806
823
|
error: finalError,
|
|
807
824
|
mediaItemType: mediaItemType,
|
|
808
825
|
metadata: metadata,
|
|
826
|
+
disablePreview: skipRemoteFileState && metadata.mimeType === 'image/svg+xml',
|
|
809
827
|
cardPreview: preview,
|
|
810
828
|
alt: alt,
|
|
811
829
|
resizeMode: resizeMode,
|
|
@@ -888,7 +906,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
888
906
|
testId: testId,
|
|
889
907
|
cardPreview: preview,
|
|
890
908
|
videoControlsWrapperRef: videoControlsWrapperRef
|
|
891
|
-
})) : renderCard(), mediaViewerSelectedItem ? /*#__PURE__*/_react.default.createElement(_mediaViewerLoader.default, {
|
|
909
|
+
})) : renderCard(), !skipRemoteFileState && mediaViewerSelectedItem ? /*#__PURE__*/_react.default.createElement(_mediaViewerLoader.default, {
|
|
892
910
|
collectionName: collectionName,
|
|
893
911
|
items: mediaViewerItems || [],
|
|
894
912
|
mediaClientConfig: mediaClient.config,
|
|
@@ -87,7 +87,7 @@ var WrappedMediaCardAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Compo
|
|
|
87
87
|
}(_react.default.Component);
|
|
88
88
|
(0, _defineProperty2.default)(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
|
|
89
89
|
var packageName = "@atlaskit/media-card";
|
|
90
|
-
var packageVersion = "82.
|
|
90
|
+
var packageVersion = "82.3.0";
|
|
91
91
|
|
|
92
92
|
// @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
|
|
93
93
|
var MediaCardAnalyticsErrorBoundary = (0, _withMediaAnalyticsContext.withMediaAnalyticsContext)({
|
|
@@ -116,7 +116,7 @@ var MediaInlineCardLoader = exports.default = /*#__PURE__*/function (_React$Pure
|
|
|
116
116
|
ErrorBoundary = _this$state.ErrorBoundary;
|
|
117
117
|
var analyticsContext = {
|
|
118
118
|
packageVersion: "@atlaskit/media-card",
|
|
119
|
-
packageName: "82.
|
|
119
|
+
packageName: "82.3.0",
|
|
120
120
|
componentName: 'mediaInlineCard',
|
|
121
121
|
component: 'mediaInlineCard'
|
|
122
122
|
};
|
|
@@ -23,7 +23,7 @@ var _getMediaGlobalScope = require("./globalScope/getMediaGlobalScope");
|
|
|
23
23
|
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; }
|
|
24
24
|
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) { (0, _defineProperty2.default)(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; }
|
|
25
25
|
var packageName = "@atlaskit/media-card";
|
|
26
|
-
var packageVersion = "82.
|
|
26
|
+
var packageVersion = "82.3.0";
|
|
27
27
|
var SAMPLE_RATE = 0.05;
|
|
28
28
|
|
|
29
29
|
/**
|
package/dist/es2019/card/card.js
CHANGED
|
@@ -2,7 +2,7 @@ import { injectIntl } from 'react-intl';
|
|
|
2
2
|
import { withMediaAnalyticsContext } from '@atlaskit/media-common/withMediaAnalyticsContext';
|
|
3
3
|
import { CardWithPerformanceObserver } from './CardWithPerformanceObserver';
|
|
4
4
|
const packageName = "@atlaskit/media-card";
|
|
5
|
-
const packageVersion = "82.
|
|
5
|
+
const packageVersion = "82.3.0";
|
|
6
6
|
export const Card = withMediaAnalyticsContext({
|
|
7
7
|
packageVersion,
|
|
8
8
|
packageName,
|
|
@@ -73,6 +73,7 @@ export const CardViewBase = ({
|
|
|
73
73
|
forceSyncDisplay,
|
|
74
74
|
actions,
|
|
75
75
|
disableOverlay,
|
|
76
|
+
disablePreview = false,
|
|
76
77
|
titleBoxBgColor,
|
|
77
78
|
titleBoxIcon,
|
|
78
79
|
error,
|
|
@@ -152,8 +153,8 @@ export const CardViewBase = ({
|
|
|
152
153
|
const isZeroSize = metadata && metadata.size === 0;
|
|
153
154
|
const defaultConfig = {
|
|
154
155
|
renderTypeIcon: !didImageRender && !didSvgRender,
|
|
155
|
-
renderImageRenderer: !didSvgRender,
|
|
156
|
-
renderSvgView: mimeType === 'image/svg+xml',
|
|
156
|
+
renderImageRenderer: !disablePreview && !didSvgRender,
|
|
157
|
+
renderSvgView: !disablePreview && mimeType === 'image/svg+xml',
|
|
157
158
|
renderPlayButton: !!cardPreview && mediaType === 'video',
|
|
158
159
|
renderBlanket: !disableOverlay,
|
|
159
160
|
renderTitleBox: !disableOverlay,
|
|
@@ -71,9 +71,10 @@ export const FileCard = ({
|
|
|
71
71
|
contextId,
|
|
72
72
|
alt,
|
|
73
73
|
actions,
|
|
74
|
-
shouldEnableDownloadButton,
|
|
75
|
-
useInlinePlayer,
|
|
76
|
-
shouldOpenMediaViewer,
|
|
74
|
+
shouldEnableDownloadButton: enableDownloadButton,
|
|
75
|
+
useInlinePlayer: enableInlinePlayer,
|
|
76
|
+
shouldOpenMediaViewer: enableMediaViewer,
|
|
77
|
+
skipRemoteFileState: skipRemoteFileStateProp,
|
|
77
78
|
onFullscreenChange,
|
|
78
79
|
selectable,
|
|
79
80
|
selected,
|
|
@@ -100,6 +101,10 @@ export const FileCard = ({
|
|
|
100
101
|
mediaViewerExtensions,
|
|
101
102
|
fallbackMediaNameFetcher
|
|
102
103
|
}) => {
|
|
104
|
+
const skipRemoteFileState = fg('platform_media_upload_without_read') && Boolean(skipRemoteFileStateProp);
|
|
105
|
+
const shouldEnableDownloadButton = !skipRemoteFileState && enableDownloadButton;
|
|
106
|
+
const useInlinePlayer = !skipRemoteFileState && enableInlinePlayer;
|
|
107
|
+
const shouldOpenMediaViewer = !skipRemoteFileState && enableMediaViewer;
|
|
103
108
|
const {
|
|
104
109
|
formatMessage
|
|
105
110
|
} = useIntl();
|
|
@@ -137,7 +142,7 @@ export const FileCard = ({
|
|
|
137
142
|
const {
|
|
138
143
|
fileState
|
|
139
144
|
} = useFileState(identifier.id, {
|
|
140
|
-
skipRemote: !isCardVisible,
|
|
145
|
+
skipRemote: skipRemoteFileState || !isCardVisible,
|
|
141
146
|
collectionName: identifier.collectionName,
|
|
142
147
|
occurrenceKey: identifier.occurrenceKey,
|
|
143
148
|
includeHashForDuplicateFiles,
|
|
@@ -160,7 +165,7 @@ export const FileCard = ({
|
|
|
160
165
|
fallbackMediaNameFetchAttempted.current = false;
|
|
161
166
|
setFallbackMediaName(undefined);
|
|
162
167
|
lastFetchedFileId.current = currentId;
|
|
163
|
-
if (fileStateValue && !fileStateValue.name && fallbackMediaNameFetcher && !fallbackMediaNameFetchAttempted.current) {
|
|
168
|
+
if (!skipRemoteFileState && fileStateValue && !fileStateValue.name && fallbackMediaNameFetcher && !fallbackMediaNameFetchAttempted.current) {
|
|
164
169
|
fallbackMediaNameFetchAttempted.current = true;
|
|
165
170
|
fallbackMediaNameFetcher(fileStateValue.id).then(name => {
|
|
166
171
|
setFallbackMediaName(name);
|
|
@@ -168,7 +173,7 @@ export const FileCard = ({
|
|
|
168
173
|
// Silently ignore fetch failures
|
|
169
174
|
});
|
|
170
175
|
}
|
|
171
|
-
}, [fileStateValue, fallbackMediaNameFetcher]);
|
|
176
|
+
}, [fileStateValue, fallbackMediaNameFetcher, skipRemoteFileState]);
|
|
172
177
|
const dateOverrides = useContext(DateOverrideContext);
|
|
173
178
|
const overridenDate = dateOverrides === null || dateOverrides === void 0 ? void 0 : dateOverrides[identifier.id];
|
|
174
179
|
|
|
@@ -212,7 +217,7 @@ export const FileCard = ({
|
|
|
212
217
|
} : undefined;
|
|
213
218
|
}, [alt, previewDimensions, contextId, fileStateValue, identifier, originalDimensions]);
|
|
214
219
|
const {
|
|
215
|
-
preview,
|
|
220
|
+
preview: cachedPreview,
|
|
216
221
|
status: previewStatus,
|
|
217
222
|
error: previewError,
|
|
218
223
|
nonCriticalError,
|
|
@@ -227,12 +232,13 @@ export const FileCard = ({
|
|
|
227
232
|
mediaBlobUrlAttrs,
|
|
228
233
|
resizeMode: imageResizeModeToFileImageMode(resizeMode),
|
|
229
234
|
identifier,
|
|
230
|
-
ssr,
|
|
235
|
+
ssr: skipRemoteFileState ? undefined : ssr,
|
|
231
236
|
dimensions: previewDimensions,
|
|
232
237
|
traceContext,
|
|
233
|
-
skipRemote: !isCardVisible,
|
|
238
|
+
skipRemote: skipRemoteFileState || !isCardVisible,
|
|
234
239
|
source: 'mediaCard'
|
|
235
240
|
});
|
|
241
|
+
const preview = !skipRemoteFileState || (cachedPreview === null || cachedPreview === void 0 ? void 0 : cachedPreview.source) === 'local' || (cachedPreview === null || cachedPreview === void 0 ? void 0 : cachedPreview.source) === 'cache-local' ? cachedPreview : undefined;
|
|
236
242
|
const shouldSendPerformanceEvent = useMemo(() => shouldPerformanceBeSampled(), []);
|
|
237
243
|
|
|
238
244
|
// UFO experience hook - creates a unique experience instance per card
|
|
@@ -243,7 +249,7 @@ export const FileCard = ({
|
|
|
243
249
|
const [error, setError] = useState();
|
|
244
250
|
|
|
245
251
|
// CXP-2723 TODO: TEMPORARY VARIABLES
|
|
246
|
-
const finalError = error || (previewError && previewError.primaryReason !== 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) !== 'image/svg+xml' ? previewError : undefined);
|
|
252
|
+
const finalError = error || (!skipRemoteFileState && previewError && previewError.primaryReason !== 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) !== 'image/svg+xml' ? previewError : undefined);
|
|
247
253
|
const finalStatus = finalError ? 'error' : status === 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) === 'image/svg+xml' ? 'loading-preview' : status;
|
|
248
254
|
|
|
249
255
|
// Experiment gate for the Confluence comments-in-media-viewer work. Only the
|
|
@@ -257,7 +263,7 @@ export const FileCard = ({
|
|
|
257
263
|
} = isExperimentEnabled('cc_comments_media_viewer_sidebar') ? mediaViewerExtensions !== null && mediaViewerExtensions !== void 0 ? mediaViewerExtensions : {} : {};
|
|
258
264
|
const [mediaViewerSelectedItem, setMediaViewerSelectedItem] = useState(() => {
|
|
259
265
|
var _getMediaViewerSelect;
|
|
260
|
-
return (_getMediaViewerSelect = getMediaViewerSelectedItem === null || getMediaViewerSelectedItem === void 0 ? void 0 : getMediaViewerSelectedItem(identifier)) !== null && _getMediaViewerSelect !== void 0 ? _getMediaViewerSelect : null;
|
|
266
|
+
return skipRemoteFileState ? null : (_getMediaViewerSelect = getMediaViewerSelectedItem === null || getMediaViewerSelectedItem === void 0 ? void 0 : getMediaViewerSelectedItem(identifier)) !== null && _getMediaViewerSelect !== void 0 ? _getMediaViewerSelect : null;
|
|
261
267
|
});
|
|
262
268
|
const openMediaViewer = useCallback(() => {
|
|
263
269
|
setMediaViewerSelectedItem(identifier);
|
|
@@ -340,7 +346,7 @@ export const FileCard = ({
|
|
|
340
346
|
}
|
|
341
347
|
}, [createAnalyticsEvent, fileAttributes, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.metadataTraceContext, identifier.collectionName, identifier.id, mediaClient.file, metadata.name, traceContext]);
|
|
342
348
|
const computedActions = useMemo(() => {
|
|
343
|
-
if (finalStatus === 'failed-processing' || shouldEnableDownloadButton) {
|
|
349
|
+
if (!skipRemoteFileState && (finalStatus === 'failed-processing' || shouldEnableDownloadButton)) {
|
|
344
350
|
const handler = async () => {
|
|
345
351
|
if (!!(fileStateValue !== null && fileStateValue !== void 0 && fileStateValue.abuseClassification)) {
|
|
346
352
|
setIsAbuseModalOpen(true);
|
|
@@ -356,7 +362,7 @@ export const FileCard = ({
|
|
|
356
362
|
} else {
|
|
357
363
|
return actions;
|
|
358
364
|
}
|
|
359
|
-
}, [actions, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, downloadFn]);
|
|
365
|
+
}, [actions, skipRemoteFileState, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, downloadFn]);
|
|
360
366
|
|
|
361
367
|
//----------------------------------------------------------------//
|
|
362
368
|
//---------------------- Analytics ------------------------------//
|
|
@@ -606,8 +612,19 @@ export const FileCard = ({
|
|
|
606
612
|
const updateFileStateRef = useCurrentValueRef(() => {
|
|
607
613
|
// This effect has race condition with Complete effect. We share the same check to ovid status overrides
|
|
608
614
|
|
|
615
|
+
if (skipRemoteFileState && !fileState) {
|
|
616
|
+
setStatus('loading');
|
|
617
|
+
uploadProgressRef.current = undefined;
|
|
618
|
+
return;
|
|
619
|
+
}
|
|
620
|
+
if (skipRemoteFileState && fileState && fileState.status !== 'error') {
|
|
621
|
+
setStatus(fileState.status === 'uploading' ? 'uploading' : 'complete');
|
|
622
|
+
uploadProgressRef.current = fileState.status === 'uploading' ? fileState.progress : 1;
|
|
623
|
+
return;
|
|
624
|
+
}
|
|
625
|
+
|
|
609
626
|
// do not update the card status if the status is final
|
|
610
|
-
if (['complete', 'error', 'failed-processing'].includes(finalStatus)) {
|
|
627
|
+
if (!skipRemoteFileState && ['complete', 'error', 'failed-processing'].includes(finalStatus)) {
|
|
611
628
|
return;
|
|
612
629
|
}
|
|
613
630
|
if (previewDidRender &&
|
|
@@ -640,7 +657,7 @@ export const FileCard = ({
|
|
|
640
657
|
uploadProgressRef.current = newProgress;
|
|
641
658
|
} else {
|
|
642
659
|
const e = toCommonMediaClientError(fileState);
|
|
643
|
-
const errorReason = finalStatus === 'uploading' ? 'upload' : 'metadata-fetch';
|
|
660
|
+
const errorReason = skipRemoteFileState || finalStatus === 'uploading' ? 'upload' : 'metadata-fetch';
|
|
644
661
|
setError(new MediaCardError(errorReason, e));
|
|
645
662
|
setStatus('error');
|
|
646
663
|
}
|
|
@@ -717,6 +734,7 @@ export const FileCard = ({
|
|
|
717
734
|
error: finalError,
|
|
718
735
|
mediaItemType: mediaItemType,
|
|
719
736
|
metadata: metadata,
|
|
737
|
+
disablePreview: skipRemoteFileState && metadata.mimeType === 'image/svg+xml',
|
|
720
738
|
cardPreview: preview,
|
|
721
739
|
alt: alt,
|
|
722
740
|
resizeMode: resizeMode,
|
|
@@ -798,7 +816,7 @@ export const FileCard = ({
|
|
|
798
816
|
testId: testId,
|
|
799
817
|
cardPreview: preview,
|
|
800
818
|
videoControlsWrapperRef: videoControlsWrapperRef
|
|
801
|
-
})) : renderCard(), mediaViewerSelectedItem ? /*#__PURE__*/React.createElement(MediaViewer, {
|
|
819
|
+
})) : renderCard(), !skipRemoteFileState && mediaViewerSelectedItem ? /*#__PURE__*/React.createElement(MediaViewer, {
|
|
802
820
|
collectionName: collectionName,
|
|
803
821
|
items: mediaViewerItems || [],
|
|
804
822
|
mediaClientConfig: mediaClient.config,
|
|
@@ -66,7 +66,7 @@ class WrappedMediaCardAnalyticsErrorBoundary extends React.Component {
|
|
|
66
66
|
}
|
|
67
67
|
_defineProperty(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
|
|
68
68
|
const packageName = "@atlaskit/media-card";
|
|
69
|
-
const packageVersion = "82.
|
|
69
|
+
const packageVersion = "82.3.0";
|
|
70
70
|
|
|
71
71
|
// @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
|
|
72
72
|
const MediaCardAnalyticsErrorBoundary = withMediaAnalyticsContext({
|
|
@@ -37,7 +37,7 @@ export default class MediaInlineCardLoader extends React.PureComponent {
|
|
|
37
37
|
} = this.state;
|
|
38
38
|
const analyticsContext = {
|
|
39
39
|
packageVersion: "@atlaskit/media-card",
|
|
40
|
-
packageName: "82.
|
|
40
|
+
packageName: "82.3.0",
|
|
41
41
|
componentName: 'mediaInlineCard',
|
|
42
42
|
component: 'mediaInlineCard'
|
|
43
43
|
};
|
|
@@ -12,7 +12,7 @@ import { extractErrorInfo } from './analytics/extractErrorInfo';
|
|
|
12
12
|
import { getRenderErrorRequestMetadata } from './analytics/getRenderErrorRequestMetadata';
|
|
13
13
|
import { getMediaGlobalScope } from './globalScope/getMediaGlobalScope';
|
|
14
14
|
const packageName = "@atlaskit/media-card";
|
|
15
|
-
const packageVersion = "82.
|
|
15
|
+
const packageVersion = "82.3.0";
|
|
16
16
|
const SAMPLE_RATE = 0.05;
|
|
17
17
|
|
|
18
18
|
/**
|
package/dist/esm/card/card.js
CHANGED
|
@@ -2,7 +2,7 @@ import { injectIntl } from 'react-intl';
|
|
|
2
2
|
import { withMediaAnalyticsContext } from '@atlaskit/media-common/withMediaAnalyticsContext';
|
|
3
3
|
import { CardWithPerformanceObserver } from './CardWithPerformanceObserver';
|
|
4
4
|
var packageName = "@atlaskit/media-card";
|
|
5
|
-
var packageVersion = "82.
|
|
5
|
+
var packageVersion = "82.3.0";
|
|
6
6
|
export var Card = withMediaAnalyticsContext({
|
|
7
7
|
packageVersion: packageVersion,
|
|
8
8
|
packageName: packageName,
|
|
@@ -78,6 +78,8 @@ export var CardViewBase = function CardViewBase(_ref) {
|
|
|
78
78
|
forceSyncDisplay = _ref.forceSyncDisplay,
|
|
79
79
|
actions = _ref.actions,
|
|
80
80
|
disableOverlay = _ref.disableOverlay,
|
|
81
|
+
_ref$disablePreview = _ref.disablePreview,
|
|
82
|
+
disablePreview = _ref$disablePreview === void 0 ? false : _ref$disablePreview,
|
|
81
83
|
titleBoxBgColor = _ref.titleBoxBgColor,
|
|
82
84
|
titleBoxIcon = _ref.titleBoxIcon,
|
|
83
85
|
error = _ref.error,
|
|
@@ -161,8 +163,8 @@ export var CardViewBase = function CardViewBase(_ref) {
|
|
|
161
163
|
var isZeroSize = metadata && metadata.size === 0;
|
|
162
164
|
var defaultConfig = {
|
|
163
165
|
renderTypeIcon: !didImageRender && !didSvgRender,
|
|
164
|
-
renderImageRenderer: !didSvgRender,
|
|
165
|
-
renderSvgView: mimeType === 'image/svg+xml',
|
|
166
|
+
renderImageRenderer: !disablePreview && !didSvgRender,
|
|
167
|
+
renderSvgView: !disablePreview && mimeType === 'image/svg+xml',
|
|
166
168
|
renderPlayButton: !!cardPreview && mediaType === 'video',
|
|
167
169
|
renderBlanket: !disableOverlay,
|
|
168
170
|
renderTitleBox: !disableOverlay,
|
|
@@ -82,9 +82,10 @@ export var FileCard = function FileCard(_ref) {
|
|
|
82
82
|
contextId = _ref.contextId,
|
|
83
83
|
alt = _ref.alt,
|
|
84
84
|
actions = _ref.actions,
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
85
|
+
enableDownloadButton = _ref.shouldEnableDownloadButton,
|
|
86
|
+
enableInlinePlayer = _ref.useInlinePlayer,
|
|
87
|
+
enableMediaViewer = _ref.shouldOpenMediaViewer,
|
|
88
|
+
skipRemoteFileStateProp = _ref.skipRemoteFileState,
|
|
88
89
|
onFullscreenChange = _ref.onFullscreenChange,
|
|
89
90
|
selectable = _ref.selectable,
|
|
90
91
|
selected = _ref.selected,
|
|
@@ -110,6 +111,10 @@ export var FileCard = function FileCard(_ref) {
|
|
|
110
111
|
onError = _ref.onError,
|
|
111
112
|
mediaViewerExtensions = _ref.mediaViewerExtensions,
|
|
112
113
|
fallbackMediaNameFetcher = _ref.fallbackMediaNameFetcher;
|
|
114
|
+
var skipRemoteFileState = fg('platform_media_upload_without_read') && Boolean(skipRemoteFileStateProp);
|
|
115
|
+
var shouldEnableDownloadButton = !skipRemoteFileState && enableDownloadButton;
|
|
116
|
+
var useInlinePlayer = !skipRemoteFileState && enableInlinePlayer;
|
|
117
|
+
var shouldOpenMediaViewer = !skipRemoteFileState && enableMediaViewer;
|
|
113
118
|
var _useIntl = useIntl(),
|
|
114
119
|
formatMessage = _useIntl.formatMessage;
|
|
115
120
|
var _useState = useState(false),
|
|
@@ -157,7 +162,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
157
162
|
return fg('platform_media_ssr_data_seed') ? ssrFileState !== null && ssrFileState !== void 0 ? ssrFileState : mapSsrMediaItemToFileState(ssrMediaItem) : undefined;
|
|
158
163
|
}, [ssrFileState, ssrMediaItem]);
|
|
159
164
|
var _useFileState = useFileState(identifier.id, {
|
|
160
|
-
skipRemote: !isCardVisible,
|
|
165
|
+
skipRemote: skipRemoteFileState || !isCardVisible,
|
|
161
166
|
collectionName: identifier.collectionName,
|
|
162
167
|
occurrenceKey: identifier.occurrenceKey,
|
|
163
168
|
includeHashForDuplicateFiles: includeHashForDuplicateFiles,
|
|
@@ -184,7 +189,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
184
189
|
fallbackMediaNameFetchAttempted.current = false;
|
|
185
190
|
setFallbackMediaName(undefined);
|
|
186
191
|
lastFetchedFileId.current = currentId;
|
|
187
|
-
if (fileStateValue && !fileStateValue.name && fallbackMediaNameFetcher && !fallbackMediaNameFetchAttempted.current) {
|
|
192
|
+
if (!skipRemoteFileState && fileStateValue && !fileStateValue.name && fallbackMediaNameFetcher && !fallbackMediaNameFetchAttempted.current) {
|
|
188
193
|
fallbackMediaNameFetchAttempted.current = true;
|
|
189
194
|
fallbackMediaNameFetcher(fileStateValue.id).then(function (name) {
|
|
190
195
|
setFallbackMediaName(name);
|
|
@@ -192,7 +197,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
192
197
|
// Silently ignore fetch failures
|
|
193
198
|
});
|
|
194
199
|
}
|
|
195
|
-
}, [fileStateValue, fallbackMediaNameFetcher]);
|
|
200
|
+
}, [fileStateValue, fallbackMediaNameFetcher, skipRemoteFileState]);
|
|
196
201
|
var dateOverrides = useContext(DateOverrideContext);
|
|
197
202
|
var overridenDate = dateOverrides === null || dateOverrides === void 0 ? void 0 : dateOverrides[identifier.id];
|
|
198
203
|
|
|
@@ -254,13 +259,13 @@ export var FileCard = function FileCard(_ref) {
|
|
|
254
259
|
mediaBlobUrlAttrs: mediaBlobUrlAttrs,
|
|
255
260
|
resizeMode: imageResizeModeToFileImageMode(resizeMode),
|
|
256
261
|
identifier: identifier,
|
|
257
|
-
ssr: ssr,
|
|
262
|
+
ssr: skipRemoteFileState ? undefined : ssr,
|
|
258
263
|
dimensions: previewDimensions,
|
|
259
264
|
traceContext: traceContext,
|
|
260
|
-
skipRemote: !isCardVisible,
|
|
265
|
+
skipRemote: skipRemoteFileState || !isCardVisible,
|
|
261
266
|
source: 'mediaCard'
|
|
262
267
|
}),
|
|
263
|
-
|
|
268
|
+
cachedPreview = _useFilePreview.preview,
|
|
264
269
|
previewStatus = _useFilePreview.status,
|
|
265
270
|
previewError = _useFilePreview.error,
|
|
266
271
|
nonCriticalError = _useFilePreview.nonCriticalError,
|
|
@@ -269,6 +274,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
269
274
|
onImageLoadBase = _useFilePreview.onImageLoad,
|
|
270
275
|
getSsrScriptProps = _useFilePreview.getSsrScriptProps,
|
|
271
276
|
copyNodeRef = _useFilePreview.copyNodeRef;
|
|
277
|
+
var preview = !skipRemoteFileState || (cachedPreview === null || cachedPreview === void 0 ? void 0 : cachedPreview.source) === 'local' || (cachedPreview === null || cachedPreview === void 0 ? void 0 : cachedPreview.source) === 'cache-local' ? cachedPreview : undefined;
|
|
272
278
|
var shouldSendPerformanceEvent = useMemo(function () {
|
|
273
279
|
return shouldPerformanceBeSampled();
|
|
274
280
|
}, []);
|
|
@@ -284,7 +290,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
284
290
|
setError = _useState16[1];
|
|
285
291
|
|
|
286
292
|
// CXP-2723 TODO: TEMPORARY VARIABLES
|
|
287
|
-
var finalError = error || (previewError && previewError.primaryReason !== 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) !== 'image/svg+xml' ? previewError : undefined);
|
|
293
|
+
var finalError = error || (!skipRemoteFileState && previewError && previewError.primaryReason !== 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) !== 'image/svg+xml' ? previewError : undefined);
|
|
288
294
|
var finalStatus = finalError ? 'error' : status === 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) === 'image/svg+xml' ? 'loading-preview' : status;
|
|
289
295
|
|
|
290
296
|
// Experiment gate for the Confluence comments-in-media-viewer work. Only the
|
|
@@ -297,7 +303,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
297
303
|
onSelectedItemChange = _ref2.onSelectedItemChange;
|
|
298
304
|
var _useState17 = useState(function () {
|
|
299
305
|
var _getMediaViewerSelect;
|
|
300
|
-
return (_getMediaViewerSelect = getMediaViewerSelectedItem === null || getMediaViewerSelectedItem === void 0 ? void 0 : getMediaViewerSelectedItem(identifier)) !== null && _getMediaViewerSelect !== void 0 ? _getMediaViewerSelect : null;
|
|
306
|
+
return skipRemoteFileState ? null : (_getMediaViewerSelect = getMediaViewerSelectedItem === null || getMediaViewerSelectedItem === void 0 ? void 0 : getMediaViewerSelectedItem(identifier)) !== null && _getMediaViewerSelect !== void 0 ? _getMediaViewerSelect : null;
|
|
301
307
|
}),
|
|
302
308
|
_useState18 = _slicedToArray(_useState17, 2),
|
|
303
309
|
mediaViewerSelectedItem = _useState18[0],
|
|
@@ -397,7 +403,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
397
403
|
}, _callee, null, [[0, 2]]);
|
|
398
404
|
})), [createAnalyticsEvent, fileAttributes, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.metadataTraceContext, identifier.collectionName, identifier.id, mediaClient.file, metadata.name, traceContext]);
|
|
399
405
|
var computedActions = useMemo(function () {
|
|
400
|
-
if (finalStatus === 'failed-processing' || shouldEnableDownloadButton) {
|
|
406
|
+
if (!skipRemoteFileState && (finalStatus === 'failed-processing' || shouldEnableDownloadButton)) {
|
|
401
407
|
var handler = /*#__PURE__*/function () {
|
|
402
408
|
var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
|
|
403
409
|
return _regeneratorRuntime.wrap(function (_context2) {
|
|
@@ -431,7 +437,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
431
437
|
} else {
|
|
432
438
|
return actions;
|
|
433
439
|
}
|
|
434
|
-
}, [actions, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, downloadFn]);
|
|
440
|
+
}, [actions, skipRemoteFileState, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, downloadFn]);
|
|
435
441
|
|
|
436
442
|
//----------------------------------------------------------------//
|
|
437
443
|
//---------------------- Analytics ------------------------------//
|
|
@@ -682,8 +688,19 @@ export var FileCard = function FileCard(_ref) {
|
|
|
682
688
|
var updateFileStateRef = useCurrentValueRef(function () {
|
|
683
689
|
// This effect has race condition with Complete effect. We share the same check to ovid status overrides
|
|
684
690
|
|
|
691
|
+
if (skipRemoteFileState && !fileState) {
|
|
692
|
+
setStatus('loading');
|
|
693
|
+
uploadProgressRef.current = undefined;
|
|
694
|
+
return;
|
|
695
|
+
}
|
|
696
|
+
if (skipRemoteFileState && fileState && fileState.status !== 'error') {
|
|
697
|
+
setStatus(fileState.status === 'uploading' ? 'uploading' : 'complete');
|
|
698
|
+
uploadProgressRef.current = fileState.status === 'uploading' ? fileState.progress : 1;
|
|
699
|
+
return;
|
|
700
|
+
}
|
|
701
|
+
|
|
685
702
|
// do not update the card status if the status is final
|
|
686
|
-
if (['complete', 'error', 'failed-processing'].includes(finalStatus)) {
|
|
703
|
+
if (!skipRemoteFileState && ['complete', 'error', 'failed-processing'].includes(finalStatus)) {
|
|
687
704
|
return;
|
|
688
705
|
}
|
|
689
706
|
if (previewDidRender &&
|
|
@@ -716,7 +733,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
716
733
|
uploadProgressRef.current = newProgress;
|
|
717
734
|
} else {
|
|
718
735
|
var e = toCommonMediaClientError(fileState);
|
|
719
|
-
var errorReason = finalStatus === 'uploading' ? 'upload' : 'metadata-fetch';
|
|
736
|
+
var errorReason = skipRemoteFileState || finalStatus === 'uploading' ? 'upload' : 'metadata-fetch';
|
|
720
737
|
setError(new MediaCardError(errorReason, e));
|
|
721
738
|
setStatus('error');
|
|
722
739
|
}
|
|
@@ -798,6 +815,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
798
815
|
error: finalError,
|
|
799
816
|
mediaItemType: mediaItemType,
|
|
800
817
|
metadata: metadata,
|
|
818
|
+
disablePreview: skipRemoteFileState && metadata.mimeType === 'image/svg+xml',
|
|
801
819
|
cardPreview: preview,
|
|
802
820
|
alt: alt,
|
|
803
821
|
resizeMode: resizeMode,
|
|
@@ -880,7 +898,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
880
898
|
testId: testId,
|
|
881
899
|
cardPreview: preview,
|
|
882
900
|
videoControlsWrapperRef: videoControlsWrapperRef
|
|
883
|
-
})) : renderCard(), mediaViewerSelectedItem ? /*#__PURE__*/React.createElement(MediaViewer, {
|
|
901
|
+
})) : renderCard(), !skipRemoteFileState && mediaViewerSelectedItem ? /*#__PURE__*/React.createElement(MediaViewer, {
|
|
884
902
|
collectionName: collectionName,
|
|
885
903
|
items: mediaViewerItems || [],
|
|
886
904
|
mediaClientConfig: mediaClient.config,
|
|
@@ -80,7 +80,7 @@ var WrappedMediaCardAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Compo
|
|
|
80
80
|
}(React.Component);
|
|
81
81
|
_defineProperty(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
|
|
82
82
|
var packageName = "@atlaskit/media-card";
|
|
83
|
-
var packageVersion = "82.
|
|
83
|
+
var packageVersion = "82.3.0";
|
|
84
84
|
|
|
85
85
|
// @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
|
|
86
86
|
var MediaCardAnalyticsErrorBoundary = withMediaAnalyticsContext({
|
|
@@ -101,7 +101,7 @@ var MediaInlineCardLoader = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
101
101
|
ErrorBoundary = _this$state.ErrorBoundary;
|
|
102
102
|
var analyticsContext = {
|
|
103
103
|
packageVersion: "@atlaskit/media-card",
|
|
104
|
-
packageName: "82.
|
|
104
|
+
packageName: "82.3.0",
|
|
105
105
|
componentName: 'mediaInlineCard',
|
|
106
106
|
component: 'mediaInlineCard'
|
|
107
107
|
};
|
|
@@ -16,7 +16,7 @@ import { extractErrorInfo } from './analytics/extractErrorInfo';
|
|
|
16
16
|
import { getRenderErrorRequestMetadata } from './analytics/getRenderErrorRequestMetadata';
|
|
17
17
|
import { getMediaGlobalScope } from './globalScope/getMediaGlobalScope';
|
|
18
18
|
var packageName = "@atlaskit/media-card";
|
|
19
|
-
var packageVersion = "82.
|
|
19
|
+
var packageVersion = "82.3.0";
|
|
20
20
|
var SAMPLE_RATE = 0.05;
|
|
21
21
|
|
|
22
22
|
/**
|
|
@@ -12,6 +12,8 @@ import { type CardAction } from './actions';
|
|
|
12
12
|
export interface CardViewProps {
|
|
13
13
|
readonly identifier: Identifier;
|
|
14
14
|
readonly disableOverlay?: boolean;
|
|
15
|
+
/** Suppress image and SVG renderers for metadata-only upload cards. */
|
|
16
|
+
readonly disablePreview?: boolean;
|
|
15
17
|
readonly resizeMode?: ImageResizeMode;
|
|
16
18
|
readonly dimensions: CardDimensions;
|
|
17
19
|
readonly actions?: Array<CardAction>;
|
|
@@ -75,6 +77,6 @@ export interface RenderConfigByStatus {
|
|
|
75
77
|
customTitleMessage?: MessageDescriptor;
|
|
76
78
|
traceTooltipVariant?: TraceTooltipVariant;
|
|
77
79
|
}
|
|
78
|
-
export declare const CardViewBase: ({ identifier, innerRef, onImageLoad, onImageError, dimensions, onClick, onMouseEnter, onFocus, onOpenMediaViewerButtonFocus, testId, metadata, status, selected, selectable, cardPreview, mediaCardCursor, shouldHideTooltip, progress, alt, resizeMode, onDisplayImage, nativeLazyLoad, forceSyncDisplay, actions, disableOverlay, titleBoxBgColor, titleBoxIcon, error, disableAnimation, openMediaViewerButtonRef, shouldOpenMediaViewer, overriddenCreationDate, onSvgError, onSvgLoad, traceId, isAIGenerating, isCWR, hasLoadingMotion, backgroundColor, }: CardViewBaseProps) => React.JSX.Element;
|
|
80
|
+
export declare const CardViewBase: ({ identifier, innerRef, onImageLoad, onImageError, dimensions, onClick, onMouseEnter, onFocus, onOpenMediaViewerButtonFocus, testId, metadata, status, selected, selectable, cardPreview, mediaCardCursor, shouldHideTooltip, progress, alt, resizeMode, onDisplayImage, nativeLazyLoad, forceSyncDisplay, actions, disableOverlay, disablePreview, titleBoxBgColor, titleBoxIcon, error, disableAnimation, openMediaViewerButtonRef, shouldOpenMediaViewer, overriddenCreationDate, onSvgError, onSvgLoad, traceId, isAIGenerating, isCWR, hasLoadingMotion, backgroundColor, }: CardViewBaseProps) => React.JSX.Element;
|
|
79
81
|
export declare const CardView: React.ForwardRefExoticComponent<Omit<CardViewProps, keyof WithAnalyticsEventsProps> & React.RefAttributes<any>>;
|
|
80
82
|
export {};
|
|
@@ -13,6 +13,8 @@ import type { CardAppearance, CardDimensions, CardEventProps, TitleBoxIcon } fro
|
|
|
13
13
|
import type { CardAction } from './actions';
|
|
14
14
|
import type { SsrItemDetails } from './types';
|
|
15
15
|
export interface FileCardProps extends CardEventProps {
|
|
16
|
+
/** Use cached file state and local previews only; requires platform_media_upload_without_read. */
|
|
17
|
+
readonly skipRemoteFileState?: boolean;
|
|
16
18
|
/** Overlay the media file. */
|
|
17
19
|
readonly disableOverlay?: boolean;
|
|
18
20
|
/** Resize the media to 'crop' | 'fit' | 'full-fit' | 'stretchy-fit'. */
|
|
@@ -103,4 +105,4 @@ export interface FileCardProps extends CardEventProps {
|
|
|
103
105
|
*/
|
|
104
106
|
readonly fallbackMediaNameFetcher?: (id: string) => Promise<string>;
|
|
105
107
|
}
|
|
106
|
-
export declare const FileCard: ({ appearance, resizeMode, isLazy, disableOverlay, featureFlags, identifier, ssr, dimensions, originalDimensions, contextId, alt, actions, shouldEnableDownloadButton, useInlinePlayer, shouldOpenMediaViewer, onFullscreenChange, selectable, selected, testId, titleBoxBgColor, titleBoxIcon, backgroundColor, isAIGenerating, isCWR, hasLoadingMotion, onPreviewRender, shouldHideTooltip, mediaViewerItems, onClick, onMouseEnter, onFocus, videoControlsWrapperRef, viewerOptions, includeHashForDuplicateFiles, ssrItemDetails, ssrFileState, ssrMediaItem, onError, mediaViewerExtensions, fallbackMediaNameFetcher, }: FileCardProps) => React.JSX.Element;
|
|
108
|
+
export declare const FileCard: ({ appearance, resizeMode, isLazy, disableOverlay, featureFlags, identifier, ssr, dimensions, originalDimensions, contextId, alt, actions, shouldEnableDownloadButton: enableDownloadButton, useInlinePlayer: enableInlinePlayer, shouldOpenMediaViewer: enableMediaViewer, skipRemoteFileState: skipRemoteFileStateProp, onFullscreenChange, selectable, selected, testId, titleBoxBgColor, titleBoxIcon, backgroundColor, isAIGenerating, isCWR, hasLoadingMotion, onPreviewRender, shouldHideTooltip, mediaViewerItems, onClick, onMouseEnter, onFocus, videoControlsWrapperRef, viewerOptions, includeHashForDuplicateFiles, ssrItemDetails, ssrFileState, ssrMediaItem, onError, mediaViewerExtensions, fallbackMediaNameFetcher, }: FileCardProps) => React.JSX.Element;
|
package/dist/types/types.d.ts
CHANGED
|
@@ -104,6 +104,12 @@ export interface CardProps extends SharedCardProps, CardEventProps {
|
|
|
104
104
|
readonly mediaClient: MediaClient;
|
|
105
105
|
/** Instance of file identifier. */
|
|
106
106
|
readonly identifier: Identifier;
|
|
107
|
+
/**
|
|
108
|
+
* Use cached file state and local blob previews without fetching Media metadata or previews.
|
|
109
|
+
* Disables remote SVG rendering, inline playback, built-in downloads and the Media Viewer.
|
|
110
|
+
* Requires platform_media_upload_without_read. Custom actions remain the caller's responsibility.
|
|
111
|
+
*/
|
|
112
|
+
readonly skipRemoteFileState?: boolean;
|
|
107
113
|
/** Lazy loads the media file. */
|
|
108
114
|
readonly isLazy?: boolean;
|
|
109
115
|
/** Uses the inline player for media file. */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/media-card",
|
|
3
|
-
"version": "82.
|
|
3
|
+
"version": "82.3.1",
|
|
4
4
|
"description": "Includes all media card related components, CardView, CardViewSmall, Card...",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
"@atlaskit/icon": "^38.0.0",
|
|
40
40
|
"@atlaskit/interaction-context": "^4.1.0",
|
|
41
41
|
"@atlaskit/link": "^5.1.0",
|
|
42
|
-
"@atlaskit/media-client": "^39.
|
|
42
|
+
"@atlaskit/media-client": "^39.4.0",
|
|
43
43
|
"@atlaskit/media-client-react": "^7.0.0",
|
|
44
44
|
"@atlaskit/media-common": "^14.7.0",
|
|
45
45
|
"@atlaskit/media-file-preview": "^2.0.0",
|
|
@@ -49,14 +49,14 @@
|
|
|
49
49
|
"@atlaskit/media-viewer": "^54.12.0",
|
|
50
50
|
"@atlaskit/platform-feature-experiments": "^0.3.0",
|
|
51
51
|
"@atlaskit/platform-feature-flags": "^2.2.0",
|
|
52
|
-
"@atlaskit/primitives": "^22.
|
|
52
|
+
"@atlaskit/primitives": "^22.7.0",
|
|
53
53
|
"@atlaskit/progress-bar": "^5.3.0",
|
|
54
54
|
"@atlaskit/react-compiler-gating": "^0.2.0",
|
|
55
55
|
"@atlaskit/react-ufo": "^8.4.0",
|
|
56
56
|
"@atlaskit/section-message": "^10.2.0",
|
|
57
57
|
"@atlaskit/theme": "^28.2.0",
|
|
58
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
59
|
-
"@atlaskit/tokens": "^20.
|
|
58
|
+
"@atlaskit/tmp-editor-statsig": "^260.0.0",
|
|
59
|
+
"@atlaskit/tokens": "^20.10.0",
|
|
60
60
|
"@atlaskit/tooltip": "^24.4.0",
|
|
61
61
|
"@atlaskit/ufo": "^2.0.0",
|
|
62
62
|
"@atlaskit/visually-hidden": "^4.4.0",
|
|
@@ -86,7 +86,7 @@
|
|
|
86
86
|
"@atlaskit/heading": "^8.0.0",
|
|
87
87
|
"@atlaskit/inline-message": "^16.4.0",
|
|
88
88
|
"@atlaskit/media-core": "^39.0.0",
|
|
89
|
-
"@atlaskit/media-picker": "^73.
|
|
89
|
+
"@atlaskit/media-picker": "^73.3.0",
|
|
90
90
|
"@atlaskit/media-test-data": "^4.0.0",
|
|
91
91
|
"@atlaskit/media-test-helpers": "^43.0.0",
|
|
92
92
|
"@atlaskit/radio": "^10.2.0",
|
|
@@ -112,6 +112,9 @@
|
|
|
112
112
|
"uuid": "^11.1.1"
|
|
113
113
|
},
|
|
114
114
|
"platform-feature-flags": {
|
|
115
|
+
"platform_media_upload_without_read": {
|
|
116
|
+
"type": "boolean"
|
|
117
|
+
},
|
|
115
118
|
"aifc_page_create_defer_generated_visuals": {
|
|
116
119
|
"type": "boolean",
|
|
117
120
|
"referenceOnly": true
|