@atlaskit/media-card 74.3.1 → 74.4.0

package/dist/esm/card/ui/unhandledErrorCard/types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/errors.js

@@ -142,11 +142,20 @@ export var isUnsupportedLocalPreviewError = function isUnsupportedLocalPreviewEr
 };
 export function isImageLoadError(err) {
   return err instanceof ImageLoadError;
-} // In a try/catch statement, the error caught is the type of any.
+} // In a try/catch statement, the error caught is the type of unknown.
 // We can use this helper to ensure that the error handled is the type of MediaCardError if unsure
+// If updatePrimaryReason is true, if it's a MediaCardError already, it will update it's primary reason
 
-export var ensureMediaCardError = function ensureMediaCardError(primaryReason, error) {
-  return isMediaCardError(error) ? error : new MediaCardError(primaryReason, error);
+export var ensureMediaCardError = function ensureMediaCardError(primaryReason, error, updatePrimaryReason) {
+  if (isMediaCardError(error)) {
+    if (updatePrimaryReason && error.primaryReason !== primaryReason) {
+      return new MediaCardError(primaryReason, error.secondaryError);
+    }
+
+    return error;
+  }
+
+  return new MediaCardError(primaryReason, error);
 };
 export var isUploadError = function isUploadError(error) {
   return error && error.primaryReason === 'upload';

package/dist/esm/inline/loader.js

@@ -46,7 +46,7 @@ var MediaInlineCardLoader = /*#__PURE__*/function (_React$PureComponent) {
     key: "componentDidMount",
     value: function () {
       var _componentDidMount = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-        var _yield$Promise$all, _yield$Promise$all2, mediaClient, cardModule, mediaCardErrorBoundaryModule;
+        var _yield$Promise$all, _yield$Promise$all2, mediaClient, cardModule, mediaInlineErrorBoundaryModule;
 
         return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) {
@@ -66,17 +66,17 @@ var MediaInlineCardLoader = /*#__PURE__*/function (_React$PureComponent) {
                 '@atlaskit/media-client'), import(
                 /* webpackChunkName: "@atlaskit-internal_inline-media-card" */
                 './mediaInlineCard'), import(
-                /* webpackChunkName: "@atlaskit-internal_media-card-error-boundary" */
-                '../utils/media-card-analytics-error-boundary')]);
+                /* webpackChunkName: "@atlaskit-internal_media-inline-error-boundary" */
+                './mediaInlineAnalyticsErrorBoundary')]);
 
               case 5:
                 _yield$Promise$all = _context.sent;
                 _yield$Promise$all2 = _slicedToArray(_yield$Promise$all, 3);
                 mediaClient = _yield$Promise$all2[0];
                 cardModule = _yield$Promise$all2[1];
-                mediaCardErrorBoundaryModule = _yield$Promise$all2[2];
+                mediaInlineErrorBoundaryModule = _yield$Promise$all2[2];
                 MediaInlineCardLoader.MediaInlineCard = mediaClient.withMediaClient(cardModule.MediaInlineCard);
