@atlaskit/media-card 78.18.2 → 78.18.3

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/media-card
 
+## 78.18.3
+
+### Patch Changes
+
+- [#102527](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/102527)
+  [`a90d34cd14faf`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/a90d34cd14faf) -
+  Updated ErrorFileState deserialisation and error logging
+- Updated dependencies
+
 ## 78.18.2
 
 ### Patch Changes

package/dist/cjs/card/card.js

@@ -21,7 +21,7 @@ var _excluded = ["identifier"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var packageName = "@atlaskit/media-card";
-var packageVersion = "78.18.2";
+var packageVersion = "78.18.3";
 var CardBase = exports.CardBase = function CardBase(_ref) {
   var identifier = _ref.identifier,
     otherProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);

package/dist/cjs/card/fileCard.js

@@ -87,7 +87,10 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
     includeHashForDuplicateFiles = _ref.includeHashForDuplicateFiles;
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
-  var openModalRef = /*#__PURE__*/(0, _react.createRef)();
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    isAbuseModalOpen = _useState2[0],
+    setIsAbuseModalOpen = _useState2[1];
   var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   //----------------------------------------------------------------//
@@ -95,10 +98,10 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
   //----------------------------------------------------------------//
 
   var mediaClient = (0, _mediaClientReact.useMediaClient)();
-  var _useState = (0, _react.useState)(null),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    cardElement = _useState2[0],
-    setCardElement = _useState2[1];
+  var _useState3 = (0, _react.useState)(null),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    cardElement = _useState4[0],
+    setCardElement = _useState4[1];
   var cardDimensions = dimensions || (0, _cardDimensions.getDefaultCardDimensions)(appearance);
 
   // Calculate the preview dimensions if card dimensions are "percentage" based
@@ -112,10 +115,10 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
       })
     );
   }, [cardDimensions, cardElement]);
-  var _useState3 = (0, _react.useState)(!isLazy),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    isCardVisible = _useState4[0],
-    setIsCardVisible = _useState4[1];
+  var _useState5 = (0, _react.useState)(!isLazy),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    isCardVisible = _useState6[0],
+    setIsCardVisible = _useState6[1];
   var _useFileState = (0, _mediaClientReact.useFileState)(identifier.id, {
       skipRemote: !isCardVisible,
       collectionName: identifier.collectionName,
@@ -156,22 +159,22 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
       traceId: (0, _mediaCommon.getRandomHex)(8)
     };
   }, []);
-  var _useState5 = (0, _react.useState)('loading'),
-    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-    status = _useState6[0],
-    setStatus = _useState6[1];
-  var _useState7 = (0, _react.useState)(false),
+  var _useState7 = (0, _react.useState)('loading'),
     _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-    isPlayingFile = _useState8[0],
-    setIsPlayingFile = _useState8[1];
+    status = _useState8[0],
+    setStatus = _useState8[1];
   var _useState9 = (0, _react.useState)(false),
     _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-    shouldAutoplay = _useState10[0],
-    setShouldAutoplay = _useState10[1];
+    isPlayingFile = _useState10[0],
+    setIsPlayingFile = _useState10[1];
   var _useState11 = (0, _react.useState)(false),
     _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
-    previewDidRender = _useState12[0],
-    setPreviewDidRender = _useState12[1];
+    shouldAutoplay = _useState12[0],
+    setShouldAutoplay = _useState12[1];
+  var _useState13 = (0, _react.useState)(false),
+    _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
+    previewDidRender = _useState14[0],
+    setPreviewDidRender = _useState14[1];
   var mediaBlobUrlAttrs = (0, _react.useMemo)(function () {
     var id = identifier.id,
       collection = identifier.collectionName;
@@ -209,18 +212,18 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
     onImageLoadBase = _useFilePreview.onImageLoad,
     getSsrScriptProps = _useFilePreview.getSsrScriptProps,
     copyNodeRef = _useFilePreview.copyNodeRef;
-  var _useState13 = (0, _react.useState)(),
-    _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
-    error = _useState14[0],
-    setError = _useState14[1];
+  var _useState15 = (0, _react.useState)(),
+    _useState16 = (0, _slicedToArray2.default)(_useState15, 2),
+    error = _useState16[0],
+    setError = _useState16[1];
 
   // CXP-2723 TODO: TEMPORARY VARIABLES
   var finalError = error || (previewError && previewError.primaryReason !== 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) !== 'image/svg+xml' ? previewError : undefined);
   var finalStatus = finalError ? 'error' : status === 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) === 'image/svg+xml' ? 'loading-preview' : status;
