@atlaskit/smart-card 30.2.4 → 30.2.6

package/dist/cjs/view/InlineCard/UnauthorisedView/index.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.InlineCardUnauthorizedView = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
@@ -13,11 +12,14 @@ 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 _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _button = _interopRequireDefault(require("@atlaskit/button"));
 var _lockFilled = _interopRequireDefault(require("@atlaskit/icon/glyph/lock-filled"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _colors = require("@atlaskit/theme/colors");
+var _useAnalyticsEvents2 = require("../../../common/analytics/generated/use-analytics-events");
 var _messages = require("../../../messages");
 var _HoverCard = require("../../HoverCard");
 var _Frame = require("../Frame");
@@ -32,12 +34,69 @@ var FallbackUnauthorizedIcon = /*#__PURE__*/_react.default.createElement(_Icon.A
   size: "small",
   primaryColor: "var(--ds-icon-danger, ".concat(_colors.R400, ")")
 }));
-var InlineCardUnauthorizedView = exports.InlineCardUnauthorizedView = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(InlineCardUnauthorizedView, _React$Component);
-  var _super = _createSuper(InlineCardUnauthorizedView);
-  function InlineCardUnauthorizedView() {
+var InlineCardUnauthorizedViewNew = function InlineCardUnauthorizedViewNew(_ref) {
+  var url = _ref.url,
+    id = _ref.id,
+    icon = _ref.icon,
+    onAuthorise = _ref.onAuthorise,
+    onClick = _ref.onClick,
+    isSelected = _ref.isSelected,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'inline-card-unauthorized-view' : _ref$testId,
+    _ref$showAuthTooltip = _ref.showAuthTooltip,
+    showAuthTooltip = _ref$showAuthTooltip === void 0 ? false : _ref$showAuthTooltip,
+    truncateInline = _ref.truncateInline,
+    context = _ref.context;
+  var frameRef = _react.default.useRef(null);
+  var _useAnalyticsEvents = (0, _useAnalyticsEvents2.useAnalyticsEvents)(),
+    fireEvent = _useAnalyticsEvents.fireEvent;
+  var handleConnectAccount = _react.default.useCallback(function (event) {
+    event.preventDefault();
+    event.stopPropagation();
+    if (onAuthorise) {
+      fireEvent('track.applicationAccount.authStarted', {});
+      onAuthorise();
+    }
+  }, [fireEvent, onAuthorise]);
+  var renderActionButton = _react.default.useCallback(function () {
+    var ActionButton = (0, _withFrameStyleControl.default)(_button.default, frameRef);
+    return onAuthorise ? /*#__PURE__*/_react.default.createElement(ActionButton, {
+      spacing: "none",
+      component: _styled.IconStyledButton,
+      onClick: handleConnectAccount,
+      testId: "button-connect-account"
+    }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.messages.connect_link_account_card_name, {
+      values: {
+        context: context
+      }
+    }))) : undefined;
+  }, [handleConnectAccount, onAuthorise, context]);
+  var inlineCardUnauthenticatedView = /*#__PURE__*/_react.default.createElement(_Frame.Frame, {
+    testId: testId,
+    isSelected: isSelected,
+    ref: frameRef,
+    truncateInline: truncateInline
+  }, /*#__PURE__*/_react.default.createElement(_IconAndTitleLayout.IconAndTitleLayout, {
+    icon: icon ? icon : FallbackUnauthorizedIcon,
+    title: url,
+    link: url,
+    onClick: onClick,
+    titleColor: "var(--ds-text-subtle, ".concat(_colors.N500, ")")
+  }), renderActionButton());
+  if (onAuthorise && showAuthTooltip) {
+    return /*#__PURE__*/_react.default.createElement(_HoverCard.HoverCard, {
+      url: url,
+      id: id
+    }, inlineCardUnauthenticatedView);
+  }
+  return inlineCardUnauthenticatedView;
+};
+var InlineCardUnauthorizedViewOld = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2.default)(InlineCardUnauthorizedViewOld, _React$Component);
+  var _super = _createSuper(InlineCardUnauthorizedViewOld);
+  function InlineCardUnauthorizedViewOld() {
     var _this;
-    (0, _classCallCheck2.default)(this, InlineCardUnauthorizedView);
+    (0, _classCallCheck2.default)(this, InlineCardUnauthorizedViewOld);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
@@ -75,7 +134,7 @@ var InlineCardUnauthorizedView = exports.InlineCardUnauthorizedView = /*#__PURE_
     });
     return _this;
   }
-  (0, _createClass2.default)(InlineCardUnauthorizedView, [{
+  (0, _createClass2.default)(InlineCardUnauthorizedViewOld, [{
     key: "render",
     value: function render() {
       var _this$props3 = this.props,
@@ -110,5 +169,12 @@ var InlineCardUnauthorizedView = exports.InlineCardUnauthorizedView = /*#__PURE_
       return inlineCardUnauthenticatedView;
     }
   }]);
-  return InlineCardUnauthorizedView;
-}(_react.default.Component);
+  return InlineCardUnauthorizedViewOld;
+}(_react.default.Component);
+var InlineCardUnauthorizedView = exports.InlineCardUnauthorizedView = function InlineCardUnauthorizedView(props) {
+  if ((0, _platformFeatureFlags.fg)('smart-card-migrate-track-analytics')) {
+    return /*#__PURE__*/_react.default.createElement(InlineCardUnauthorizedViewNew, props);
+  } else {
+    return /*#__PURE__*/_react.default.createElement(InlineCardUnauthorizedViewOld, props);
+  }
+};