-                MediaInlineCardLoader.ErrorBoundary = mediaCardErrorBoundaryModule.default;
+                MediaInlineCardLoader.ErrorBoundary = mediaInlineErrorBoundaryModule.default;
 
                 if (this.isMounted) {
                   this.setState({

package/dist/esm/inline/mediaInlineAnalyticsErrorBoundary.js

@@ -0,0 +1,99 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+import React from 'react';
+import { withMediaAnalyticsContext } from '@atlaskit/media-common';
+import { withAnalyticsEvents } from '@atlaskit/analytics-next';
+import { fireMediaCardEvent } from '../utils/analytics';
+
+var WrappedMediaInlineAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Component) {
+  _inherits(WrappedMediaInlineAnalyticsErrorBoundary, _React$Component);
+
+  var _super = _createSuper(WrappedMediaInlineAnalyticsErrorBoundary);
+
+  function WrappedMediaInlineAnalyticsErrorBoundary(props) {
+    var _this;
+
+    _classCallCheck(this, WrappedMediaInlineAnalyticsErrorBoundary);
+
+    _this = _super.call(this, props);
+
+    _defineProperty(_assertThisInitialized(_this), "fireOperationalEvent", function (error, info) {
+      var _window, _window$navigator;
+
+      var _this$props = _this.props,
+          _this$props$data = _this$props.data,
+          data = _this$props$data === void 0 ? {} : _this$props$data,
+          createAnalyticsEvent = _this$props.createAnalyticsEvent;
+      var payload = {
+        eventType: 'operational',
+        action: 'failed',
+        actionSubject: 'mediaInlineRender',
+        attributes: _objectSpread({
+          browserInfo: (_window = window) !== null && _window !== void 0 && (_window$navigator = _window.navigator) !== null && _window$navigator !== void 0 && _window$navigator.userAgent ? window.navigator.userAgent : 'unknown',
+          error: error,
+          failReason: 'unexpected-error',
+          info: info
+        }, data)
+      };
+      fireMediaCardEvent(payload, createAnalyticsEvent);
+    });
+
+    _this.state = {
+      hasError: false
+    };
+    return _this;
+  }
+
+  _createClass(WrappedMediaInlineAnalyticsErrorBoundary, [{
+    key: "componentDidCatch",
+    value: function componentDidCatch(error, info) {
+      try {
+        this.fireOperationalEvent(error, info);
+        this.setState({
+          hasError: true
+        });
+      } catch (e) {}
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var hasError = this.state.hasError;
+      var children = this.props.children;
+
+      if (hasError) {
+        // TODO refactor error boundary for inline card https://product-fabric.atlassian.net/browse/MEX-2140
+        return /*#__PURE__*/React.createElement(React.Fragment, null);
+      }
+
+      return children;
+    }
+  }]);
+
+  return WrappedMediaInlineAnalyticsErrorBoundary;
+}(React.Component);
+
+_defineProperty(WrappedMediaInlineAnalyticsErrorBoundary, "displayName", 'MediaInlineAnalyticsErrorBoundary');
+
+var packageName = "@atlaskit/media-card";
+var packageVersion = "74.4.0";
+var MediaInlineAnalyticsErrorBoundary = withMediaAnalyticsContext({
+  packageVersion: packageVersion,
+  packageName: packageName,
+  componentName: 'mediaInlineCard',
+  component: 'mediaInlineCard'
+})(withAnalyticsEvents()(WrappedMediaInlineAnalyticsErrorBoundary));
+export default MediaInlineAnalyticsErrorBoundary;

package/dist/esm/utils/analytics.js

@@ -15,7 +15,6 @@ var relevantFlags = {
   observedWidth: true,
   mediaInline: false,
   folderUploads: false,
-  mediaUploadApiV2: true,
   memoryCacheLogging: true
 };
 export var LOGGED_FEATURE_FLAGS = filterFeatureFlagNames(relevantFlags);
@@ -55,7 +54,7 @@ export var getRenderCommencedEventPayload = function getRenderCommencedEventPayl
     }
   };
 };
-export var getRenderSucceededEventPayload = function getRenderSucceededEventPayload(fileAttributes, performanceAttributes, ssrReliability, traceContext) {
+export var getRenderSucceededEventPayload = function getRenderSucceededEventPayload(fileAttributes, performanceAttributes, ssrReliability, traceContext, metadataTraceContext) {
   return {
     eventType: 'operational',
     action: 'succeeded',
@@ -65,7 +64,8 @@ export var getRenderSucceededEventPayload = function getRenderSucceededEventPayl
       performanceAttributes: performanceAttributes,
       status: 'success',
       ssrReliability: ssrReliability,
-      traceContext: traceContext
+      traceContext: traceContext,
+      metadataTraceContext: metadataTraceContext
     }
   };
 };
@@ -127,19 +127,27 @@ export var getRenderErrorErrorDetail = function getRenderErrorErrorDetail(error)
     return error.message;
   }
 };
+export var getErrorTraceContext = function getErrorTraceContext(error) {
+  if (isMediaCardError(error) && !!error.secondaryError && isRequestError(error.secondaryError)) {
+    var _error$secondaryError;
+
+    return (_error$secondaryError = error.secondaryError.metadata) === null || _error$secondaryError === void 0 ? void 0 : _error$secondaryError.traceContext;
+  }
+};
 export var getRenderErrorRequestMetadata = function getRenderErrorRequestMetadata(error) {
   if (isMediaCardError(error) && !!error.secondaryError && isRequestError(error.secondaryError)) {
     return error.secondaryError.metadata;
   }
 };
