@atlaskit/media-card 77.1.1 → 77.1.2

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/media-card
 
+## 77.1.2
+
+### Patch Changes
+
+- [#41371](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41371) [`a5766038a35`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a5766038a35) - Fix TS errors in AFM
+- [#41070](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41070) [`d86446f88c8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d86446f88c8) - The UFO experience is aborted if it hasn't completed when Card is unmounted
+- Updated dependencies
+
 ## 77.1.1
 
 ### Patch Changes

package/dist/cjs/card/card.js

@@ -49,7 +49,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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 packageName = "@atlaskit/media-card";
-var packageVersion = "77.1.1";
+var packageVersion = "77.1.2";
 var CardBase = exports.CardBase = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(CardBase, _Component);
   var _super = _createSuper(CardBase);
@@ -117,8 +117,7 @@ var CardBase = exports.CardBase = /*#__PURE__*/function (_Component) {
       var _this$props2 = _this.props,
         _this$props2$dimensio = _this$props2.dimensions,
         dimensions = _this$props2$dimensio === void 0 ? {} : _this$props2$dimensio,
-        mediaClient = _this$props2.mediaClient,
-        createAnalyticsEvent = _this$props2.createAnalyticsEvent;
+        mediaClient = _this$props2.mediaClient;
       return {
         mediaClient: mediaClient,
         id: id,
@@ -128,8 +127,6 @@ var CardBase = exports.CardBase = /*#__PURE__*/function (_Component) {
         isRemotePreviewReady: (0, _mediaClient2.isImageRepresentationReady)(fileState),
         imageUrlParams: _this.getImageURLParams(identifier),
         mediaBlobUrlAttrs: _this.getMediaBlobUrlAttrs(identifier, fileState),
-        createAnalyticsEvent: createAnalyticsEvent,
-        featureFlags: _this.props.featureFlags,
         traceContext: _this.traceContext
       };
     });
@@ -768,10 +765,8 @@ var CardBase = exports.CardBase = /*#__PURE__*/function (_Component) {
         mediaClient = _this$props12.mediaClient,
         identifier = _this$props12.identifier,
         dimensions = _this$props12.dimensions,
-        featureFlags = _this$props12.featureFlags,
         useInlinePlayer = _this$props12.useInlinePlayer,
         disableOverlay = _this$props12.disableOverlay,
-        resizeMode = _this$props12.resizeMode,
         ssr = _this$props12.ssr;
       var _this$state4 = this.state,
         isCardVisible = _this$state4.isCardVisible,
@@ -798,7 +793,6 @@ var CardBase = exports.CardBase = /*#__PURE__*/function (_Component) {
       var turnedVisible = !prevIsCardVisible && isCardVisible;
       var hadSSRCardPreview = !!prevCardPreview && (0, _getCardPreview.isSSRClientPreview)(prevCardPreview) && !cardPreview;
       var isNewMediaClient = prevMediaClient !== mediaClient;
-      var fileImageMode = (0, _mediaClient2.imageResizeModeToFileImageMode)(resizeMode);
       this.updateFileStateFlag(fileState);
       if ((0, _mediaClient2.isExternalImageIdentifier)(identifier) && isDiffIdentifier) {
         this.fireCommencedEvent();
@@ -837,9 +831,6 @@ var CardBase = exports.CardBase = /*#__PURE__*/function (_Component) {
         fileState: fileState,
         prevDimensions: prevDimensions,
         dimensions: dimensions,
-        identifier: identifier,
-        fileImageMode: fileImageMode,
-        featureFlags: featureFlags,
         hasCardPreview: !!cardPreview,
         isBannedLocalPreview: isBannedLocalPreview,
         wasResolvedUpfrontPreview: wasResolvedUpfrontPreview
@@ -873,6 +864,7 @@ var CardBase = exports.CardBase = /*#__PURE__*/function (_Component) {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       var _getDocument2;
+      this.fireAbortedEvent();
       this.hasBeenMounted = false;
       this.unsubscribe();
       (_getDocument2 = (0, _document.default)()) === null || _getDocument2 === void 0 || _getDocument2.removeEventListener('copy', this.fireCopiedEvent);
@@ -911,8 +903,7 @@ var CardBase = exports.CardBase = /*#__PURE__*/function (_Component) {
         occurrenceKey: occurrenceKey
       }).subscribe({
         next: function next(fileState) {
-          var featureFlags = _this2.props.featureFlags;
-          var newState = (0, _cardState.getCardStateFromFileState)(fileState, isBannedLocalPreview, featureFlags);
+          var newState = (0, _cardState.getCardStateFromFileState)(fileState, isBannedLocalPreview);
           _this2.safeSetState(newState);
         },
         error: function error(e) {
@@ -959,6 +950,19 @@ var CardBase = exports.CardBase = /*#__PURE__*/function (_Component) {
       createAnalyticsEvent && (0, _cardAnalytics.fireOperationalEvent)(createAnalyticsEvent, status, this.fileAttributes, this.getPerformanceAttributes(), this.ssrReliability, error, this.traceContext, fileState === null || fileState === void 0 ? void 0 : fileState.metadataTraceContext);
       (0, _ufoExperiences.completeUfoExperience)(this.internalOccurrenceKey, status, this.fileAttributes, this.fileStateFlags, this.ssrReliability, error);
     }
+  }, {
+    key: "fireAbortedEvent",
+    value: function fireAbortedEvent() {
+      var fileAttributes = this.fileAttributes,
+        fileStateFlags = this.fileStateFlags,
+        ssrReliability = this.ssrReliability;
+      // UFO won't abort if it's already in a final state (succeeded, failed, aborted, etc)
+      (0, _ufoExperiences.abortUfoExperience)(this.internalOccurrenceKey, {
+        fileAttributes: fileAttributes,
+        fileStateFlags: fileStateFlags,
+        ssrReliability: ssrReliability
+      });
+    }
   }, {
     key: "fireCommencedEvent",
     value: function fireCommencedEvent() {

package/dist/cjs/card/cardState.js

@@ -24,7 +24,7 @@ var createStateUpdater = exports.createStateUpdater = function createStateUpdate
     return newState;
   };
 };
-var getCardStateFromFileState = exports.getCardStateFromFileState = function getCardStateFromFileState(fileState, isBannedLocalPreview, featureFlags) {
+var getCardStateFromFileState = exports.getCardStateFromFileState = function getCardStateFromFileState(fileState, isBannedLocalPreview) {
   var status = (0, _getCardStatus.getCardStatus)(fileState.status, (0, _getCardPreview.extractFilePreviewStatus)(fileState, isBannedLocalPreview));
   var error = status === 'error' && (0, _mediaClient.isErrorFileState)(fileState) ? new _errors.MediaCardError('error-file-state', new Error(fileState.message)) : undefined;
   var progress = status === 'uploading' && fileState.status === 'uploading' ? fileState.progress : 1;

package/dist/cjs/card/getCardPreview/index.js

@@ -96,11 +96,11 @@ var extendAndCachePreview = function extendAndCachePreview(id, mode, preview, me
  */
 var getCardPreview = exports.getCardPreview = /*#__PURE__*/function () {
   var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(_ref) {
-    var mediaClient, id, _ref$dimensions, dimensions, filePreview, onLocalPreviewError, isRemotePreviewReady, imageUrlParams, mediaBlobUrlAttrs, createAnalyticsEvent, featureFlags, traceContext, mode, cachedPreview, dimensionsAreBigger, localPreview, remotePreview;
+    var mediaClient, id, _ref$dimensions, dimensions, filePreview, onLocalPreviewError, isRemotePreviewReady, imageUrlParams, mediaBlobUrlAttrs, traceContext, mode, cachedPreview, dimensionsAreBigger, localPreview, remotePreview;
     return _regenerator.default.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
-          mediaClient = _ref.mediaClient, id = _ref.id, _ref$dimensions = _ref.dimensions, dimensions = _ref$dimensions === void 0 ? {} : _ref$dimensions, filePreview = _ref.filePreview, onLocalPreviewError = _ref.onLocalPreviewError, isRemotePreviewReady = _ref.isRemotePreviewReady, imageUrlParams = _ref.imageUrlParams, mediaBlobUrlAttrs = _ref.mediaBlobUrlAttrs, createAnalyticsEvent = _ref.createAnalyticsEvent, featureFlags = _ref.featureFlags, traceContext = _ref.traceContext;
+          mediaClient = _ref.mediaClient, id = _ref.id, _ref$dimensions = _ref.dimensions, dimensions = _ref$dimensions === void 0 ? {} : _ref$dimensions, filePreview = _ref.filePreview, onLocalPreviewError = _ref.onLocalPreviewError, isRemotePreviewReady = _ref.isRemotePreviewReady, imageUrlParams = _ref.imageUrlParams, mediaBlobUrlAttrs = _ref.mediaBlobUrlAttrs, traceContext = _ref.traceContext;
           mode = imageUrlParams.mode;
           cachedPreview = _cache.default.get(id, mode);
           dimensionsAreBigger = (0, _dimensionComparer.isBigger)(cachedPreview === null || cachedPreview === void 0 ? void 0 : cachedPreview.dimensions, dimensions);
@@ -177,11 +177,8 @@ var shouldResolvePreview = exports.shouldResolvePreview = function shouldResolve
     fileState = _ref3.fileState,
     prevDimensions = _ref3.prevDimensions,
     dimensions = _ref3.dimensions,
-    identifier = _ref3.identifier,
-    fileImageMode = _ref3.fileImageMode,
     hasCardPreview = _ref3.hasCardPreview,
     isBannedLocalPreview = _ref3.isBannedLocalPreview,
-    featureFlags = _ref3.featureFlags,
     wasResolvedUpfrontPreview = _ref3.wasResolvedUpfrontPreview;
   var statusIsPreviewable = (0, _filePreviewStatus.isPreviewableStatus)(status, (0, _filePreviewStatus.extractFilePreviewStatus)(fileState, isBannedLocalPreview));
   var dimensionsAreBigger = (0, _dimensionComparer.isBigger)(prevDimensions, dimensions);

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

@@ -90,7 +90,7 @@ var WrappedMediaCardAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Compo
 }(_react.default.Component);
 (0, _defineProperty2.default)(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
 var packageName = "@atlaskit/media-card";
-var packageVersion = "77.1.1";
+var packageVersion = "77.1.2";
 var MediaCardAnalyticsErrorBoundary = (0, _mediaCommon.withMediaAnalyticsContext)({
   packageVersion: packageVersion,
   packageName: packageName,

package/dist/cjs/card/v2/cardV2.js

@@ -50,7 +50,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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 packageName = "@atlaskit/media-card";
-var packageVersion = "77.1.1";
+var packageVersion = "77.1.2";
 var CardV2Base = exports.CardV2Base = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(CardV2Base, _Component);
   var _super = _createSuper(CardV2Base);
@@ -118,8 +118,7 @@ var CardV2Base = exports.CardV2Base = /*#__PURE__*/function (_Component) {
       var _this$props2 = _this.props,
         _this$props2$dimensio = _this$props2.dimensions,
         dimensions = _this$props2$dimensio === void 0 ? {} : _this$props2$dimensio,
-        mediaClient = _this$props2.mediaClient,
-        createAnalyticsEvent = _this$props2.createAnalyticsEvent;
+        mediaClient = _this$props2.mediaClient;
       return {
         mediaClient: mediaClient,
         id: id,
@@ -129,8 +128,6 @@ var CardV2Base = exports.CardV2Base = /*#__PURE__*/function (_Component) {
         isRemotePreviewReady: (0, _mediaClient2.isImageRepresentationReady)(fileState),
         imageUrlParams: _this.getImageURLParams(identifier),
         mediaBlobUrlAttrs: _this.getMediaBlobUrlAttrs(identifier, fileState),
-        createAnalyticsEvent: createAnalyticsEvent,
-        featureFlags: _this.props.featureFlags,
         traceContext: _this.traceContext
       };
     });
@@ -273,8 +270,7 @@ var CardV2Base = exports.CardV2Base = /*#__PURE__*/function (_Component) {
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "subscribeFileState", function (fileState) {
       var isBannedLocalPreview = _this.state.isBannedLocalPreview;
       if (fileState.status !== 'error') {
-        var featureFlags = _this.props.featureFlags;
-        var newState = (0, _cardState.getCardStateFromFileState)(fileState, isBannedLocalPreview, featureFlags);
+        var newState = (0, _cardState.getCardStateFromFileState)(fileState, isBannedLocalPreview);
         _this.safeSetState(newState);
       } else {
         var e = new _errors.MediaFileStateError(fileState.id, fileState.reason, fileState.message, fileState.details);
@@ -736,7 +732,7 @@ var CardV2Base = exports.CardV2Base = /*#__PURE__*/function (_Component) {
         ssr = _this$props11.ssr,
         dimensions = _this$props11.dimensions;
       if (isCardVisible && (0, _mediaClient2.isFileIdentifier)(identifier)) {
-        this.updateStateForIdentifier(identifier);
+        this.updateStateForIdentifier();
         if (!cardPreview) {
           this.resolveUpfrontPreview(identifier);
         }
@@ -773,10 +769,8 @@ var CardV2Base = exports.CardV2Base = /*#__PURE__*/function (_Component) {
         mediaClient = _this$props12.mediaClient,
         identifier = _this$props12.identifier,
         dimensions = _this$props12.dimensions,
-        featureFlags = _this$props12.featureFlags,
         useInlinePlayer = _this$props12.useInlinePlayer,
         disableOverlay = _this$props12.disableOverlay,
-        resizeMode = _this$props12.resizeMode,
         ssr = _this$props12.ssr;
       var _this$state4 = this.state,
         isCardVisible = _this$state4.isCardVisible,
@@ -803,7 +797,6 @@ var CardV2Base = exports.CardV2Base = /*#__PURE__*/function (_Component) {
       var turnedVisible = !prevIsCardVisible && isCardVisible;
       var hadSSRCardPreview = !!prevCardPreview && (0, _getCardPreview.isSSRClientPreview)(prevCardPreview) && !cardPreview;
       var isNewMediaClient = prevMediaClient !== mediaClient;
-      var fileImageMode = (0, _mediaClient2.imageResizeModeToFileImageMode)(resizeMode);
       this.updateFileStateFlag(fileState);
       if ((0, _mediaClient2.isExternalImageIdentifier)(identifier) && isDiffIdentifier) {
         this.fireCommencedEvent();
@@ -824,7 +817,7 @@ var CardV2Base = exports.CardV2Base = /*#__PURE__*/function (_Component) {
         this.refetchSSRPreview(identifier);
       }
       if ((0, _mediaClient2.isFileIdentifier)(identifier) && (turnedVisible || !!this.subscription && (isNewMediaClient || isDiffIdentifier))) {
-        this.updateStateForIdentifier(identifier);
+        this.updateStateForIdentifier();
       }
       if (this.state.status !== prevState.status) {
         this.fireOperationalEvent();
@@ -842,9 +835,6 @@ var CardV2Base = exports.CardV2Base = /*#__PURE__*/function (_Component) {
         fileState: fileState,
         prevDimensions: prevDimensions,
         dimensions: dimensions,
-        identifier: identifier,
-        fileImageMode: fileImageMode,
-        featureFlags: featureFlags,
         hasCardPreview: !!cardPreview,
         isBannedLocalPreview: isBannedLocalPreview,
         wasResolvedUpfrontPreview: wasResolvedUpfrontPreview
@@ -884,12 +874,13 @@ var CardV2Base = exports.CardV2Base = /*#__PURE__*/function (_Component) {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       var _getDocument2;
+      this.fireAbortedEvent();
       this.hasBeenMounted = false;
       (_getDocument2 = (0, _document.default)()) === null || _getDocument2 === void 0 || _getDocument2.removeEventListener('copy', this.fireCopiedEvent);
     }
   }, {
     key: "updateStateForIdentifier",
-    value: function updateStateForIdentifier(identifier) {
+    value: function updateStateForIdentifier() {
       this.fireCommencedEvent();
       this.setState({
         shouldUpdateStateForIdentifier: true
@@ -954,6 +945,19 @@ var CardV2Base = exports.CardV2Base = /*#__PURE__*/function (_Component) {
       }, this.traceContext);
       (0, _ufoExperiences.startUfoExperience)(this.internalOccurrenceKey);
     }
+  }, {
+    key: "fireAbortedEvent",
+    value: function fireAbortedEvent() {
+      var fileAttributes = this.fileAttributes,
+        fileStateFlags = this.fileStateFlags,
+        ssrReliability = this.ssrReliability;
+      // UFO won't abort if it's already in a final state (succeeded, failed, aborted, etc)
+      (0, _ufoExperiences.abortUfoExperience)(this.internalOccurrenceKey, {
+        fileAttributes: fileAttributes,
+        fileStateFlags: fileStateFlags,
+        ssrReliability: ssrReliability
+      });
+    }
   }, {
     key: "actions",
     get: function get() {

package/dist/cjs/inline/loader.js

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

package/dist/cjs/utils/ufoExperiences.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.startUfoExperience = exports.completeUfoExperience = void 0;
+exports.startUfoExperience = exports.completeUfoExperience = exports.abortUfoExperience = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _ufo = require("@atlaskit/ufo");
 var _mediaCommon = require("@atlaskit/media-common");
@@ -14,7 +14,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 = "77.1.1";
+var packageVersion = "77.1.2";
 var concurrentExperience;
 var getExperience = function getExperience(id) {
   if (!concurrentExperience) {
@@ -62,23 +62,27 @@ var completeUfoExperience = exports.completeUfoExperience = function completeUfo
       break;
   }
 };
+var getBasePayloadAttributes = function getBasePayloadAttributes() {
+  return {
+    packageName: packageName,
+    packageVersion: packageVersion,
+    mediaEnvironment: (0, _mediaClient.getMediaEnvironment)(),
+    mediaRegion: (0, _mediaClient.getMediaRegion)()
+  };
+};
 var succeedUfoExperience = function succeedUfoExperience(id, properties) {
   getExperience(id).success({
-    metadata: _objectSpread(_objectSpread({}, properties), {}, {
-      packageName: packageName,
-      packageVersion: packageVersion,
-      mediaEnvironment: (0, _mediaClient.getMediaEnvironment)(),
-      mediaRegion: (0, _mediaClient.getMediaRegion)()
-    })
+    metadata: _objectSpread(_objectSpread({}, properties), getBasePayloadAttributes())
   });
 };
 var failUfoExperience = function failUfoExperience(id, properties) {
   getExperience(id).failure({
-    metadata: _objectSpread(_objectSpread({}, properties), {}, {
-      packageName: packageName,
-      packageVersion: packageVersion,
-      mediaEnvironment: (0, _mediaClient.getMediaEnvironment)(),
-      mediaRegion: (0, _mediaClient.getMediaRegion)()
-    })
+    metadata: _objectSpread(_objectSpread({}, properties), getBasePayloadAttributes())
+  });
+};
+var abortUfoExperience = exports.abortUfoExperience = function abortUfoExperience(id, properties) {
+  // UFO won't abort if it's already in a final state (succeeded, failed, aborted, etc)
+  getExperience(id).abort({
+    metadata: _objectSpread(_objectSpread({}, properties), getBasePayloadAttributes())
   });
 };

package/dist/es2019/card/card.js

@@ -24,10 +24,10 @@ import { StoreSSRDataScript, getSSRData } from '../utils/globalScope';
 import { getCardStateFromFileState, createStateUpdater } from './cardState';
 import { isBigger } from '../utils/dimensionComparer';
 import { getMediaCardCursor } from '../utils/getMediaCardCursor';
-import { completeUfoExperience, startUfoExperience } from '../utils/ufoExperiences';
+import { completeUfoExperience, startUfoExperience, abortUfoExperience } from '../utils/ufoExperiences';
 import { generateUniqueId } from '../utils/generateUniqueId';
 const packageName = "@atlaskit/media-card";
-const packageVersion = "77.1.1";
+const packageVersion = "77.1.2";
 export class CardBase extends Component {
   constructor(props) {
     super(props);
@@ -97,8 +97,7 @@ export class CardBase extends Component {
       } = identifier;
       const {
         dimensions = {},
-        mediaClient,
-        createAnalyticsEvent
+        mediaClient
       } = this.props;
       return {
         mediaClient,
@@ -109,8 +108,6 @@ export class CardBase extends Component {
         isRemotePreviewReady: isImageRepresentationReady(fileState),
         imageUrlParams: this.getImageURLParams(identifier),
         mediaBlobUrlAttrs: this.getMediaBlobUrlAttrs(identifier, fileState),
-        createAnalyticsEvent,
-        featureFlags: this.props.featureFlags,
         traceContext: this.traceContext
       };
     });
@@ -743,10 +740,8 @@ export class CardBase extends Component {
       mediaClient,
       identifier,
       dimensions,
-      featureFlags,
       useInlinePlayer,
       disableOverlay,
-      resizeMode,
       ssr
     } = this.props;
     const {
@@ -775,7 +770,6 @@ export class CardBase extends Component {
     const turnedVisible = !prevIsCardVisible && isCardVisible;
     const hadSSRCardPreview = !!prevCardPreview && isSSRClientPreview(prevCardPreview) && !cardPreview;
     const isNewMediaClient = prevMediaClient !== mediaClient;
-    const fileImageMode = imageResizeModeToFileImageMode(resizeMode);
     this.updateFileStateFlag(fileState);
     if (isExternalImageIdentifier(identifier) && isDiffIdentifier) {
       this.fireCommencedEvent();
@@ -816,9 +810,6 @@ export class CardBase extends Component {
       fileState,
       prevDimensions,
       dimensions,
-      identifier,
-      fileImageMode,
-      featureFlags,
       hasCardPreview: !!cardPreview,
       isBannedLocalPreview,
       wasResolvedUpfrontPreview
@@ -851,6 +842,7 @@ export class CardBase extends Component {
   }
   componentWillUnmount() {
     var _getDocument2;
+    this.fireAbortedEvent();
     this.hasBeenMounted = false;
     this.unsubscribe();
     (_getDocument2 = getDocument()) === null || _getDocument2 === void 0 ? void 0 : _getDocument2.removeEventListener('copy', this.fireCopiedEvent);
@@ -890,10 +882,7 @@ export class CardBase extends Component {
       occurrenceKey
     }).subscribe({
       next: fileState => {
-        const {
-          featureFlags
-        } = this.props;
-        const newState = getCardStateFromFileState(fileState, isBannedLocalPreview, featureFlags);
+        const newState = getCardStateFromFileState(fileState, isBannedLocalPreview);
         this.safeSetState(newState);
       },
       error: e => {
@@ -938,6 +927,19 @@ export class CardBase extends Component {
     createAnalyticsEvent && fireOperationalEvent(createAnalyticsEvent, status, this.fileAttributes, this.getPerformanceAttributes(), this.ssrReliability, error, this.traceContext, fileState === null || fileState === void 0 ? void 0 : fileState.metadataTraceContext);
     completeUfoExperience(this.internalOccurrenceKey, status, this.fileAttributes, this.fileStateFlags, this.ssrReliability, error);
   }
+  fireAbortedEvent() {
+    const {
+      fileAttributes,
+      fileStateFlags,
+      ssrReliability
+    } = this;
+    // UFO won't abort if it's already in a final state (succeeded, failed, aborted, etc)
+    abortUfoExperience(this.internalOccurrenceKey, {
+      fileAttributes,
+      fileStateFlags,
+      ssrReliability
+    });
+  }
   fireCommencedEvent() {
     this.timeElapsedTillCommenced = performance.now();
     const {

package/dist/es2019/card/cardState.js

@@ -17,7 +17,7 @@ export const createStateUpdater = (newState, fireErrorEvent) => prevState => {
   }
   return newState;
 };
-export const getCardStateFromFileState = (fileState, isBannedLocalPreview, featureFlags) => {
+export const getCardStateFromFileState = (fileState, isBannedLocalPreview) => {
   const status = getCardStatus(fileState.status, extractFilePreviewStatus(fileState, isBannedLocalPreview));
   const error = status === 'error' && isErrorFileState(fileState) ? new MediaCardError('error-file-state', new Error(fileState.message)) : undefined;
   const progress = status === 'uploading' && fileState.status === 'uploading' ? fileState.progress : 1;

package/dist/es2019/card/getCardPreview/index.js

@@ -66,8 +66,6 @@ export const getCardPreview = async ({
   isRemotePreviewReady,
   imageUrlParams,
   mediaBlobUrlAttrs,
-  createAnalyticsEvent,
-  featureFlags,
   traceContext
 }) => {
   const mode = imageUrlParams.mode;
@@ -123,11 +121,8 @@ export const shouldResolvePreview = ({
   fileState,
   prevDimensions,
   dimensions,
-  identifier,
-  fileImageMode,
   hasCardPreview,
   isBannedLocalPreview,
-  featureFlags,
   wasResolvedUpfrontPreview
 }) => {
   const statusIsPreviewable = isPreviewableStatus(status, extractFilePreviewStatus(fileState, isBannedLocalPreview));

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 = "77.1.1";
+const packageVersion = "77.1.2";
 const MediaCardAnalyticsErrorBoundary = withMediaAnalyticsContext({
   packageVersion,
   packageName,

package/dist/es2019/card/v2/cardV2.js

@@ -24,11 +24,11 @@ import { StoreSSRDataScript, getSSRData } from '../../utils/globalScope';
 import { getCardStateFromFileState, createStateUpdater } from '../cardState';
 import { isBigger } from '../../utils/dimensionComparer';
 import { getMediaCardCursor } from '../../utils/getMediaCardCursor';
-import { completeUfoExperience, startUfoExperience } from '../../utils/ufoExperiences';
+import { completeUfoExperience, startUfoExperience, abortUfoExperience } from '../../utils/ufoExperiences';
 import { generateUniqueId } from '../../utils/generateUniqueId';
 import { useFileState } from '@atlaskit/media-client-react';
 const packageName = "@atlaskit/media-card";
-const packageVersion = "77.1.1";
+const packageVersion = "77.1.2";
 export class CardV2Base extends Component {
   constructor(props) {
     super(props);
@@ -98,8 +98,7 @@ export class CardV2Base extends Component {
       } = identifier;
       const {
         dimensions = {},
-        mediaClient,
-        createAnalyticsEvent
+        mediaClient
       } = this.props;
       return {
         mediaClient,
@@ -110,8 +109,6 @@ export class CardV2Base extends Component {
         isRemotePreviewReady: isImageRepresentationReady(fileState),
         imageUrlParams: this.getImageURLParams(identifier),
         mediaBlobUrlAttrs: this.getMediaBlobUrlAttrs(identifier, fileState),
-        createAnalyticsEvent,
-        featureFlags: this.props.featureFlags,
         traceContext: this.traceContext
       };
     });
@@ -203,10 +200,7 @@ export class CardV2Base extends Component {
         isBannedLocalPreview
       } = this.state;
       if (fileState.status !== 'error') {
-        const {
-          featureFlags
-        } = this.props;
-        const newState = getCardStateFromFileState(fileState, isBannedLocalPreview, featureFlags);
+        const newState = getCardStateFromFileState(fileState, isBannedLocalPreview);
         this.safeSetState(newState);
       } else {
         const e = new MediaFileStateError(fileState.id, fileState.reason, fileState.message, fileState.details);
@@ -713,7 +707,7 @@ export class CardV2Base extends Component {
       dimensions
     } = this.props;
     if (isCardVisible && isFileIdentifier(identifier)) {
-      this.updateStateForIdentifier(identifier);
+      this.updateStateForIdentifier();
       if (!cardPreview) {
         this.resolveUpfrontPreview(identifier);
       }
@@ -752,10 +746,8 @@ export class CardV2Base extends Component {
       mediaClient,
       identifier,
       dimensions,
-      featureFlags,
       useInlinePlayer,
       disableOverlay,
-      resizeMode,
       ssr
     } = this.props;
     const {
@@ -784,7 +776,6 @@ export class CardV2Base extends Component {
     const turnedVisible = !prevIsCardVisible && isCardVisible;
     const hadSSRCardPreview = !!prevCardPreview && isSSRClientPreview(prevCardPreview) && !cardPreview;
     const isNewMediaClient = prevMediaClient !== mediaClient;
-    const fileImageMode = imageResizeModeToFileImageMode(resizeMode);
     this.updateFileStateFlag(fileState);
     if (isExternalImageIdentifier(identifier) && isDiffIdentifier) {
       this.fireCommencedEvent();
@@ -807,7 +798,7 @@ export class CardV2Base extends Component {
       this.refetchSSRPreview(identifier);
     }
     if (isFileIdentifier(identifier) && (turnedVisible || !!this.subscription && (isNewMediaClient || isDiffIdentifier))) {
-      this.updateStateForIdentifier(identifier);
+      this.updateStateForIdentifier();
     }
     if (this.state.status !== prevState.status) {
       this.fireOperationalEvent();
@@ -825,9 +816,6 @@ export class CardV2Base extends Component {
       fileState,
       prevDimensions,
       dimensions,
-      identifier,
-      fileImageMode,
-      featureFlags,
       hasCardPreview: !!cardPreview,
       isBannedLocalPreview,
       wasResolvedUpfrontPreview
@@ -866,10 +854,11 @@ export class CardV2Base extends Component {
   }
   componentWillUnmount() {
     var _getDocument2;
+    this.fireAbortedEvent();
     this.hasBeenMounted = false;
     (_getDocument2 = getDocument()) === null || _getDocument2 === void 0 ? void 0 : _getDocument2.removeEventListener('copy', this.fireCopiedEvent);
   }
-  updateStateForIdentifier(identifier) {
+  updateStateForIdentifier() {
     this.fireCommencedEvent();
     this.setState({
       shouldUpdateStateForIdentifier: true
@@ -932,6 +921,19 @@ export class CardV2Base extends Component {
     }, this.traceContext);
     startUfoExperience(this.internalOccurrenceKey);
   }
+  fireAbortedEvent() {
+    const {
+      fileAttributes,
+      fileStateFlags,
+      ssrReliability
+    } = this;
+    // UFO won't abort if it's already in a final state (succeeded, failed, aborted, etc)
+    abortUfoExperience(this.internalOccurrenceKey, {
+      fileAttributes,
+      fileStateFlags,
+      ssrReliability
+    });
+  }
   get actions() {
     const {
       actions = [],

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: "77.1.1",
+      packageName: "77.1.2",
       componentName: 'mediaInlineCard',
       component: 'mediaInlineCard'
     };