package/dist/cjs/view/LinkUrl/index.js

@@ -17,7 +17,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId"],
   _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "30.2.4",
+  packageVersion: "30.2.6",
   componentName: 'linkUrl'
 };
 var Link = (0, _click.withLinkClickedEvent)('a');

package/dist/es2019/state/actions/index.js

@@ -2,6 +2,8 @@ import { useCallback, useMemo } from 'react';
 import { useSmartLinkContext } from '@atlaskit/link-provider';
 import { ACTION_RESOLVING, ACTION_UPDATE_METADATA_STATUS, cardAction } from '@atlaskit/linking-common';
 import { auth } from '@atlaskit/outbound-auth-flow-client';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { useAnalyticsEvents } from '../../common/analytics/generated/use-analytics-events';
 import { SmartLinkStatus } from '../../constants';
 import { getByDefinitionId, getDefinitionId, getExtensionKey, getServices } from '../helpers';
 import useInvokeClientAction from '../hooks/use-invoke-client-action';
@@ -11,6 +13,9 @@ export const useSmartCardActions = (id, url, analytics) => {
   const invokeClientAction = useInvokeClientAction({
     analytics
   });
+  const {
+    fireEvent
+  } = useAnalyticsEvents();
   const {
     store
   } = useSmartLinkContext();
@@ -101,10 +106,16 @@ export const useSmartCardActions = (id, url, analytics) => {
         extensionKey
       });
       auth(services[0].url).then(() => {
-        analytics.track.appAccountConnected({
-          definitionId,
-          extensionKey
-        });
+        if (fg('smart-card-migrate-track-analytics')) {
+          fireEvent('track.applicationAccount.connected', {
+            definitionId: definitionId !== null && definitionId !== void 0 ? definitionId : null
+          });
+        } else {
+          analytics.track.appAccountConnected({
+            definitionId,
+            extensionKey
+          });
+        }
         analytics.operational.connectSucceededEvent({
           id,
           definitionId,
@@ -128,7 +139,7 @@ export const useSmartCardActions = (id, url, analytics) => {
         reload();
       });
     }
-  }, [getSmartLinkState, analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload]);
+  }, [getSmartLinkState, analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload, fireEvent]);
   const invoke = useCallback(async (opts, appearance) => {
     const {
       key,

package/dist/es2019/state/analytics/useSmartLinkAnalytics.js

@@ -695,6 +695,7 @@ export const useSmartLinkAnalytics = (url, id, defaultLocation) => {
      * @param definitionId The definitionId of the Smart Link resolver invoked.
      * @param extensionKey The extensionKey of the Smart Link resovler invoked.
      * @returns
+     * @deprecated
      */
     appAccountConnected: ({
       extensionKey,
@@ -717,6 +718,7 @@ export const useSmartLinkAnalytics = (url, id, defaultLocation) => {
      * @param location a location where the Smart Link auth action was initiated.
      * @param extensionKey The extensionKey of the Smart Link resolver invoked.
      * @returns
+     * @deprecated
      */
     appAccountAuthStarted: ({
       extensionKey,
@@ -728,6 +730,7 @@ export const useSmartLinkAnalytics = (url, id, defaultLocation) => {
     }), commonAttributes)),
     /**
      * This fires a tracking event before an action invoke api call is made
+     * @deprecated
      */
     smartLinkQuickActionStarted: props => dispatchAnalytics(applyCommonAttributes(trackSmartLinkQuickActionStarted({
       ...commonAttributes,
@@ -735,6 +738,7 @@ export const useSmartLinkAnalytics = (url, id, defaultLocation) => {
     }), commonAttributes)),
     /**
      * This fires a tracking event after an action invoke api call is successful
+     * @deprecated
      */
     smartLinkQuickActionSuccess: props => dispatchAnalytics(applyCommonAttributes(trackSmartLinkQuickActionSuccess({
       ...commonAttributes,
@@ -742,6 +746,7 @@ export const useSmartLinkAnalytics = (url, id, defaultLocation) => {
     }), commonAttributes)),
     /**
      * This fires a tracking event after an action invoke api call has failed
+     * @deprecated
      */
     smartLinkQuickActionFailed: props => dispatchAnalytics(applyCommonAttributes(trackSmartLinkQuickActionFailed({
       ...commonAttributes,
@@ -749,6 +754,7 @@ export const useSmartLinkAnalytics = (url, id, defaultLocation) => {
     }), commonAttributes)),
     /**
      * Fires a track event when we call loadMetadata() to get information for a hover card
+     * @deprecated
      */
     hoverCardResolutionStarted: () => dispatchAnalytics(applyCommonAttributes(trackHoverCardResolutionStarted({
       display: 'hoverCardPreview',

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

@@ -4,7 +4,7 @@ export const ANALYTICS_CHANNEL = 'media';
 export const context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "30.2.4"
+  packageVersion: "30.2.6"
 };
 export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -204,6 +204,10 @@ export const connectFailedEvent = ({
     location
   }
 });
+
+/**
+ * @deprecated
+ */
 export const trackAppAccountConnected = ({
   definitionId,
   extensionKey,
@@ -223,6 +227,10 @@ export const trackAppAccountConnected = ({
     location
   }
 });
+
+/**
+ * @deprecated
+ */
 export const trackAppAccountAuthStarted = ({
   extensionKey,
   location
@@ -236,6 +244,10 @@ export const trackAppAccountAuthStarted = ({
     location
   }
 });
+
+/**
+ * @deprecated
+ */
 export const trackSmartLinkQuickActionStarted = ({
   smartLinkActionType,
   ...attributes
@@ -252,6 +264,10 @@ export const trackSmartLinkQuickActionStarted = ({
     }
   };
 };
+
+/**
+ * @deprecated
+ */
 export const trackSmartLinkQuickActionSuccess = ({
   smartLinkActionType,
   ...attributes
@@ -268,6 +284,10 @@ export const trackSmartLinkQuickActionSuccess = ({
     }
   };
 };
+
+/**
+ * @deprecated
+ */
 export const trackSmartLinkQuickActionFailed = ({
   smartLinkActionType,
   ...attributes
@@ -284,6 +304,10 @@ export const trackSmartLinkQuickActionFailed = ({
     }
   };
 };
+
+/**
+ * @deprecated
+ */
 export const trackHoverCardResolutionStarted = ({
   display,
   ...attributes
@@ -370,6 +394,10 @@ export const uiCardClickedEvent = ({
     destinationSubproduct
   }
 });
+
+/**
+ * @deprecated
+ */
 export const uiIframeDwelledEvent = ({
   id,
   display,
@@ -399,6 +427,10 @@ export const uiIframeDwelledEvent = ({
     dwellPercentVisible
   }
 });
+
+/**
+ * @deprecated
+ */
 export const uiIframeFocusedEvent = ({
   id,
   display,

package/dist/es2019/view/BlockCard/views/flexible/FlexibleUnauthorisedView.js

@@ -9,6 +9,8 @@ import { useCallback, useMemo } from 'react';
 import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
 import { extractProvider } from '@atlaskit/link-extractors';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { useAnalyticsEvents } from '../../../../common/analytics/generated/use-analytics-events';
 import { messages } from '../../../../messages';
 import { getExtensionKey, hasAuthScopeOverrides } from '../../../../state/helpers';
 import UnauthorisedViewContent from '../../../common/UnauthorisedViewContent';
@@ -42,14 +44,21 @@ const FlexibleUnauthorisedView = ({
   const data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
   const providerName = (_extractProvider = extractProvider(data)) === null || _extractProvider === void 0 ? void 0 : _extractProvider.text;
   const isProductIntegrationSupported = hasAuthScopeOverrides(cardState === null || cardState === void 0 ? void 0 : cardState.details);
+  const {
+    fireEvent
+  } = useAnalyticsEvents();
   const handleAuthorize = useCallback(() => {
     if (onAuthorize) {
-      analytics === null || analytics === void 0 ? void 0 : analytics.track.appAccountAuthStarted({
-        extensionKey
-      });
+      if (fg('smart-card-migrate-track-analytics')) {
+        fireEvent('track.applicationAccount.authStarted', {});
+      } else {
+        analytics === null || analytics === void 0 ? void 0 : analytics.track.appAccountAuthStarted({
+          extensionKey
+        });
+      }
       onAuthorize();
     }
-  }, [onAuthorize, extensionKey, analytics === null || analytics === void 0 ? void 0 : analytics.track]);
+  }, [onAuthorize, extensionKey, analytics === null || analytics === void 0 ? void 0 : analytics.track, fireEvent]);
   const content = useMemo(() => onAuthorize ? jsx(UnauthorisedViewContent, {
     providerName: providerName,
     isProductIntegrationSupported: isProductIntegrationSupported,

package/dist/es2019/view/CardWithUrl/component.js

@@ -152,7 +152,6 @@ function Component({
       fireEvent('ui.smartLinkIframe.dwelled', {
         id,
         definitionId: definitionId !== null && definitionId !== void 0 ? definitionId : null,
-        location: null,
         display: isFlexibleUi ? 'flexible' : appearance,
         dwellPercentVisible,
         dwellTime
@@ -176,7 +175,6 @@ function Component({
       fireEvent('ui.smartLinkIframe.focus', {
         id,
         definitionId: definitionId !== null && definitionId !== void 0 ? definitionId : null,
-        location: null,
         display: isFlexibleUi ? 'flexible' : appearance
       });
     } else {

package/dist/es2019/view/EmbedCard/views/unauthorized-view/index.js

@@ -2,6 +2,8 @@ import _extends from "@babel/runtime/helpers/extends";
 import React, { useCallback, useMemo } from 'react';
 import { FormattedMessage } from 'react-intl-next';
 import Button from '@atlaskit/button';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { useAnalyticsEvents } from '../../../../common/analytics/generated/use-analytics-events';
 import { messages } from '../../../../messages';
 import UnauthorisedViewContent from '../../../common/UnauthorisedViewContent';
 import UnresolvedView from '../unresolved-view';
@@ -16,14 +18,21 @@ const UnauthorizedView = ({
   ...unresolvedViewProps
 }) => {
   var _context$image;
+  const {
+    fireEvent
+  } = useAnalyticsEvents();
   const handleOnAuthorizeClick = useCallback(() => {
     if (onAuthorize) {
-      analytics.track.appAccountAuthStarted({
-        extensionKey
-      });
+      if (fg('smart-card-migrate-track-analytics')) {
+        fireEvent('track.applicationAccount.authStarted', {});
+      } else {
+        analytics.track.appAccountAuthStarted({
+          extensionKey
+        });
+      }
       onAuthorize();
     }
-  }, [onAuthorize, analytics.track, extensionKey]);
+  }, [onAuthorize, analytics.track, extensionKey, fireEvent]);
   const content = useMemo(() => {
     if (onAuthorize) {
       var _context$text;

package/dist/es2019/view/FlexibleCard/components/actions/action/server-action/index.js

@@ -1,5 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useCallback, useState } from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { useAnalyticsEvents } from '../../../../../../common/analytics/generated/use-analytics-events';
 import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
 import useInvoke from '../../../../../../state/hooks/use-invoke';
 import { getInvokeFailureReason } from '../../../../../../state/hooks/use-invoke/utils';
@@ -16,6 +18,9 @@ const ServerAction = ({
   const analytics = useFlexibleUiAnalyticsContext();
   const invoke = useInvoke();
   const reload = useResolve();
+  const {
+    fireEvent
+  } = useAnalyticsEvents();
   const handleClick = useCallback(async () => {
     if (action) {
       var _action$action;
@@ -25,14 +30,26 @@ const ServerAction = ({
         analytics === null || analytics === void 0 ? void 0 : analytics.ui.smartLinkServerActionClickedEvent({
           smartLinkActionType
         });
-        analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionStarted({
-          smartLinkActionType
-        });
+        if (fg('smart-card-migrate-track-analytics')) {
+          fireEvent('track.smartLinkQuickAction.started', {
+            smartLinkActionType
+          });
+        } else {
+          analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionStarted({
+            smartLinkActionType
+          });
+        }
         const request = createInvokeRequest(action);
         await invoke(request);
-        analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionSuccess({
-          smartLinkActionType
-        });
+        if (fg('smart-card-migrate-track-analytics')) {
+          fireEvent('track.smartLinkQuickAction.success', {
+            smartLinkActionType
+          });
+        } else {
+          analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionSuccess({
+            smartLinkActionType
+          });
+        }
         if (action.reload && action.reload.url) {
           await reload(action.reload.url, true, undefined, action.reload.id);
         }
@@ -42,14 +59,21 @@ const ServerAction = ({
         }
       } catch (err) {
         setIsLoading(false);
-        analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionFailed({
-          smartLinkActionType,
-          reason: getInvokeFailureReason(err)
-        });
+        if (fg('smart-card-migrate-track-analytics')) {
+          fireEvent('track.smartLinkQuickAction.failed', {
+            smartLinkActionType,
+            reason: getInvokeFailureReason(err)
+          });
+        } else {
+          analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionFailed({
+            smartLinkActionType,
+            reason: getInvokeFailureReason(err)
+          });
+        }
         onErrorCallback === null || onErrorCallback === void 0 ? void 0 : onErrorCallback();
       }
     }
-  }, [action, analytics === null || analytics === void 0 ? void 0 : analytics.track, analytics === null || analytics === void 0 ? void 0 : analytics.ui, invoke, onClick, onErrorCallback, reload]);
+  }, [action, analytics === null || analytics === void 0 ? void 0 : analytics.track, analytics === null || analytics === void 0 ? void 0 : analytics.ui, invoke, onClick, onErrorCallback, reload, fireEvent]);
   return /*#__PURE__*/React.createElement(Action, _extends({}, props, {
     isLoading: isLoading,
     onClick: handleClick

package/dist/es2019/view/FlexibleCard/components/elements/lozenge/lozenge-action/index.js

@@ -8,6 +8,8 @@ import { useCallback, useEffect, useMemo, useState } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import DropdownMenu from '@atlaskit/dropdown-menu';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { useAnalyticsEvents } from '../../../../../../common/analytics/generated/use-analytics-events';
 import extractLozengeActionItems from '../../../../../../extractors/action/extract-lozenge-action-items';
 import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
 import useInvoke from '../../../../../../state/hooks/use-invoke';
@@ -45,6 +47,9 @@ const LozengeAction = ({
   //TODO EDM-6583 Replace usage of useFlexibleUiAnalyticsContext with linking platform analytics context from find team.
   const analytics = useFlexibleUiAnalyticsContext();
   const invoke = useInvoke();
+  const {
+    fireEvent
+  } = useAnalyticsEvents();
   useEffect(() => {
     setSelected({
       text,
@@ -60,9 +65,15 @@ const LozengeAction = ({
     setIsOpen(args.isOpen);
     if (args.isOpen) {
       analytics === null || analytics === void 0 ? void 0 : analytics.ui.smartLinkLozengeActionClickedEvent();
-      analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionStarted({
-        smartLinkActionType: TrackQuickActionType.StatusUpdate
-      });
+      if (fg('smart-card-migrate-track-analytics')) {
+        fireEvent('track.smartLinkQuickAction.started', {
+          smartLinkActionType: TrackQuickActionType.StatusUpdate
+        });
+      } else {
+        analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionStarted({
+          smartLinkActionType: TrackQuickActionType.StatusUpdate
+        });
+      }
       if (!isLoaded && action !== null && action !== void 0 && action.read) {
         try {
           setIsLoading(true);
@@ -71,14 +82,22 @@ const LozengeAction = ({
           setItems(validItems);
           setIsLoaded(true);
           if ((validItems === null || validItems === void 0 ? void 0 : validItems.length) === 0) {
-            analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionFailed(permissionLoadErrorAnalyticsPayload);
+            if (fg('smart-card-migrate-track-analytics')) {
+              fireEvent('track.smartLinkQuickAction.failed', permissionLoadErrorAnalyticsPayload);
+            } else {
+              analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionFailed(permissionLoadErrorAnalyticsPayload);
+            }
             setErrorMessage(LozengeActionErrorMessages.noData);
             setIsLoaded(false);
           }
         } catch (err) {
           setErrorMessage(LozengeActionErrorMessages.unknown);
           setIsLoaded(false);
-          analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionFailed(unknownLoadErrorAnalyticsPayload);
+          if (fg('smart-card-migrate-track-analytics')) {
+            fireEvent('track.smartLinkQuickAction.failed', unknownLoadErrorAnalyticsPayload);
+          } else {
+            analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionFailed(unknownLoadErrorAnalyticsPayload);
+          }
         } finally {
           setIsLoading(false);
         }
@@ -87,7 +106,7 @@ const LozengeAction = ({
     if (!args.isOpen) {
       setErrorMessage(undefined);
     }
-  }, [action.read, analytics, invoke, isLoaded, text]);
+  }, [action.read, analytics, invoke, isLoaded, text, fireEvent]);
   const trigger = useCallback(props => jsx(LozengeActionTrigger, _extends({}, props, {
     appearance: selected.appearance,
     isOpen: isOpen,
@@ -110,9 +129,15 @@ const LozengeAction = ({
         setIsLoaded(false);
         setIsOpen(false);
         setItems([]);
-        analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionSuccess({
-          smartLinkActionType: TrackQuickActionType.StatusUpdate
-        });
+        if (fg('smart-card-migrate-track-analytics')) {
+          fireEvent('track.smartLinkQuickAction.success', {
+            smartLinkActionType: TrackQuickActionType.StatusUpdate
+          });
+        } else {
+          analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionSuccess({
+            smartLinkActionType: TrackQuickActionType.StatusUpdate
+          });
+        }
         if (url) {
           await reload(url, true, undefined, linkId);
         }
@@ -121,13 +146,21 @@ const LozengeAction = ({
       setIsLoading(false);
       if (isInvokeCustomError(err)) {
         setErrorMessage(err.message);
-        analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionFailed(validationUpdateErrorAnalyticsPayload);
+        if (fg('smart-card-migrate-track-analytics')) {
+          fireEvent('track.smartLinkQuickAction.failed', validationUpdateErrorAnalyticsPayload);
+        } else {
+          analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionFailed(validationUpdateErrorAnalyticsPayload);
+        }
       } else {
         setErrorMessage(LozengeActionErrorMessages.updateFailed);
-        analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionFailed(unknownUpdateErrorAnalyticsPayload);
+        if (fg('smart-card-migrate-track-analytics')) {
+          fireEvent('track.smartLinkQuickAction.failed', unknownUpdateErrorAnalyticsPayload);
+        } else {
+          analytics === null || analytics === void 0 ? void 0 : analytics.track.smartLinkQuickActionFailed(unknownUpdateErrorAnalyticsPayload);
+        }
       }
     }
-  }, [action === null || action === void 0 ? void 0 : action.update, analytics, invoke, linkId, reload, url]);
+  }, [action === null || action === void 0 ? void 0 : action.update, analytics, invoke, linkId, reload, url, fireEvent]);
   const dropdownItemGroup = useMemo(() => {
     if (errorMessage) {
       return jsx(LozengeActionError, {

package/dist/es2019/view/HoverCard/components/views/unauthorised/index.js

@@ -2,6 +2,8 @@ import _extends from "@babel/runtime/helpers/extends";
 import React, { useCallback, useMemo } from 'react';
 import { FormattedMessage } from 'react-intl-next';
 import { extractProvider } from '@atlaskit/link-extractors';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { useAnalyticsEvents } from '../../../../../common/analytics/generated/use-analytics-events';
 import { ActionName, CardDisplay } from '../../../../../constants';
 import { messages } from '../../../../../messages';
 import { useSmartCardActions } from '../../../../../state/actions';
@@ -30,14 +32,21 @@ const HoverCardUnauthorisedView = ({
   const {
     authorize
   } = useSmartCardActions(id, url, analytics);
+  const {
+    fireEvent
+  } = useAnalyticsEvents();
   const handleAuthorize = useCallback(() => {
     if (authorize) {
-      analytics.track.appAccountAuthStarted({
-        extensionKey
-      });
+      if (fg('smart-card-migrate-track-analytics')) {
+        fireEvent('track.applicationAccount.authStarted', {});
+      } else {
+        analytics.track.appAccountAuthStarted({
+          extensionKey
+        });
+      }
       authorize(CardDisplay.HoverCardPreview);
     }
-  }, [authorize, extensionKey, analytics.track]);
+  }, [authorize, extensionKey, analytics.track, fireEvent]);
   const actions = useMemo(() => [{
     name: ActionName.CustomAction,
     content: /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages.connect_unauthorised_account_action, {