-  var _useState15 = (0, _react.useState)(null),
-    _useState16 = (0, _slicedToArray2.default)(_useState15, 2),
-    mediaViewerSelectedItem = _useState16[0],
-    setMediaViewerSelectedItem = _useState16[1];
+  var _useState17 = (0, _react.useState)(null),
+    _useState18 = (0, _slicedToArray2.default)(_useState17, 2),
+    mediaViewerSelectedItem = _useState18[0],
+    setMediaViewerSelectedItem = _useState18[1];
   var uploadProgressRef = (0, _react.useRef)();
   var metadata = (0, _react.useMemo)(function () {
     var getProcessingStatusFromFileState = function getProcessingStatusFromFileState(status) {
@@ -285,7 +288,6 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
     if (finalStatus === 'failed-processing' || shouldEnableDownloadButton) {
       var handler = /*#__PURE__*/function () {
         var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
-          var _openModalRef$current;
           return _regenerator.default.wrap(function _callee2$(_context2) {
             while (1) switch (_context2.prev = _context2.next) {
               case 0:
@@ -293,7 +295,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
                   _context2.next = 4;
                   break;
                 }
-                (_openModalRef$current = openModalRef.current) === null || _openModalRef$current === void 0 || _openModalRef$current.call(openModalRef);
+                setIsAbuseModalOpen(true);
                 _context2.next = 6;
                 break;
               case 4:
@@ -317,7 +319,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
     } else {
       return actions;
     }
-  }, [actions, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, openModalRef, downloadFn]);
+  }, [actions, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, downloadFn]);
 
   //----------------------------------------------------------------//
   //---------------------- Analytics  ------------------------------//
@@ -539,7 +541,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
         setStatus(newStatus);
         uploadProgressRef.current = newProgress;
       } else {
-        var e = new _mediaClientReact.MediaFileStateError(fileState.id, fileState.reason, fileState.message, fileState.details);
+        var e = (0, _mediaClient.toCommonMediaClientError)(fileState);
         var errorReason = finalStatus === 'uploading' ? 'upload' : 'metadata-fetch';
         setError(new _errors.MediaCardError(errorReason, e));
         setStatus('error');
@@ -638,10 +640,12 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
 
   var inlinePlayerFallback = isPlayingFile ? renderCard(false, 'loading', false) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
   var collectionName = identifier.collectionName || '';
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_abuseModal.AbuseModal, {
-    ref: openModalRef,
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !!(fileStateValue !== null && fileStateValue !== void 0 && fileStateValue.abuseClassification) && /*#__PURE__*/_react.default.createElement(_abuseModal.AbuseModal, {
+    isOpen: isAbuseModalOpen,
     onConfirm: downloadFn,
-    shouldMount: !!(fileStateValue !== null && fileStateValue !== void 0 && fileStateValue.abuseClassification)
+    onClose: function onClose() {
+      return setIsAbuseModalOpen(false);
+    }
   }), isPlayingFile ? /*#__PURE__*/_react.default.createElement(_react.Suspense, {
     fallback: inlinePlayerFallback
   }, /*#__PURE__*/_react.default.createElement(_inlinePlayerLazy.InlinePlayerLazy, {

package/dist/cjs/card/media-card-analytics-error-boundary.js

@@ -87,7 +87,7 @@ var WrappedMediaCardAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Compo
 }(_react.default.Component);
 (0, _defineProperty2.default)(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
 var packageName = "@atlaskit/media-card";
-var packageVersion = "78.18.2";
+var packageVersion = "78.18.3";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 var MediaCardAnalyticsErrorBoundary = (0, _mediaCommon.withMediaAnalyticsContext)({

package/dist/cjs/errors.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getImageLoadPrimaryReason = exports.ensureMediaCardError = exports.SsrPreviewError = exports.RemotePreviewError = exports.MediaCardError = exports.LocalPreviewError = exports.ImageLoadError = void 0;
 exports.isImageLoadError = isImageLoadError;
-exports.isKnownErrorType = isKnownErrorType;
 exports.isLocalPreviewError = void 0;
 exports.isMediaCardError = isMediaCardError;
 exports.isPollingError = isPollingError;
@@ -20,7 +19,6 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _wrapNativeSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/wrapNativeSuper"));
 var _mediaClient = require("@atlaskit/media-client");
 var _mediaClientReact = require("@atlaskit/media-client-react");
-var _mediaFilePreview = require("@atlaskit/media-file-preview");
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**
@@ -131,9 +129,6 @@ var ImageLoadError = exports.ImageLoadError = /*#__PURE__*/function (_MediaCardE
 function isMediaCardError(err) {
   return err instanceof MediaCardError;
 }
-function isKnownErrorType(err) {
-  return isMediaCardError(err) || (0, _mediaFilePreview.isMediaFilePreviewError)(err);
-}
 var isLocalPreviewError = exports.isLocalPreviewError = function isLocalPreviewError(err) {
   return err instanceof LocalPreviewError;
 };

package/dist/cjs/inline/loader.js

@@ -117,7 +117,7 @@ var MediaInlineCardLoader = exports.default = /*#__PURE__*/function (_React$Pure
         ErrorBoundary = _this$state.ErrorBoundary;
       var analyticsContext = {
         packageVersion: "@atlaskit/media-card",
-        packageName: "78.18.2",
+        packageName: "78.18.3",
         componentName: 'mediaInlineCard',
         component: 'mediaInlineCard'
       };

package/dist/cjs/inline/mediaInlineCard.js

@@ -59,7 +59,7 @@ var MediaInlineCardInternal = exports.MediaInlineCardInternal = function MediaIn
   var fireFailedOperationalEvent = function fireFailedOperationalEvent() {
     var error = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : new _errors.MediaCardError('missing-error-data');
     var failReason = arguments.length > 1 ? arguments[1] : undefined;
-    var payload = failReason ? (0, _mediaInlineCardAnalytics.getFailedProcessingStatusPayload)(fileState) : (0, _mediaInlineCardAnalytics.getErrorStatusPayload)(error, fileState);
+    var payload = failReason ? (0, _mediaInlineCardAnalytics.getFailedProcessingStatusPayload)(identifier.id, fileState) : (0, _mediaInlineCardAnalytics.getErrorStatusPayload)(identifier.id, error, fileState);
     setIsFailedEventSent(true);
     (0, _analytics.fireMediaCardEvent)(payload, createAnalyticsEvent);
   };
@@ -135,7 +135,7 @@ var MediaInlineCardInternal = exports.MediaInlineCardInternal = function MediaIn
     });
   }
   if ((fileState === null || fileState === void 0 ? void 0 : fileState.status) === 'error') {
-    var error = new _errors.MediaCardError('error-file-state', new Error(fileState.message));
+    var error = new _errors.MediaCardError('error-file-state', (0, _mediaClient.toCommonMediaClientError)(fileState));
     !isFailedEventSent && fireFailedOperationalEvent(error);
     return /*#__PURE__*/_react.default.createElement(_mediaUi.MediaInlineCardErroredView, {
       innerRef: copyNodeRef,
@@ -146,7 +146,9 @@ var MediaInlineCardInternal = exports.MediaInlineCardInternal = function MediaIn
 
   // Empty file handling
   if (fileState && !fileState.name) {
-    var _error = new _errors.MediaCardError('metadata-fetch', new _mediaClient.FileFetcherError('emptyFileName', fileState.id));
+    var _error = new _errors.MediaCardError('metadata-fetch', new _mediaClient.FileFetcherError('emptyFileName', {
+      id: fileState.id
+    }));
     !isFailedEventSent && fireFailedOperationalEvent(_error);
     return /*#__PURE__*/_react.default.createElement(_mediaUi.MediaInlineCardErroredView, {
       innerRef: copyNodeRef,

package/dist/cjs/inline/mediaInlineCardAnalytics.js

@@ -27,7 +27,7 @@ var getSucceededStatusPayload = exports.getSucceededStatusPayload = function get
     }
   };
 };
-var getErrorStatusPayload = exports.getErrorStatusPayload = function getErrorStatusPayload(error, fileState) {
+var getErrorStatusPayload = exports.getErrorStatusPayload = function getErrorStatusPayload(fileId, error, fileState) {
   return {
     eventType: 'operational',
     action: 'failed',
@@ -35,13 +35,13 @@ var getErrorStatusPayload = exports.getErrorStatusPayload = function getErrorSta
     attributes: _objectSpread({
       status: 'fail',
       fileAttributes: {
-        fileId: (fileState === null || fileState === void 0 ? void 0 : fileState.id) || '',
+        fileId: fileId,
         fileStatus: fileState === null || fileState === void 0 ? void 0 : fileState.status
       }
     }, (0, _analytics.extractErrorInfo)(error))
   };
 };
-var getFailedProcessingStatusPayload = exports.getFailedProcessingStatusPayload = function getFailedProcessingStatusPayload(fileState) {
+var getFailedProcessingStatusPayload = exports.getFailedProcessingStatusPayload = function getFailedProcessingStatusPayload(fileId, fileState) {
   return {
     eventType: 'operational',
     action: 'failed',
@@ -49,7 +49,7 @@ var getFailedProcessingStatusPayload = exports.getFailedProcessingStatusPayload
     attributes: {
       status: 'fail',
       fileAttributes: {
-        fileId: (fileState === null || fileState === void 0 ? void 0 : fileState.id) || '',
+        fileId: fileId,
         fileStatus: fileState === null || fileState === void 0 ? void 0 : fileState.status
       },
       failReason: 'failed-processing'
@@ -60,7 +60,7 @@ var fireFailedOperationalEvent = exports.fireFailedOperationalEvent = function f
   var error = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : new _errors.MediaCardError('missing-error-data');
   var failReason = arguments.length > 2 ? arguments[2] : undefined;
   var createAnalyticsEvent = arguments.length > 3 ? arguments[3] : undefined;
-  var payload = failReason ? getFailedProcessingStatusPayload(fileState) : getErrorStatusPayload(error, fileState);
+  var payload = failReason ? getFailedProcessingStatusPayload((fileState === null || fileState === void 0 ? void 0 : fileState.id) || 'unknown-id', fileState) : getErrorStatusPayload((fileState === null || fileState === void 0 ? void 0 : fileState.id) || 'unknown-id', error, fileState);
   (0, _analytics.fireMediaCardEvent)(payload, createAnalyticsEvent);
 };
 var fireSucceededOperationalEvent = exports.fireSucceededOperationalEvent = function fireSucceededOperationalEvent(fileState, createAnalyticsEvent) {

package/dist/cjs/utils/analytics/analytics.js

@@ -9,10 +9,8 @@ exports.fireMediaCardEvent = fireMediaCardEvent;
 exports.getRenderSucceededEventPayload = exports.getRenderPreviewableCardPayload = exports.getRenderFailedFileStatusPayload = exports.getRenderFailedExternalUriPayload = exports.getRenderErrorRequestMetadata = exports.getRenderErrorFailReason = exports.getRenderErrorEventPayload = exports.getRenderErrorErrorReason = exports.getRenderErrorErrorDetail = exports.getRemoteSuccessEventPayload = exports.getFileAttributes = exports.getErrorTraceContext = exports.getErrorEventPayload = exports.getDownloadSucceededEventPayload = exports.getDownloadFailedEventPayload = exports.getCacheHitEventPayload = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _mediaClient = require("@atlaskit/media-client");
-var _mediaClientReact = require("@atlaskit/media-client-react");
 var _analytics = require("@atlaskit/media-common/analytics");
 var _analyticsNext = require("@atlaskit/analytics-next");
-var _errors = require("../../errors");
 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; }
 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; }
 var getFileAttributes = exports.getFileAttributes = function getFileAttributes(metadata, fileStatus) {
@@ -100,47 +98,33 @@ var getRenderFailedExternalUriPayload = exports.getRenderFailedExternalUriPayloa
   };
 };
 var getRenderErrorFailReason = exports.getRenderErrorFailReason = function getRenderErrorFailReason(error) {
-  if ((0, _errors.isKnownErrorType)(error)) {
-    return error.primaryReason;
-  } else {
-    return 'nativeError';
-  }
+  return error.primaryReason || 'nativeError';
 };
 var getRenderErrorErrorReason = exports.getRenderErrorErrorReason = function getRenderErrorErrorReason(error) {
-  if ((0, _errors.isKnownErrorType)(error) && error.secondaryError) {
-    var mediaClientReason = (0, _mediaClient.isMediaClientError)(error.secondaryError) ? (0, _mediaClient.getMediaClientErrorReason)(error.secondaryError) : (0, _mediaClientReact.getFileStateErrorReason)(error.secondaryError);
-    if (mediaClientReason !== 'unknown') {
-      return mediaClientReason;
-    }
+  var secondaryError = error.secondaryError;
+  if ((0, _mediaClient.isCommonMediaClientError)(secondaryError)) {
+    return secondaryError.reason;
   }
   return 'nativeError';
 };
 var getRenderErrorErrorDetail = exports.getRenderErrorErrorDetail = function getRenderErrorErrorDetail(error) {
-  if ((0, _errors.isKnownErrorType)(error) && error.secondaryError) {
-    return error.secondaryError.message;
-  } else {
-    return error.message;
+  var secondaryError = error.secondaryError;
+  if (secondaryError instanceof Error) {
+    return secondaryError.message;
   }
+  return error.message;
 };
 var getErrorTraceContext = exports.getErrorTraceContext = function getErrorTraceContext(error) {
-  if ((0, _errors.isKnownErrorType)(error) && !!error.secondaryError) {
-    if ((0, _mediaClient.isRequestError)(error.secondaryError)) {
-      var _error$secondaryError;
-      return (_error$secondaryError = error.secondaryError.metadata) === null || _error$secondaryError === void 0 ? void 0 : _error$secondaryError.traceContext;
-    } else if ((0, _mediaClientReact.isMediaFileStateError)(error.secondaryError)) {
-      var _error$secondaryError2;
-      return (_error$secondaryError2 = error.secondaryError.details) === null || _error$secondaryError2 === void 0 || (_error$secondaryError2 = _error$secondaryError2.metadata) === null || _error$secondaryError2 === void 0 ? void 0 : _error$secondaryError2.traceContext;
-    }
+  var secondaryError = error.secondaryError;
+  if ((0, _mediaClient.isCommonMediaClientError)(secondaryError)) {
+    var _secondaryError$metad;
+    return (_secondaryError$metad = secondaryError.metadata) === null || _secondaryError$metad === void 0 ? void 0 : _secondaryError$metad.traceContext;
   }
 };
 var getRenderErrorRequestMetadata = exports.getRenderErrorRequestMetadata = function getRenderErrorRequestMetadata(error) {
-  if ((0, _errors.isKnownErrorType)(error) && !!error.secondaryError) {
-    if ((0, _mediaClient.isRequestError)(error.secondaryError)) {
-      return error.secondaryError.metadata;
-    } else if ((0, _mediaClientReact.isMediaFileStateError)(error.secondaryError)) {
-      var _error$secondaryError3;
-      return (_error$secondaryError3 = error.secondaryError.details) === null || _error$secondaryError3 === void 0 ? void 0 : _error$secondaryError3.metadata;
-    }
+  var secondaryError = error.secondaryError;
+  if ((0, _mediaClient.isCommonMediaClientError)(secondaryError)) {
+    return secondaryError.metadata;
   }
 };
 var extractErrorInfo = exports.extractErrorInfo = function extractErrorInfo(error, metadataTraceContext) {

package/dist/cjs/utils/ufoExperiences.js

@@ -15,7 +15,7 @@ var _mediaClient = require("@atlaskit/media-client");
 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; }
 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; }
 var packageName = "@atlaskit/media-card";
-var packageVersion = "78.18.2";
+var packageVersion = "78.18.3";
 var concurrentExperience;
 var getExperience = function getExperience(id) {
   if (!concurrentExperience) {

package/dist/es2019/card/card.js

@@ -9,7 +9,7 @@ import { startResourceObserver, setAnalyticsContext } from '../utils/mediaPerfor
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import UFOLabel from '@atlaskit/react-ufo/label';
 const packageName = "@atlaskit/media-card";
-const packageVersion = "78.18.2";
+const packageVersion = "78.18.3";
 export const CardBase = ({
   identifier,
   ...otherProps

package/dist/es2019/card/fileCard.js

@@ -1,9 +1,9 @@
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
-import { globalMediaEventEmitter, RECENTS_COLLECTION, imageResizeModeToFileImageMode, isProcessedFileState, isErrorFileState } from '@atlaskit/media-client';
-import { MediaFileStateError, useFileState, useMediaClient } from '@atlaskit/media-client-react';
+import { globalMediaEventEmitter, RECENTS_COLLECTION, imageResizeModeToFileImageMode, isProcessedFileState, isErrorFileState, toCommonMediaClientError } from '@atlaskit/media-client';
+import { useFileState, useMediaClient } from '@atlaskit/media-client-react';
 import { getRandomHex, isMimeTypeSupportedByBrowser, isVideoMimeTypeSupportedByBrowser } from '@atlaskit/media-common';
 import { MediaViewer, MediaViewerWithPortal } from '@atlaskit/media-viewer';
-import React, { Suspense, useEffect, useMemo, useRef, useState, createRef, useCallback } from 'react';
+import React, { Suspense, useEffect, useMemo, useRef, useState, useCallback } from 'react';
 import ReactDOM from 'react-dom';
 import { useMergeRefs } from 'use-callback-ref';
 import { MediaCardError } from '../errors';
@@ -69,7 +69,7 @@ export const FileCard = ({
   const {
     formatMessage
   } = useIntl();
-  const openModalRef = /*#__PURE__*/createRef();
+  const [isAbuseModalOpen, setIsAbuseModalOpen] = useState(false);
   const {
     createAnalyticsEvent
   } = useAnalyticsEvents();
@@ -226,8 +226,7 @@ export const FileCard = ({
     if (finalStatus === 'failed-processing' || shouldEnableDownloadButton) {
       const handler = async () => {
         if (!!(fileStateValue !== null && fileStateValue !== void 0 && fileStateValue.abuseClassification)) {
-          var _openModalRef$current;
-          (_openModalRef$current = openModalRef.current) === null || _openModalRef$current === void 0 ? void 0 : _openModalRef$current.call(openModalRef);
+          setIsAbuseModalOpen(true);
         } else {
           await downloadFn();
         }
@@ -240,7 +239,7 @@ export const FileCard = ({
     } else {
       return actions;
     }
-  }, [actions, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, openModalRef, downloadFn]);
+  }, [actions, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, downloadFn]);
 
   //----------------------------------------------------------------//
   //---------------------- Analytics  ------------------------------//
@@ -463,7 +462,7 @@ export const FileCard = ({
         setStatus(newStatus);
         uploadProgressRef.current = newProgress;
       } else {
-        const e = new MediaFileStateError(fileState.id, fileState.reason, fileState.message, fileState.details);
+        const e = toCommonMediaClientError(fileState);
         const errorReason = finalStatus === 'uploading' ? 'upload' : 'metadata-fetch';
         setError(new MediaCardError(errorReason, e));
         setStatus('error');
@@ -562,10 +561,10 @@ export const FileCard = ({
 
   const inlinePlayerFallback = isPlayingFile ? renderCard(false, 'loading', false) : /*#__PURE__*/React.createElement(React.Fragment, null);
   const collectionName = identifier.collectionName || '';
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AbuseModal, {
-    ref: openModalRef,
+  return /*#__PURE__*/React.createElement(React.Fragment, null, !!(fileStateValue !== null && fileStateValue !== void 0 && fileStateValue.abuseClassification) && /*#__PURE__*/React.createElement(AbuseModal, {
+    isOpen: isAbuseModalOpen,
     onConfirm: downloadFn,
-    shouldMount: !!(fileStateValue !== null && fileStateValue !== void 0 && fileStateValue.abuseClassification)
+    onClose: () => setIsAbuseModalOpen(false)
   }), isPlayingFile ? /*#__PURE__*/React.createElement(Suspense, {
     fallback: inlinePlayerFallback
   }, /*#__PURE__*/React.createElement(InlinePlayerLazy, {

package/dist/es2019/card/media-card-analytics-error-boundary.js

@@ -66,7 +66,7 @@ class WrappedMediaCardAnalyticsErrorBoundary extends React.Component {
 }
 _defineProperty(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
 const packageName = "@atlaskit/media-card";
-const packageVersion = "78.18.2";
+const packageVersion = "78.18.3";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 const MediaCardAnalyticsErrorBoundary = withMediaAnalyticsContext({

package/dist/es2019/errors.js

@@ -1,6 +1,5 @@
 import { isPollingError as isMediaClientPollingError, isRateLimitedError as isMediaClientRateLimitedError } from '@atlaskit/media-client';
 import { isMediaFileStateError } from '@atlaskit/media-client-react';
-import { isMediaFilePreviewError } from '@atlaskit/media-file-preview';
 /**
  * Primary reason is logged through Data Portal.
  * Make sure all the values are whitelisted in Measure -> Event Regitry -> "mediaCardRender failed" event
@@ -86,9 +85,6 @@ export class ImageLoadError extends MediaCardError {
 export function isMediaCardError(err) {
   return err instanceof MediaCardError;
 }
-export function isKnownErrorType(err) {
-  return isMediaCardError(err) || isMediaFilePreviewError(err);
-}
 export const isLocalPreviewError = err => err instanceof LocalPreviewError;
 export const isRemotePreviewError = err => err instanceof RemotePreviewError;
 export const isUnsupportedLocalPreviewError = err => isMediaCardError(err) && err.primaryReason === 'local-preview-unsupported';

package/dist/es2019/inline/loader.js

@@ -37,7 +37,7 @@ export default class MediaInlineCardLoader extends React.PureComponent {
     } = this.state;
     const analyticsContext = {
       packageVersion: "@atlaskit/media-card",
-      packageName: "78.18.2",
+      packageName: "78.18.3",
       componentName: 'mediaInlineCard',
       component: 'mediaInlineCard'
     };

package/dist/es2019/inline/mediaInlineCard.js

@@ -1,5 +1,5 @@
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
-import { FileFetcherError } from '@atlaskit/media-client';
+import { FileFetcherError, toCommonMediaClientError } from '@atlaskit/media-client';
 import { MediaInlineCardErroredView, MediaInlineCardLoadedView, MediaInlineCardLoadingView, messages } from '@atlaskit/media-ui';
 import { formatDate } from '@atlaskit/media-ui/formatDate';
 import { MimeTypeIcon } from '@atlaskit/media-ui/mime-type-icon';
@@ -33,7 +33,7 @@ export const MediaInlineCardInternal = ({
     createAnalyticsEvent
   } = useAnalyticsEvents();
   const fireFailedOperationalEvent = (error = new MediaCardError('missing-error-data'), failReason) => {
-    const payload = failReason ? getFailedProcessingStatusPayload(fileState) : getErrorStatusPayload(error, fileState);
+    const payload = failReason ? getFailedProcessingStatusPayload(identifier.id, fileState) : getErrorStatusPayload(identifier.id, error, fileState);
     setIsFailedEventSent(true);
     fireMediaCardEvent(payload, createAnalyticsEvent);
   };
@@ -108,7 +108,7 @@ export const MediaInlineCardInternal = ({
     });
   }
   if ((fileState === null || fileState === void 0 ? void 0 : fileState.status) === 'error') {
-    const error = new MediaCardError('error-file-state', new Error(fileState.message));
+    const error = new MediaCardError('error-file-state', toCommonMediaClientError(fileState));
     !isFailedEventSent && fireFailedOperationalEvent(error);
     return /*#__PURE__*/React.createElement(MediaInlineCardErroredView, {
       innerRef: copyNodeRef,
@@ -119,7 +119,9 @@ export const MediaInlineCardInternal = ({
 
   // Empty file handling
   if (fileState && !fileState.name) {
-    const error = new MediaCardError('metadata-fetch', new FileFetcherError('emptyFileName', fileState.id));
+    const error = new MediaCardError('metadata-fetch', new FileFetcherError('emptyFileName', {
+      id: fileState.id
+    }));
     !isFailedEventSent && fireFailedOperationalEvent(error);
     return /*#__PURE__*/React.createElement(MediaInlineCardErroredView, {
       innerRef: copyNodeRef,

package/dist/es2019/inline/mediaInlineCardAnalytics.js

@@ -17,7 +17,7 @@ export const getSucceededStatusPayload = fileState => {
     }
   };
 };
-export const getErrorStatusPayload = (error, fileState) => {
+export const getErrorStatusPayload = (fileId, error, fileState) => {
   return {
     eventType: 'operational',
     action: 'failed',
@@ -25,14 +25,14 @@ export const getErrorStatusPayload = (error, fileState) => {
     attributes: {
       status: 'fail',
       fileAttributes: {
-        fileId: (fileState === null || fileState === void 0 ? void 0 : fileState.id) || '',
+        fileId,
         fileStatus: fileState === null || fileState === void 0 ? void 0 : fileState.status
       },
       ...extractErrorInfo(error)
     }
   };
 };
-export const getFailedProcessingStatusPayload = fileState => {
+export const getFailedProcessingStatusPayload = (fileId, fileState) => {
   return {
     eventType: 'operational',
     action: 'failed',
@@ -40,7 +40,7 @@ export const getFailedProcessingStatusPayload = fileState => {
     attributes: {
       status: 'fail',
       fileAttributes: {
-        fileId: (fileState === null || fileState === void 0 ? void 0 : fileState.id) || '',
+        fileId,
         fileStatus: fileState === null || fileState === void 0 ? void 0 : fileState.status
       },
       failReason: 'failed-processing'
@@ -48,7 +48,7 @@ export const getFailedProcessingStatusPayload = fileState => {
   };
 };
 export const fireFailedOperationalEvent = (fileState, error = new MediaCardError('missing-error-data'), failReason, createAnalyticsEvent) => {
-  const payload = failReason ? getFailedProcessingStatusPayload(fileState) : getErrorStatusPayload(error, fileState);
+  const payload = failReason ? getFailedProcessingStatusPayload((fileState === null || fileState === void 0 ? void 0 : fileState.id) || 'unknown-id', fileState) : getErrorStatusPayload((fileState === null || fileState === void 0 ? void 0 : fileState.id) || 'unknown-id', error, fileState);
   fireMediaCardEvent(payload, createAnalyticsEvent);
 };
 export const fireSucceededOperationalEvent = (fileState, createAnalyticsEvent) => {

package/dist/es2019/utils/analytics/analytics.js

@@ -1,8 +1,6 @@
-import { getMediaClientErrorReason, isRequestError, isMediaClientError } from '@atlaskit/media-client';
-import { isMediaFileStateError, getFileStateErrorReason } from '@atlaskit/media-client-react';
+import { isCommonMediaClientError } from '@atlaskit/media-client';
 import { ANALYTICS_MEDIA_CHANNEL, sanitiseAnalyticsPayload } from '@atlaskit/media-common/analytics';
 import { createAndFireEvent } from '@atlaskit/analytics-next';
-import { isKnownErrorType } from '../../errors';
 export const getFileAttributes = (metadata, fileStatus) => ({
   fileMediatype: metadata.mediaType,
   fileMimetype: metadata.mimeType,
@@ -74,47 +72,41 @@ export const getRenderFailedExternalUriPayload = (fileAttributes, performanceAtt
   }
 });
 export const getRenderErrorFailReason = error => {
-  if (isKnownErrorType(error)) {
-    return error.primaryReason;
-  } else {
-    return 'nativeError';
-  }
+  return error.primaryReason || 'nativeError';
 };
 export const getRenderErrorErrorReason = error => {
-  if (isKnownErrorType(error) && error.secondaryError) {
-    const mediaClientReason = isMediaClientError(error.secondaryError) ? getMediaClientErrorReason(error.secondaryError) : getFileStateErrorReason(error.secondaryError);
-    if (mediaClientReason !== 'unknown') {
-      return mediaClientReason;
-    }
+  const {
+    secondaryError
+  } = error;
+  if (isCommonMediaClientError(secondaryError)) {
+    return secondaryError.reason;
   }
   return 'nativeError';
 };
 export const getRenderErrorErrorDetail = error => {
-  if (isKnownErrorType(error) && error.secondaryError) {
-    return error.secondaryError.message;
-  } else {
-    return error.message;
+  const {
+    secondaryError
+  } = error;
+  if (secondaryError instanceof Error) {
+    return secondaryError.message;
   }
+  return error.message;
 };
 export const getErrorTraceContext = error => {
-  if (isKnownErrorType(error) && !!error.secondaryError) {
-    if (isRequestError(error.secondaryError)) {
-      var _error$secondaryError;
-      return (_error$secondaryError = error.secondaryError.metadata) === null || _error$secondaryError === void 0 ? void 0 : _error$secondaryError.traceContext;
-    } else if (isMediaFileStateError(error.secondaryError)) {
-      var _error$secondaryError2, _error$secondaryError3;
-      return (_error$secondaryError2 = error.secondaryError.details) === null || _error$secondaryError2 === void 0 ? void 0 : (_error$secondaryError3 = _error$secondaryError2.metadata) === null || _error$secondaryError3 === void 0 ? void 0 : _error$secondaryError3.traceContext;
-    }
+  const {
+    secondaryError
+  } = error;
+  if (isCommonMediaClientError(secondaryError)) {
+    var _secondaryError$metad;
+    return (_secondaryError$metad = secondaryError.metadata) === null || _secondaryError$metad === void 0 ? void 0 : _secondaryError$metad.traceContext;
   }
 };
 export const getRenderErrorRequestMetadata = error => {
-  if (isKnownErrorType(error) && !!error.secondaryError) {
-    if (isRequestError(error.secondaryError)) {
-      return error.secondaryError.metadata;
-    } else if (isMediaFileStateError(error.secondaryError)) {
-      var _error$secondaryError4;
-      return (_error$secondaryError4 = error.secondaryError.details) === null || _error$secondaryError4 === void 0 ? void 0 : _error$secondaryError4.metadata;
-    }
+  const {
+    secondaryError
+  } = error;
+  if (isCommonMediaClientError(secondaryError)) {
+    return secondaryError.metadata;
   }
 };
 export const extractErrorInfo = (error, metadataTraceContext) => {

package/dist/es2019/utils/ufoExperiences.js

@@ -5,7 +5,7 @@ import { extractErrorInfo, getRenderErrorRequestMetadata } from './analytics';
 import { MediaCardError } from '../errors';
 import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
 const packageName = "@atlaskit/media-card";
-const packageVersion = "78.18.2";
+const packageVersion = "78.18.3";
 let concurrentExperience;
 const getExperience = id => {
   if (!concurrentExperience) {

package/dist/esm/card/card.js

@@ -11,7 +11,7 @@ import { startResourceObserver, setAnalyticsContext } from '../utils/mediaPerfor
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import UFOLabel from '@atlaskit/react-ufo/label';
 var packageName = "@atlaskit/media-card";
-var packageVersion = "78.18.2";
+var packageVersion = "78.18.3";
 export var CardBase = function CardBase(_ref) {
   var identifier = _ref.identifier,
     otherProps = _objectWithoutProperties(_ref, _excluded);

package/dist/esm/card/fileCard.js

@@ -6,11 +6,11 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
 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; }
 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; }
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
-import { globalMediaEventEmitter, RECENTS_COLLECTION, imageResizeModeToFileImageMode, isProcessedFileState, isErrorFileState } from '@atlaskit/media-client';
-import { MediaFileStateError, useFileState, useMediaClient } from '@atlaskit/media-client-react';
+import { globalMediaEventEmitter, RECENTS_COLLECTION, imageResizeModeToFileImageMode, isProcessedFileState, isErrorFileState, toCommonMediaClientError } from '@atlaskit/media-client';
+import { useFileState, useMediaClient } from '@atlaskit/media-client-react';
 import { getRandomHex, isMimeTypeSupportedByBrowser, isVideoMimeTypeSupportedByBrowser } from '@atlaskit/media-common';
 import { MediaViewer, MediaViewerWithPortal } from '@atlaskit/media-viewer';
-import React, { Suspense, useEffect, useMemo, useRef, useState, createRef, useCallback } from 'react';
+import React, { Suspense, useEffect, useMemo, useRef, useState, useCallback } from 'react';
 import ReactDOM from 'react-dom';
 import { useMergeRefs } from 'use-callback-ref';
 import { MediaCardError } from '../errors';
@@ -78,7 +78,10 @@ export var FileCard = function FileCard(_ref) {
     includeHashForDuplicateFiles = _ref.includeHashForDuplicateFiles;
   var _useIntl = useIntl(),
     formatMessage = _useIntl.formatMessage;
-  var openModalRef = /*#__PURE__*/createRef();
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isAbuseModalOpen = _useState2[0],
+    setIsAbuseModalOpen = _useState2[1];
   var _useAnalyticsEvents = useAnalyticsEvents(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   //----------------------------------------------------------------//
@@ -86,10 +89,10 @@ export var FileCard = function FileCard(_ref) {
   //----------------------------------------------------------------//
 
   var mediaClient = useMediaClient();
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    cardElement = _useState2[0],
-    setCardElement = _useState2[1];
+  var _useState3 = useState(null),
+    _useState4 = _slicedToArray(_useState3, 2),
+    cardElement = _useState4[0],
+    setCardElement = _useState4[1];
   var cardDimensions = dimensions || getDefaultCardDimensions(appearance);
 
   // Calculate the preview dimensions if card dimensions are "percentage" based
@@ -103,10 +106,10 @@ export var FileCard = function FileCard(_ref) {
       })
     );
   }, [cardDimensions, cardElement]);
-  var _useState3 = useState(!isLazy),
-    _useState4 = _slicedToArray(_useState3, 2),
-    isCardVisible = _useState4[0],
-    setIsCardVisible = _useState4[1];
+  var _useState5 = useState(!isLazy),
+    _useState6 = _slicedToArray(_useState5, 2),
+    isCardVisible = _useState6[0],
+    setIsCardVisible = _useState6[1];
   var _useFileState = useFileState(identifier.id, {
       skipRemote: !isCardVisible,
       collectionName: identifier.collectionName,
@@ -147,22 +150,22 @@ export var FileCard = function FileCard(_ref) {
       traceId: getRandomHex(8)
     };
   }, []);
-  var _useState5 = useState('loading'),
-    _useState6 = _slicedToArray(_useState5, 2),
-    status = _useState6[0],
-    setStatus = _useState6[1];
-  var _useState7 = useState(false),
+  var _useState7 = useState('loading'),
     _useState8 = _slicedToArray(_useState7, 2),
-    isPlayingFile = _useState8[0],
-    setIsPlayingFile = _useState8[1];
+    status = _useState8[0],
+    setStatus = _useState8[1];
   var _useState9 = useState(false),
     _useState10 = _slicedToArray(_useState9, 2),
-    shouldAutoplay = _useState10[0],
-    setShouldAutoplay = _useState10[1];
+    isPlayingFile = _useState10[0],
+    setIsPlayingFile = _useState10[1];
   var _useState11 = useState(false),
     _useState12 = _slicedToArray(_useState11, 2),
-    previewDidRender = _useState12[0],
-    setPreviewDidRender = _useState12[1];
+    shouldAutoplay = _useState12[0],
+    setShouldAutoplay = _useState12[1];
+  var _useState13 = useState(false),
+    _useState14 = _slicedToArray(_useState13, 2),
+    previewDidRender = _useState14[0],
+    setPreviewDidRender = _useState14[1];
   var mediaBlobUrlAttrs = useMemo(function () {
     var id = identifier.id,
       collection = identifier.collectionName;
@@ -200,18 +203,18 @@ export var FileCard = function FileCard(_ref) {
     onImageLoadBase = _useFilePreview.onImageLoad,
     getSsrScriptProps = _useFilePreview.getSsrScriptProps,
     copyNodeRef = _useFilePreview.copyNodeRef;
-  var _useState13 = useState(),
-    _useState14 = _slicedToArray(_useState13, 2),
-    error = _useState14[0],
-    setError = _useState14[1];
+  var _useState15 = useState(),
+    _useState16 = _slicedToArray(_useState15, 2),
+    error = _useState16[0],
+    setError = _useState16[1];
 
   // CXP-2723 TODO: TEMPORARY VARIABLES
   var finalError = error || (previewError && previewError.primaryReason !== 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) !== 'image/svg+xml' ? previewError : undefined);
   var finalStatus = finalError ? 'error' : status === 'failed-processing' && (fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.mimeType) === 'image/svg+xml' ? 'loading-preview' : status;
-  var _useState15 = useState(null),
-    _useState16 = _slicedToArray(_useState15, 2),
-    mediaViewerSelectedItem = _useState16[0],
-    setMediaViewerSelectedItem = _useState16[1];
+  var _useState17 = useState(null),
+    _useState18 = _slicedToArray(_useState17, 2),
+    mediaViewerSelectedItem = _useState18[0],
+    setMediaViewerSelectedItem = _useState18[1];
   var uploadProgressRef = useRef();
   var metadata = useMemo(function () {
     var getProcessingStatusFromFileState = function getProcessingStatusFromFileState(status) {
@@ -276,7 +279,6 @@ export var FileCard = function FileCard(_ref) {
     if (finalStatus === 'failed-processing' || shouldEnableDownloadButton) {
       var handler = /*#__PURE__*/function () {
         var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-          var _openModalRef$current;
           return _regeneratorRuntime.wrap(function _callee2$(_context2) {
             while (1) switch (_context2.prev = _context2.next) {
               case 0:
@@ -284,7 +286,7 @@ export var FileCard = function FileCard(_ref) {
                   _context2.next = 4;
                   break;
                 }
-                (_openModalRef$current = openModalRef.current) === null || _openModalRef$current === void 0 || _openModalRef$current.call(openModalRef);
+                setIsAbuseModalOpen(true);
                 _context2.next = 6;
                 break;
               case 4:
@@ -308,7 +310,7 @@ export var FileCard = function FileCard(_ref) {
     } else {
       return actions;
     }
-  }, [actions, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, openModalRef, downloadFn]);
+  }, [actions, mediaClient.config.enforceDataSecurityPolicy, shouldEnableDownloadButton, finalStatus, formatMessage, fileStateValue === null || fileStateValue === void 0 ? void 0 : fileStateValue.abuseClassification, downloadFn]);
 
   //----------------------------------------------------------------//
   //---------------------- Analytics  ------------------------------//
@@ -530,7 +532,7 @@ export var FileCard = function FileCard(_ref) {
         setStatus(newStatus);
         uploadProgressRef.current = newProgress;
       } else {
-        var e = new MediaFileStateError(fileState.id, fileState.reason, fileState.message, fileState.details);
+        var e = toCommonMediaClientError(fileState);
         var errorReason = finalStatus === 'uploading' ? 'upload' : 'metadata-fetch';
         setError(new MediaCardError(errorReason, e));
         setStatus('error');
@@ -629,10 +631,12 @@ export var FileCard = function FileCard(_ref) {
 
   var inlinePlayerFallback = isPlayingFile ? renderCard(false, 'loading', false) : /*#__PURE__*/React.createElement(React.Fragment, null);
   var collectionName = identifier.collectionName || '';
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AbuseModal, {
-    ref: openModalRef,
+  return /*#__PURE__*/React.createElement(React.Fragment, null, !!(fileStateValue !== null && fileStateValue !== void 0 && fileStateValue.abuseClassification) && /*#__PURE__*/React.createElement(AbuseModal, {
+    isOpen: isAbuseModalOpen,
     onConfirm: downloadFn,
-    shouldMount: !!(fileStateValue !== null && fileStateValue !== void 0 && fileStateValue.abuseClassification)
+    onClose: function onClose() {
+      return setIsAbuseModalOpen(false);
+    }
   }), isPlayingFile ? /*#__PURE__*/React.createElement(Suspense, {
     fallback: inlinePlayerFallback
   }, /*#__PURE__*/React.createElement(InlinePlayerLazy, {

package/dist/esm/card/media-card-analytics-error-boundary.js

@@ -80,7 +80,7 @@ var WrappedMediaCardAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Compo
 }(React.Component);
 _defineProperty(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
 var packageName = "@atlaskit/media-card";
-var packageVersion = "78.18.2";
+var packageVersion = "78.18.3";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 var MediaCardAnalyticsErrorBoundary = withMediaAnalyticsContext({

package/dist/esm/errors.js

@@ -8,7 +8,6 @@ function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstruct
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import { isPollingError as isMediaClientPollingError, isRateLimitedError as isMediaClientRateLimitedError } from '@atlaskit/media-client';
 import { isMediaFileStateError } from '@atlaskit/media-client-react';
-import { isMediaFilePreviewError } from '@atlaskit/media-file-preview';
 /**
  * Primary reason is logged through Data Portal.
  * Make sure all the values are whitelisted in Measure -> Event Regitry -> "mediaCardRender failed" event
@@ -117,9 +116,6 @@ export var ImageLoadError = /*#__PURE__*/function (_MediaCardError4) {
 export function isMediaCardError(err) {
   return err instanceof MediaCardError;
 }
-export function isKnownErrorType(err) {
-  return isMediaCardError(err) || isMediaFilePreviewError(err);
-}
 export var isLocalPreviewError = function isLocalPreviewError(err) {
   return err instanceof LocalPreviewError;
 };

package/dist/esm/inline/loader.js

@@ -101,7 +101,7 @@ var MediaInlineCardLoader = /*#__PURE__*/function (_React$PureComponent) {
         ErrorBoundary = _this$state.ErrorBoundary;
       var analyticsContext = {
         packageVersion: "@atlaskit/media-card",
-        packageName: "78.18.2",
+        packageName: "78.18.3",
         componentName: 'mediaInlineCard',
         component: 'mediaInlineCard'
       };

package/dist/esm/inline/mediaInlineCard.js

@@ -1,6 +1,6 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
-import { FileFetcherError } from '@atlaskit/media-client';
+import { FileFetcherError, toCommonMediaClientError } from '@atlaskit/media-client';
 import { MediaInlineCardErroredView, MediaInlineCardLoadedView, MediaInlineCardLoadingView, messages } from '@atlaskit/media-ui';
 import { formatDate } from '@atlaskit/media-ui/formatDate';
 import { MimeTypeIcon } from '@atlaskit/media-ui/mime-type-icon';
@@ -49,7 +49,7 @@ export var MediaInlineCardInternal = function MediaInlineCardInternal(_ref) {
   var fireFailedOperationalEvent = function fireFailedOperationalEvent() {
     var error = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : new MediaCardError('missing-error-data');
     var failReason = arguments.length > 1 ? arguments[1] : undefined;
-    var payload = failReason ? getFailedProcessingStatusPayload(fileState) : getErrorStatusPayload(error, fileState);
+    var payload = failReason ? getFailedProcessingStatusPayload(identifier.id, fileState) : getErrorStatusPayload(identifier.id, error, fileState);
     setIsFailedEventSent(true);
     fireMediaCardEvent(payload, createAnalyticsEvent);
   };
@@ -125,7 +125,7 @@ export var MediaInlineCardInternal = function MediaInlineCardInternal(_ref) {
     });
   }
   if ((fileState === null || fileState === void 0 ? void 0 : fileState.status) === 'error') {
-    var error = new MediaCardError('error-file-state', new Error(fileState.message));
+    var error = new MediaCardError('error-file-state', toCommonMediaClientError(fileState));
     !isFailedEventSent && fireFailedOperationalEvent(error);
     return /*#__PURE__*/React.createElement(MediaInlineCardErroredView, {
       innerRef: copyNodeRef,
@@ -136,7 +136,9 @@ export var MediaInlineCardInternal = function MediaInlineCardInternal(_ref) {
 
   // Empty file handling
   if (fileState && !fileState.name) {
-    var _error = new MediaCardError('metadata-fetch', new FileFetcherError('emptyFileName', fileState.id));
+    var _error = new MediaCardError('metadata-fetch', new FileFetcherError('emptyFileName', {
+      id: fileState.id
+    }));
     !isFailedEventSent && fireFailedOperationalEvent(_error);
     return /*#__PURE__*/React.createElement(MediaInlineCardErroredView, {
       innerRef: copyNodeRef,

package/dist/esm/inline/mediaInlineCardAnalytics.js

@@ -20,7 +20,7 @@ export var getSucceededStatusPayload = function getSucceededStatusPayload(fileSt
     }
   };
 };
-export var getErrorStatusPayload = function getErrorStatusPayload(error, fileState) {
+export var getErrorStatusPayload = function getErrorStatusPayload(fileId, error, fileState) {
   return {
     eventType: 'operational',
     action: 'failed',
@@ -28,13 +28,13 @@ export var getErrorStatusPayload = function getErrorStatusPayload(error, fileSta
     attributes: _objectSpread({
       status: 'fail',
       fileAttributes: {
-        fileId: (fileState === null || fileState === void 0 ? void 0 : fileState.id) || '',
+        fileId: fileId,
         fileStatus: fileState === null || fileState === void 0 ? void 0 : fileState.status
       }
     }, extractErrorInfo(error))
   };
 };
-export var getFailedProcessingStatusPayload = function getFailedProcessingStatusPayload(fileState) {
+export var getFailedProcessingStatusPayload = function getFailedProcessingStatusPayload(fileId, fileState) {
   return {
     eventType: 'operational',
     action: 'failed',
@@ -42,7 +42,7 @@ export var getFailedProcessingStatusPayload = function getFailedProcessingStatus
     attributes: {
       status: 'fail',
       fileAttributes: {
-        fileId: (fileState === null || fileState === void 0 ? void 0 : fileState.id) || '',
+        fileId: fileId,
         fileStatus: fileState === null || fileState === void 0 ? void 0 : fileState.status
       },
       failReason: 'failed-processing'
@@ -53,7 +53,7 @@ export var fireFailedOperationalEvent = function fireFailedOperationalEvent(file
   var error = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : new MediaCardError('missing-error-data');
   var failReason = arguments.length > 2 ? arguments[2] : undefined;
   var createAnalyticsEvent = arguments.length > 3 ? arguments[3] : undefined;
-  var payload = failReason ? getFailedProcessingStatusPayload(fileState) : getErrorStatusPayload(error, fileState);
+  var payload = failReason ? getFailedProcessingStatusPayload((fileState === null || fileState === void 0 ? void 0 : fileState.id) || 'unknown-id', fileState) : getErrorStatusPayload((fileState === null || fileState === void 0 ? void 0 : fileState.id) || 'unknown-id', error, fileState);
   fireMediaCardEvent(payload, createAnalyticsEvent);
 };
 export var fireSucceededOperationalEvent = function fireSucceededOperationalEvent(fileState, createAnalyticsEvent) {

package/dist/esm/utils/analytics/analytics.js

@@ -1,11 +1,9 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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; }
 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; }
-import { getMediaClientErrorReason, isRequestError, isMediaClientError } from '@atlaskit/media-client';
-import { isMediaFileStateError, getFileStateErrorReason } from '@atlaskit/media-client-react';
+import { isCommonMediaClientError } from '@atlaskit/media-client';
 import { ANALYTICS_MEDIA_CHANNEL, sanitiseAnalyticsPayload } from '@atlaskit/media-common/analytics';
 import { createAndFireEvent } from '@atlaskit/analytics-next';
-import { isKnownErrorType } from '../../errors';
 export var getFileAttributes = function getFileAttributes(metadata, fileStatus) {
   return {
     fileMediatype: metadata.mediaType,
@@ -91,47 +89,33 @@ export var getRenderFailedExternalUriPayload = function getRenderFailedExternalU
   };
 };
 export var getRenderErrorFailReason = function getRenderErrorFailReason(error) {
-  if (isKnownErrorType(error)) {
-    return error.primaryReason;
-  } else {
-    return 'nativeError';
-  }
+  return error.primaryReason || 'nativeError';
 };
 export var getRenderErrorErrorReason = function getRenderErrorErrorReason(error) {
-  if (isKnownErrorType(error) && error.secondaryError) {
-    var mediaClientReason = isMediaClientError(error.secondaryError) ? getMediaClientErrorReason(error.secondaryError) : getFileStateErrorReason(error.secondaryError);
-    if (mediaClientReason !== 'unknown') {
-      return mediaClientReason;
-    }
+  var secondaryError = error.secondaryError;
+  if (isCommonMediaClientError(secondaryError)) {
+    return secondaryError.reason;
   }
   return 'nativeError';
 };
 export var getRenderErrorErrorDetail = function getRenderErrorErrorDetail(error) {
-  if (isKnownErrorType(error) && error.secondaryError) {
-    return error.secondaryError.message;
-  } else {
-    return error.message;
+  var secondaryError = error.secondaryError;
+  if (secondaryError instanceof Error) {
+    return secondaryError.message;
   }
+  return error.message;
 };
 export var getErrorTraceContext = function getErrorTraceContext(error) {
-  if (isKnownErrorType(error) && !!error.secondaryError) {
-    if (isRequestError(error.secondaryError)) {
-      var _error$secondaryError;
-      return (_error$secondaryError = error.secondaryError.metadata) === null || _error$secondaryError === void 0 ? void 0 : _error$secondaryError.traceContext;
-    } else if (isMediaFileStateError(error.secondaryError)) {
-      var _error$secondaryError2;
-      return (_error$secondaryError2 = error.secondaryError.details) === null || _error$secondaryError2 === void 0 || (_error$secondaryError2 = _error$secondaryError2.metadata) === null || _error$secondaryError2 === void 0 ? void 0 : _error$secondaryError2.traceContext;
-    }
+  var secondaryError = error.secondaryError;
+  if (isCommonMediaClientError(secondaryError)) {
+    var _secondaryError$metad;
+    return (_secondaryError$metad = secondaryError.metadata) === null || _secondaryError$metad === void 0 ? void 0 : _secondaryError$metad.traceContext;
   }
 };
 export var getRenderErrorRequestMetadata = function getRenderErrorRequestMetadata(error) {
-  if (isKnownErrorType(error) && !!error.secondaryError) {
-    if (isRequestError(error.secondaryError)) {
-      return error.secondaryError.metadata;
-    } else if (isMediaFileStateError(error.secondaryError)) {
-      var _error$secondaryError3;
-      return (_error$secondaryError3 = error.secondaryError.details) === null || _error$secondaryError3 === void 0 ? void 0 : _error$secondaryError3.metadata;
-    }
+  var secondaryError = error.secondaryError;
+  if (isCommonMediaClientError(secondaryError)) {
+    return secondaryError.metadata;
   }
 };
 export var extractErrorInfo = function extractErrorInfo(error, metadataTraceContext) {

package/dist/esm/utils/ufoExperiences.js

@@ -8,7 +8,7 @@ import { extractErrorInfo, getRenderErrorRequestMetadata } from './analytics';
 import { MediaCardError } from '../errors';
 import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
 var packageName = "@atlaskit/media-card";
-var packageVersion = "78.18.2";
+var packageVersion = "78.18.3";
 var concurrentExperience;
 var getExperience = function getExperience(id) {
   if (!concurrentExperience) {

package/dist/types/errors.d.ts

@@ -36,7 +36,6 @@ export declare class ImageLoadError extends MediaCardError {
     constructor(source?: CardPreview['source']);
 }
 export declare function isMediaCardError(err: Error): err is MediaCardError;
-export declare function isKnownErrorType(err: Error): boolean;
 export declare const isLocalPreviewError: (err: Error) => err is LocalPreviewError;
 export declare const isRemotePreviewError: (err: Error) => err is LocalPreviewError;
 export declare const isUnsupportedLocalPreviewError: (err: Error) => boolean;

package/dist/types/inline/mediaInlineCardAnalytics.d.ts

@@ -3,7 +3,7 @@ import { type RenderInlineCardFailedEventPayload, type RenderInlineCardSucceeded
 import { MediaCardError } from '../errors';
 import type { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
 export declare const getSucceededStatusPayload: (fileState?: FileState) => RenderInlineCardSucceededEventPayload;
-export declare const getErrorStatusPayload: (error: MediaCardError, fileState?: FileState) => RenderInlineCardFailedEventPayload;
-export declare const getFailedProcessingStatusPayload: (fileState?: FileState) => RenderInlineCardFailedEventPayload;
+export declare const getErrorStatusPayload: (fileId: string, error: MediaCardError, fileState?: FileState) => RenderInlineCardFailedEventPayload;
+export declare const getFailedProcessingStatusPayload: (fileId: string, fileState?: FileState) => RenderInlineCardFailedEventPayload;
 export declare const fireFailedOperationalEvent: (fileState: FileState, error?: MediaCardError, failReason?: 'failed-processing', createAnalyticsEvent?: CreateUIAnalyticsEvent) => void;
 export declare const fireSucceededOperationalEvent: (fileState: FileState, createAnalyticsEvent?: CreateUIAnalyticsEvent) => void;

package/dist/types-ts4.5/errors.d.ts

@@ -36,7 +36,6 @@ export declare class ImageLoadError extends MediaCardError {
     constructor(source?: CardPreview['source']);
 }
 export declare function isMediaCardError(err: Error): err is MediaCardError;
-export declare function isKnownErrorType(err: Error): boolean;
 export declare const isLocalPreviewError: (err: Error) => err is LocalPreviewError;
 export declare const isRemotePreviewError: (err: Error) => err is LocalPreviewError;
 export declare const isUnsupportedLocalPreviewError: (err: Error) => boolean;

package/dist/types-ts4.5/inline/mediaInlineCardAnalytics.d.ts

@@ -3,7 +3,7 @@ import { type RenderInlineCardFailedEventPayload, type RenderInlineCardSucceeded
 import { MediaCardError } from '../errors';
 import type { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
 export declare const getSucceededStatusPayload: (fileState?: FileState) => RenderInlineCardSucceededEventPayload;
-export declare const getErrorStatusPayload: (error: MediaCardError, fileState?: FileState) => RenderInlineCardFailedEventPayload;
-export declare const getFailedProcessingStatusPayload: (fileState?: FileState) => RenderInlineCardFailedEventPayload;
+export declare const getErrorStatusPayload: (fileId: string, error: MediaCardError, fileState?: FileState) => RenderInlineCardFailedEventPayload;
+export declare const getFailedProcessingStatusPayload: (fileId: string, fileState?: FileState) => RenderInlineCardFailedEventPayload;
 export declare const fireFailedOperationalEvent: (fileState: FileState, error?: MediaCardError, failReason?: 'failed-processing', createAnalyticsEvent?: CreateUIAnalyticsEvent) => void;
 export declare const fireSucceededOperationalEvent: (fileState: FileState, createAnalyticsEvent?: CreateUIAnalyticsEvent) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/media-card",
-	"version": "78.18.2",
+	"version": "78.18.3",
 	"description": "Includes all media card related components, CardView, CardViewSmall, Card...",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -39,7 +39,7 @@
 		"@atlaskit/dropdown-menu": "^12.24.0",
 		"@atlaskit/editor-shared-styles": "^3.2.0",
 		"@atlaskit/icon": "^23.4.0",
-		"@atlaskit/media-client": "^29.1.0",
+		"@atlaskit/media-client": "^30.0.0",
 		"@atlaskit/media-client-react": "^2.6.0",
 		"@atlaskit/media-common": "^11.7.0",
 		"@atlaskit/media-file-preview": "^0.9.0",
@@ -76,8 +76,8 @@
 		"@atlaskit/inline-message": "^13.0.0",
 		"@atlaskit/media-core": "^34.4.0",
 		"@atlaskit/media-picker": "^67.0.0",
-		"@atlaskit/media-state": "^1.4.0",
-		"@atlaskit/media-test-data": "^2.8.0",
+		"@atlaskit/media-state": "^1.5.0",
+		"@atlaskit/media-test-data": "^2.9.0",
 		"@atlaskit/media-test-helpers": "^34.7.0",
 		"@atlaskit/radio": "^7.0.0",
 		"@atlaskit/range": "^8.0.0",