-export var extractErrorInfo = function extractErrorInfo(error) {
+export var extractErrorInfo = function extractErrorInfo(error, metadataTraceContext) {
   return {
     failReason: getRenderErrorFailReason(error),
     error: getRenderErrorErrorReason(error),
-    errorDetail: getRenderErrorErrorDetail(error)
+    errorDetail: getRenderErrorErrorDetail(error),
+    metadataTraceContext: metadataTraceContext !== null && metadataTraceContext !== void 0 ? metadataTraceContext : getErrorTraceContext(error)
   };
 };
-export var getRenderErrorEventPayload = function getRenderErrorEventPayload(fileAttributes, performanceAttributes, error, ssrReliability, traceContext) {
+export var getRenderErrorEventPayload = function getRenderErrorEventPayload(fileAttributes, performanceAttributes, error, ssrReliability, traceContext, metadataTraceContext) {
   return {
     eventType: 'operational',
     action: 'failed',
@@ -148,14 +156,30 @@ export var getRenderErrorEventPayload = function getRenderErrorEventPayload(file
       fileAttributes: fileAttributes,
       performanceAttributes: performanceAttributes,
       status: 'fail'
-    }, extractErrorInfo(error)), {}, {
+    }, extractErrorInfo(error, metadataTraceContext)), {}, {
       request: getRenderErrorRequestMetadata(error),
       ssrReliability: ssrReliability,
       traceContext: traceContext
     })
   };
 };
-export var getRenderFailedFileStatusPayload = function getRenderFailedFileStatusPayload(fileAttributes, performanceAttributes, ssrReliability, traceContext) {
+export var getErrorEventPayload = function getErrorEventPayload(cardStatus, fileAttributes, error, ssrReliability, traceContext, metadataTraceContext) {
+  return {
+    eventType: 'operational',
+    action: 'nonCriticalFail',
+    actionSubject: 'mediaCardRender',
+    attributes: _objectSpread(_objectSpread({
+      fileAttributes: fileAttributes,
+      status: 'fail'
+    }, extractErrorInfo(error, metadataTraceContext)), {}, {
+      request: getRenderErrorRequestMetadata(error),
+      ssrReliability: ssrReliability,
+      traceContext: traceContext,
+      cardStatus: cardStatus
+    })
+  };
+};
+export var getRenderFailedFileStatusPayload = function getRenderFailedFileStatusPayload(fileAttributes, performanceAttributes, ssrReliability, traceContext, metadataTraceContext) {
   return {
     eventType: 'operational',
     action: 'failed',
@@ -166,7 +190,8 @@ export var getRenderFailedFileStatusPayload = function getRenderFailedFileStatus
       status: 'fail',
       failReason: 'failed-processing',
       ssrReliability: ssrReliability,
-      traceContext: traceContext
+      traceContext: traceContext,
+      metadataTraceContext: metadataTraceContext
     }
   };
 };

package/dist/esm/utils/ufoExperiences.js

@@ -9,7 +9,7 @@ import { extractErrorInfo, getRenderErrorRequestMetadata, LOGGED_FEATURE_FLAG_KE
 import { MediaCardError } from '../errors';
 import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
 var packageName = "@atlaskit/media-card";
-var packageVersion = "74.3.1";
+var packageVersion = "74.4.0";
 var concurrentExperience;
 
 var getExperience = function getExperience(id) {

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/media-card",
-	"version": "74.3.1",
+	"version": "74.4.0",
 	"sideEffects": false
 }

package/dist/types/card/card.d.ts

@@ -39,7 +39,7 @@ export declare class CardBase extends Component<CardBaseProps, CardState> {
     private fireCommencedEvent;
     private fireCopiedEvent;
     private fireScreenEvent;
-    private fireLocalPreviewErrorEvent;
+    private fireNonCriticalErrorEvent;
     private safeSetState;
     unsubscribe: () => void;
     get actions(): CardAction[];

package/dist/types/card/cardAnalytics.d.ts

@@ -3,7 +3,8 @@ import { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { SSRStatus } from '../utils/analytics';
 import { CardStatus } from '../types';
 import { MediaCardError } from '../errors';
-export declare const fireOperationalEvent: (createAnalyticsEvent: CreateUIAnalyticsEvent, status: CardStatus, fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes, ssrReliability: SSRStatus, error: MediaCardError | undefined, traceContext: MediaTraceContext) => void;
+export declare const fireOperationalEvent: (createAnalyticsEvent: CreateUIAnalyticsEvent, status: CardStatus, fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes, ssrReliability: SSRStatus, error: MediaCardError | undefined, traceContext: MediaTraceContext, metadataTraceContext?: MediaTraceContext | undefined) => void;
 export declare const fireCommencedEvent: (createAnalyticsEvent: CreateUIAnalyticsEvent, fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes, traceContext: MediaTraceContext) => void;
 export declare const fireCopiedEvent: (createAnalyticsEvent: CreateUIAnalyticsEvent, fileId: string, cardRef: HTMLDivElement) => void;
 export declare const fireScreenEvent: (createAnalyticsEvent: CreateUIAnalyticsEvent, fileAttributes: FileAttributes) => void;
+export declare const fireNonCriticalErrorEvent: (createAnalyticsEvent: CreateUIAnalyticsEvent, cardStatus: CardStatus, fileAttributes: FileAttributes, ssrReliability: SSRStatus, error: MediaCardError | undefined, traceContext: MediaTraceContext, metadataTraceContext?: MediaTraceContext | undefined) => void;

package/dist/types/card/cardState.d.ts

@@ -1,5 +1,10 @@
 import { FileState } from '@atlaskit/media-client';
 import { MediaFeatureFlags } from '@atlaskit/media-common';
 import { CardState } from '../types';
-export declare const createStateUpdater: (newState: Partial<CardState>) => (prevState: CardState) => Pick<CardState, keyof CardState>;
+import { MediaCardError } from '../errors';
+/**
+ * From docs: "Both state and props received by the updater function are guaranteed to be up-to-date.
+ * The output of the updater is shallowly merged with state."
+ */
+export declare const createStateUpdater: (newState: Partial<CardState>, fireErrorEvent: (error: MediaCardError) => void) => (prevState: CardState) => Partial<CardState>;
 export declare const getCardStateFromFileState: (fileState: FileState, isBannedLocalPreview: boolean, featureFlags?: MediaFeatureFlags | undefined) => Partial<CardState>;

package/dist/types/card/getCardPreview/index.d.ts

@@ -19,7 +19,7 @@ export declare type CardPreviewParams = {
     id: string;
     dimensions?: CardDimensions;
     filePreview?: FilePreview | Promise<FilePreview>;
-    onLocalPreviewError?: (error: MediaCardError) => void;
+    onLocalPreviewError: (error: MediaCardError) => void;
     isRemotePreviewReady: boolean;
     imageUrlParams: MediaStoreGetFileImageParams;
     mediaBlobUrlAttrs?: MediaBlobUrlAttrs;

package/dist/types/card/media-card-analytics-error-boundary.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { MediaFeatureFlags } from '@atlaskit/media-common';
+import { CardDimensions, CardOnClickCallback } from '../types';
+import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
+export declare type MediaCardAnalyticsErrorBoundaryProps = {
+    dimensions?: CardDimensions;
+    data?: {
+        [k: string]: any;
+    };
+    onClick?: CardOnClickCallback;
+    featureFlags?: MediaFeatureFlags;
+} & WithAnalyticsEventsProps;
+declare const MediaCardAnalyticsErrorBoundary: React.ComponentType<MediaCardAnalyticsErrorBoundaryProps & WithAnalyticsEventsProps>;
+export default MediaCardAnalyticsErrorBoundary;

package/dist/types/card/ui/unhandledErrorCard/index.d.ts

@@ -0,0 +1,7 @@
+/** @jsx jsx */
+import { Component } from 'react';
+import { jsx } from '@emotion/react';
+import { UnhandledErrorCardProps } from './types';
+export declare class UnhandledErrorCard extends Component<UnhandledErrorCardProps, {}> {
+    render(): jsx.JSX.Element;
+}

package/dist/types/card/ui/unhandledErrorCard/types.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { CardDimensions } from '../../../types';
+export interface UnhandledErrorCardProps {
+    dimensions?: CardDimensions;
+    onClick?: (event: React.MouseEvent<HTMLElement>) => void;
+}

package/dist/types/errors.d.ts

@@ -5,7 +5,7 @@ import { CardPreview } from './types';
  */
 export declare type MediaCardErrorPrimaryReason = 'upload' | 'metadata-fetch' | 'error-file-state' | RemotePreviewPrimaryReason | LocalPreviewPrimaryReason | ImageLoadPrimaryReason | SsrPreviewPrimaryReason | 'missing-error-data' | 'preview-fetch';
 export declare type ImageLoadPrimaryReason = 'cache-remote-uri' | 'cache-local-uri' | 'local-uri' | 'remote-uri' | 'external-uri' | 'unknown-uri';
-export declare type RemotePreviewPrimaryReason = 'remote-preview-fetch' | 'remote-preview-not-ready';
+export declare type RemotePreviewPrimaryReason = 'remote-preview-fetch' | 'remote-preview-not-ready' | 'remote-preview-fetch-ssr';
 export declare type LocalPreviewPrimaryReason = 'local-preview-get' | 'local-preview-unsupported' | 'local-preview-rejected' | 'local-preview-image' | 'local-preview-video';
 export declare type SsrPreviewPrimaryReason = 'ssr-client-uri' | 'ssr-client-load' | 'ssr-server-uri' | 'ssr-server-load';
 export declare class MediaCardError extends Error {
@@ -37,5 +37,5 @@ export declare const isLocalPreviewError: (err: Error) => err is LocalPreviewErr
 export declare const isRemotePreviewError: (err: Error) => err is LocalPreviewError;
 export declare const isUnsupportedLocalPreviewError: (err: Error) => boolean;
 export declare function isImageLoadError(err: Error): err is ImageLoadError;
-export declare const ensureMediaCardError: (primaryReason: MediaCardErrorPrimaryReason, error: Error) => MediaCardError;
+export declare const ensureMediaCardError: (primaryReason: MediaCardErrorPrimaryReason, error: Error, updatePrimaryReason?: boolean | undefined) => MediaCardError;
 export declare const isUploadError: (error?: MediaCardError | undefined) => boolean | undefined;

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

@@ -0,0 +1,11 @@
+import React from 'react';
+import { MediaFeatureFlags } from '@atlaskit/media-common';
+import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
+export declare type MediaInlineAnalyticsErrorBoundaryProps = {
+    data?: {
+        [k: string]: any;
+    };
+    featureFlags?: MediaFeatureFlags;
+} & WithAnalyticsEventsProps;
+declare const MediaInlineAnalyticsErrorBoundary: React.ComponentType<MediaInlineAnalyticsErrorBoundaryProps & WithAnalyticsEventsProps>;
+export default MediaInlineAnalyticsErrorBoundary;

package/dist/types/types.d.ts

@@ -75,6 +75,9 @@ export interface CardProps extends SharedCardProps, CardEventProps {
     readonly isLazy?: boolean;
     readonly useInlinePlayer?: boolean;
     readonly shouldOpenMediaViewer?: boolean;
+    /** Imported from MediaViewer. It includes data source like collection name,
+     *  media file list.
+     */
     readonly mediaViewerDataSource?: MediaViewerDataSource;
     readonly contextId?: string;
     readonly shouldEnableDownloadButton?: boolean;

package/dist/types/utils/analytics.d.ts

@@ -2,7 +2,7 @@ import { FileDetails, MediaClientErrorReason, RequestMetadata } from '@atlaskit/
 import { FileAttributes, PerformanceAttributes, OperationalEventPayload, UIEventPayload, WithFileAttributes, WithPerformanceAttributes, SuccessAttributes, FailureAttributes, ScreenEventPayload, ScreenAttributes, MediaTraceContext, WithTraceContext } from '@atlaskit/media-common';
 import { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { MediaCardError, MediaCardErrorPrimaryReason } from '../errors';
-import { CardPreviewSource, CardDimensions } from '../types';
+import { CardPreviewSource, CardDimensions, CardStatus } from '../types';
 export declare type CardPreviewAttributes = {
     fileId: string;
     prevDimensions: CardDimensions | undefined;
@@ -21,6 +21,7 @@ export declare type MediaCardErrorInfo = {
     failReason: FailedErrorFailReason;
     error: MediaClientErrorReason | 'nativeError';
     errorDetail: string;
+    metadataTraceContext?: MediaTraceContext;
 };
 export declare type SSRStatusFail = MediaCardErrorInfo & {
     status: 'fail';
@@ -42,6 +43,23 @@ export declare type RenderFailedEventPayload = OperationalEventPayload<WithFileA
     error?: MediaClientErrorReason | 'nativeError';
     request?: RequestMetadata;
 }, 'failed', 'mediaCardRender'>;
+export declare type ErrorEventPayload = OperationalEventPayload<WithFileAttributes & WithPerformanceAttributes & WithSSRReliability & WithTraceContext & FailureAttributes & {
+    cardStatus: CardStatus;
+    failReason: FailedErrorFailReason | 'failed-processing';
+    error?: MediaClientErrorReason | 'nativeError';
+    request?: RequestMetadata;
+}, 'nonCriticalFail', 'mediaCardRender'>;
+export declare type ErrorBoundaryErrorInfo = {
+    componentStack: string;
+};
+export declare type AnalyticsErrorBoundaryAttributes = {
+    error?: Error | string;
+    info?: ErrorBoundaryErrorInfo;
+    browserInfo: string;
+    failReason: string;
+};
+export declare type AnalyticsErrorBoundaryCardPayload = OperationalEventPayload<AnalyticsErrorBoundaryAttributes, 'failed', 'mediaCardRender'>;
+export declare type AnalyticsErrorBoundaryInlinePayload = OperationalEventPayload<AnalyticsErrorBoundaryAttributes, 'failed', 'mediaInlineRender'>;
 export declare type RenderSucceededEventPayload = OperationalEventPayload<WithFileAttributes & WithPerformanceAttributes & WithSSRReliability & SuccessAttributes & WithTraceContext, 'succeeded', 'mediaCardRender'>;
 export declare type RenderCommencedEventPayload = OperationalEventPayload<WithFileAttributes & WithPerformanceAttributes & WithTraceContext, 'commenced', 'mediaCardRender'>;
 export declare type CacheHitEventPayload = OperationalEventPayload<WithCardPreviewCacheAttributes, 'cache-hit', 'mediaCardCache'>;
@@ -56,21 +74,23 @@ export declare type RenderScreenEventPayload = Omit<ScreenEventPayload<ScreenAtt
         fileAttributes: FileAttributes;
     };
 };
-export declare type MediaCardAnalyticsEventPayload = RenderCommencedEventPayload | RenderSucceededEventPayload | RenderFailedEventPayload | CopiedFileEventPayload | ClickedEventPayload | RenderScreenEventPayload | CacheHitEventPayload | RemoteSuccessEventPayload;
+export declare type MediaCardAnalyticsEventPayload = RenderCommencedEventPayload | RenderSucceededEventPayload | RenderFailedEventPayload | CopiedFileEventPayload | ClickedEventPayload | RenderScreenEventPayload | CacheHitEventPayload | RemoteSuccessEventPayload | ErrorEventPayload | AnalyticsErrorBoundaryCardPayload | AnalyticsErrorBoundaryInlinePayload;
 export declare const getFileAttributes: (metadata: FileDetails, fileStatus?: import("@atlaskit/media-common").FileStatus | undefined) => FileAttributes;
 export declare const getRenderPreviewableCardPayload: (fileAttributes: FileAttributes) => RenderScreenEventPayload;
 export declare const getRenderCommencedEventPayload: (fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes, traceContext: MediaTraceContext) => RenderCommencedEventPayload;
-export declare const getRenderSucceededEventPayload: (fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes, ssrReliability: SSRStatus, traceContext: MediaTraceContext) => RenderSucceededEventPayload;
+export declare const getRenderSucceededEventPayload: (fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes, ssrReliability: SSRStatus, traceContext: MediaTraceContext, metadataTraceContext?: MediaTraceContext | undefined) => RenderSucceededEventPayload;
 export declare const getCacheHitEventPayload: (cardPreviewAttributes: CardPreviewAttributes) => CacheHitEventPayload;
 export declare const getRemoteSuccessEventPayload: (cardPreviewAttributes: CardPreviewAttributes) => RemoteSuccessEventPayload;
 export declare const getRenderFailedExternalUriPayload: (fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes) => RenderFailedEventPayload;
 export declare const getRenderErrorFailReason: (error: MediaCardError) => FailedErrorFailReason;
 export declare const getRenderErrorErrorReason: (error: MediaCardError) => MediaClientErrorReason | 'nativeError';
 export declare const getRenderErrorErrorDetail: (error: MediaCardError) => string;
+export declare const getErrorTraceContext: (error: MediaCardError) => MediaTraceContext | undefined;
 export declare const getRenderErrorRequestMetadata: (error: MediaCardError) => RequestMetadata | undefined;
-export declare const extractErrorInfo: (error: MediaCardError) => MediaCardErrorInfo;
-export declare const getRenderErrorEventPayload: (fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes, error: MediaCardError, ssrReliability: SSRStatus, traceContext: MediaTraceContext) => RenderFailedEventPayload;
-export declare const getRenderFailedFileStatusPayload: (fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes, ssrReliability: SSRStatus, traceContext: MediaTraceContext) => RenderFailedEventPayload;
+export declare const extractErrorInfo: (error: MediaCardError, metadataTraceContext?: MediaTraceContext | undefined) => MediaCardErrorInfo;
+export declare const getRenderErrorEventPayload: (fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes, error: MediaCardError, ssrReliability: SSRStatus, traceContext: MediaTraceContext, metadataTraceContext?: MediaTraceContext | undefined) => RenderFailedEventPayload;
+export declare const getErrorEventPayload: (cardStatus: CardStatus, fileAttributes: FileAttributes, error: MediaCardError, ssrReliability: SSRStatus, traceContext: MediaTraceContext, metadataTraceContext?: MediaTraceContext | undefined) => ErrorEventPayload;
+export declare const getRenderFailedFileStatusPayload: (fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes, ssrReliability: SSRStatus, traceContext: MediaTraceContext, metadataTraceContext?: MediaTraceContext | undefined) => RenderFailedEventPayload;
 export declare const getCopiedFilePayload: (fileId: string) => CopiedFileEventPayload;
 export declare function fireMediaCardEvent(payload: MediaCardAnalyticsEventPayload, createAnalyticsEvent?: CreateUIAnalyticsEvent): void;
 export declare const createAndFireMediaCardEvent: (payload: MediaCardAnalyticsEventPayload) => (createAnalyticsEvent: CreateUIAnalyticsEvent) => import("@atlaskit/analytics-next").UIAnalyticsEvent;

package/example-helpers/styles.ts

@@ -84,6 +84,19 @@ export const externalIdentifierWrapperStyles = css`
   }
 `;
 
+export const unhandledErrorCardWrapperStyles = css`
+  padding: 20px;
+
+  > div:first-child {
+    display: flex;
+    margin-bottom: 20px;
+  }
+
+  label {
+    margin-right: 20px;
+  }
+`;
+
 export const inlineCardVideoWrapperItemStyles = css`
   padding: 10px;
   border: 1px solid ${token('color.border.bold', 'black')};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/media-card",
-  "version": "74.3.1",
+  "version": "74.4.0",
   "description": "Includes all media card related components, CardView, CardViewSmall, Card...",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -30,15 +30,15 @@
   "dependencies": {
     "@atlaskit/analytics-next": "^8.2.0",
     "@atlaskit/dropdown-menu": "^11.5.0",
-    "@atlaskit/editor-shared-styles": "^2.2.0",
+    "@atlaskit/editor-shared-styles": "^2.3.0",
     "@atlaskit/icon": "^21.11.0",
-    "@atlaskit/media-client": "^19.0.0",
-    "@atlaskit/media-common": "^2.17.0",
+    "@atlaskit/media-client": "^19.1.0",
+    "@atlaskit/media-common": "^2.18.0",
     "@atlaskit/media-ui": "^22.2.0",
-    "@atlaskit/media-viewer": "^47.2.0",
+    "@atlaskit/media-viewer": "^47.3.0",
     "@atlaskit/spinner": "^15.3.0",
     "@atlaskit/theme": "^12.2.0",
-    "@atlaskit/tokens": "^0.12.0",
+    "@atlaskit/tokens": "^0.13.0",
     "@atlaskit/tooltip": "^17.6.0",
     "@atlaskit/ufo": "^0.1.0",
     "@babel/runtime": "^7.0.0",
@@ -61,11 +61,12 @@
     "@atlaskit/docs": "*",
     "@atlaskit/inline-message": "^11.4.0",
     "@atlaskit/media-core": "^34.0.0",
-    "@atlaskit/media-picker": "^64.0.0",
-    "@atlaskit/media-test-helpers": "^30.0.0",
+    "@atlaskit/media-picker": "^64.1.0",
+    "@atlaskit/media-test-helpers": "^30.1.0",
     "@atlaskit/radio": "^5.4.0",
     "@atlaskit/range": "^7.0.0",
-    "@atlaskit/select": "^16.0.0",
+    "@atlaskit/section-message": "^6.3.0",
+    "@atlaskit/select": "^16.1.0",
     "@atlaskit/ssr": "*",
     "@atlaskit/toggle": "^12.5.0",
     "@atlaskit/visual-regression": "*",

package/report.api.md

@@ -1,4 +1,4 @@
-<!-- API Report Version: 2.2 -->
+<!-- API Report Version: 2.3 -->
 
 ## API Report File for "@atlaskit/media-card"
 
@@ -147,7 +147,6 @@ export interface CardProps extends SharedCardProps, CardEventProps {
   readonly isLazy?: boolean;
   // (undocumented)
   readonly mediaClient: MediaClient;
-  // (undocumented)
   readonly mediaViewerDataSource?: MediaViewerDataSource;
   // (undocumented)
   readonly shouldEnableDownloadButton?: boolean;
@@ -333,6 +332,7 @@ export { NumericalCardDimensions };
 // @public (undocumented)
 type RemotePreviewPrimaryReason =
   | 'remote-preview-fetch'
+  | 'remote-preview-fetch-ssr'
   | 'remote-preview-not-ready';
 
 // @public (undocumented)

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

@@ -1,59 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _mediaCommon = require("@atlaskit/media-common");
-
-var _AnalyticsErrorBoundary = _interopRequireDefault(require("@atlaskit/analytics-next/AnalyticsErrorBoundary"));
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-var MediaCardAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(MediaCardAnalyticsErrorBoundary, _React$Component);
-
-  var _super = _createSuper(MediaCardAnalyticsErrorBoundary);
-
-  function MediaCardAnalyticsErrorBoundary() {
-    (0, _classCallCheck2.default)(this, MediaCardAnalyticsErrorBoundary);
-    return _super.apply(this, arguments);
-  }
-
-  (0, _createClass2.default)(MediaCardAnalyticsErrorBoundary, [{
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          _this$props$data = _this$props.data,
-          data = _this$props$data === void 0 ? {} : _this$props$data,
-          children = _this$props.children;
-      return /*#__PURE__*/_react.default.createElement(_AnalyticsErrorBoundary.default, {
-        channel: _mediaCommon.ANALYTICS_MEDIA_CHANNEL,
-        data: data
-      }, children);
-    }
-  }]);
-  return MediaCardAnalyticsErrorBoundary;
-}(_react.default.Component);
-
-exports.default = MediaCardAnalyticsErrorBoundary;
-(0, _defineProperty2.default)(MediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');

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

@@ -1,19 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import { ANALYTICS_MEDIA_CHANNEL } from '@atlaskit/media-common';
-import AnalyticsErrorBoundary from '@atlaskit/analytics-next/AnalyticsErrorBoundary';
-export default class MediaCardAnalyticsErrorBoundary extends React.Component {
-  render() {
-    const {
-      data = {},
-      children
-    } = this.props;
-    return /*#__PURE__*/React.createElement(AnalyticsErrorBoundary, {
-      channel: ANALYTICS_MEDIA_CHANNEL,
-      data: data
-    }, children);
-  }
-
-}
-
-_defineProperty(MediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');