@atlaskit/smart-card 26.24.0 → 26.25.0

package/dist/es2019/extractors/block/index.js

@@ -5,7 +5,7 @@ import { extractCommentCount, extractProgrammingLanguage, extractSubscriberCount
 import { extractLink, extractTitle, extractProvider, extractMembers, extractPersonAssignedTo, extractPersonCreatedBy, extractPersonUpdatedBy, extractImage } from '@atlaskit/link-extractors';
 import { extractByline } from '../common/byline/extractByline';
 import { extractTitlePrefix } from '../common/title-prefix/extractTitlePrefix';
-import { extractActions } from '../common/actions/extractActions';
+import { extractClientActions } from '../common/actions/extractActions';
 import { extractPreviewAction } from '../common/actions/extractPreviewAction';
 import { extractIsTrusted } from '../common/meta/extractIsTrusted';
 const extractBlockIcon = jsonLd => {
@@ -26,7 +26,7 @@ export const extractBlockActions = (props, jsonLd, opts, platform, meta) => {
     const {
       handleInvoke
     } = opts;
-    const actions = extractActions(jsonLd, handleInvoke);
+    const actions = extractClientActions(jsonLd, handleInvoke);
     const previewAction = extractPreviewAction({
       ...opts,
       viewProps: props,

package/dist/es2019/extractors/common/actions/extractActions.js

@@ -30,25 +30,6 @@ const getClientActionProps = (jsonLd, action, handler) => {
     promise: () => handler(clientActionInvokeOpts)
   };
 };
-const getServerActionProps = (jsonLd, action, handler) => {
-  const id = action['@id'] || action['@type'];
-  const data = {
-    type: 'server',
-    key: action.identifier,
-    action: {
-      type: action['@type'],
-      payload: {
-        id,
-        context: jsonLd.context
-      }
-    }
-  };
-  return {
-    id,
-    text: action.name,
-    promise: () => handler(data)
-  };
-};
 export const getActionsFromJsonLd = jsonLd => {
   let actions = jsonLd && jsonLd['schema:potentialAction'];
   if (!actions) {
@@ -59,11 +40,9 @@ export const getActionsFromJsonLd = jsonLd => {
   }
   return actions;
 };
-export function extractActions(jsonLd, handler) {
+export function extractClientActions(jsonLd, handler) {
   const actions = getActionsFromJsonLd(jsonLd);
   const clientActions = actions.filter(isClientAction);
-  const serverActions = actions.filter(action => !isClientAction(action));
   const clientActionImpls = clientActions.map(action => getClientActionProps(jsonLd, action, handler));
-  const serverActionImpls = serverActions.map(action => getServerActionProps(jsonLd, action, handler));
-  return [...clientActionImpls, ...serverActionImpls];
+  return clientActionImpls;
 }

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

@@ -235,11 +235,11 @@ export const useSmartLinkAnalytics = (url, _dispatchAnalytics, id, defaultLocati
      * @param extensionKey The extensionKey of the Smart Link resovler invoked.
      * @param actionType The type of the action that was clicked, e.g. PreviewAction
      * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
-     * @param invokeType Whether the action invoked made a call to a server.
+     * @param invokeType @deprecated {@link https://hello.atlassian.net/browse/ENGHEALTH-2681 Internal documentation for deprecation (no external access)}
      * @returns
      */
     actionClickedEvent: ({
-      id: experienceId,
+      id,
       actionType,
       display,
       invokeType,
@@ -251,14 +251,8 @@ export const useSmartLinkAnalytics = (url, _dispatchAnalytics, id, defaultLocati
       location
     }) => {
       const extensionKey = overrideExtensionKey !== null && overrideExtensionKey !== void 0 ? overrideExtensionKey : extractedExtensionKey;
-      startUfoExperience('smart-link-action-invocation', experienceId, {
-        actionType,
-        display,
-        extensionKey,
-        invokeType
-      });
       dispatchAnalytics(applyCommonAttributes(uiActionClickedEvent({
-        id: defaultId,
+        id: id !== null && id !== void 0 ? id : defaultId,
         actionType,
         display,
         extensionKey,
@@ -507,7 +501,7 @@ export const useSmartLinkAnalytics = (url, _dispatchAnalytics, id, defaultLocati
      * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
      */
     invokeSucceededEvent: ({
-      id: experienceId,
+      id,
       actionType,
       display,
       extensionKey,
@@ -517,9 +511,8 @@ export const useSmartLinkAnalytics = (url, _dispatchAnalytics, id, defaultLocati
       destinationSubproduct,
       location
     }) => {
-      succeedUfoExperience('smart-link-action-invocation', experienceId);
       dispatchAnalytics(applyCommonAttributes(invokeSucceededEvent({
-        id: defaultId,
+        id: id !== null && id !== void 0 ? id : defaultId,
         actionType,
         display,
         extensionKey,
@@ -539,7 +532,7 @@ export const useSmartLinkAnalytics = (url, _dispatchAnalytics, id, defaultLocati
      * @param reason The reason the invocation failed.
      */
     invokeFailedEvent: ({
-      id: experienceId,
+      id,
       actionType,
       display,
       reason,
@@ -550,9 +543,8 @@ export const useSmartLinkAnalytics = (url, _dispatchAnalytics, id, defaultLocati
       destinationSubproduct,
       location
     }) => {
-      failUfoExperience('smart-link-action-invocation', experienceId);
       dispatchAnalytics(applyCommonAttributes(invokeFailedEvent({
-        id: defaultId,
+        id: id !== null && id !== void 0 ? id : defaultId,
         actionType,
         display,
         reason,

package/dist/es2019/state/hooks/use-invoke-client-action/index.js

@@ -1,6 +1,9 @@
 import { useCallback } from 'react';
 import uuid from 'uuid';
 import * as measure from '../../../utils/performance';
+import { failUfoExperience, startUfoExperience, succeedUfoExperience } from '../../analytics';
+const ACTION_EXPERIENCE_NAME = 'smart-link-action-invocation';
+
 /**
  * Invoke client action such as preview, download and open link
  */
@@ -18,31 +21,34 @@ const useInvokeClientAction = ({
   const markName = `${experienceId}-${actionType}`;
   measure.mark(markName, 'pending');
   try {
-    // Begin analytics instrumentation.
-    analytics === null || analytics === void 0 ? void 0 : analytics.ui.actionClickedEvent({
-      id: experienceId,
-      extensionKey,
+    // Begin UFO experience
+    startUfoExperience(ACTION_EXPERIENCE_NAME, experienceId, {
       actionType,
       display,
+      extensionKey,
       invokeType: 'client'
     });
 
+    // Begin analytics instrumentation.
+    analytics === null || analytics === void 0 ? void 0 : analytics.ui.actionClickedEvent({
+      actionType,
+      display
+    });
+
     // Invoke action
     const result = await actionFn();
     measure.mark(markName, 'resolved');
+    succeedUfoExperience(ACTION_EXPERIENCE_NAME, experienceId);
     analytics === null || analytics === void 0 ? void 0 : analytics.operational.invokeSucceededEvent({
-      id: experienceId,
-      extensionKey,
       actionType,
       display
     });
     return result;
   } catch (err) {
     measure.mark(markName, 'errored');
+    failUfoExperience(ACTION_EXPERIENCE_NAME, experienceId);
     const reason = typeof err === 'string' ? err : err === null || err === void 0 ? void 0 : err.message;
     analytics === null || analytics === void 0 ? void 0 : analytics.operational.invokeFailedEvent({
-      id: experienceId,
-      extensionKey,
       actionType,
       display,
       reason

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

@@ -3,7 +3,7 @@ export const ANALYTICS_CHANNEL = 'media';
 export const context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.24.0"
+  packageVersion: "26.25.0"
 };
 export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

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

@@ -30,6 +30,7 @@ const FlexibleErroredView = ({
   const status = cardState.status;
   const actions = useMemo(() => onAuthorize ? [RetryAction(onAuthorize)] : [], [onAuthorize]);
   return /*#__PURE__*/React.createElement(FlexibleCard, {
+    appearance: "block",
     cardState: cardState,
     onAuthorize: onAuthorize,
     onClick: onClick,

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

@@ -4,8 +4,7 @@ import FlexibleCard from '../../../FlexibleCard';
 import TitleBlock from '../../../FlexibleCard/components/blocks/title-block';
 import { FooterBlock, MetadataBlock, PreviewBlock, SnippetBlock } from '../../../FlexibleCard/components/blocks';
 import { metadataBlockCss, footerBlockCss } from './styled';
-import { ActionName, CardDisplay, ElementName, MediaPlacement, SmartLinkPosition } from '../../../../constants';
-import uuid from 'uuid';
+import { ActionName, ElementName, MediaPlacement, SmartLinkPosition } from '../../../../constants';
 import { getSimulatedMetadata, getSimulatedBetterMetadata } from './utils';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { withFlexibleUIBlockCardStyle } from './utils/withFlexibleUIBlockCardStyle';
@@ -32,7 +31,6 @@ const FlexibleResolvedView = ({
   useEffect(() => {
     setIsPreviewBlockErrored(false);
   }, [url, cardState]);
-  const [analyticsId] = useState(() => id ? id : uuid());
   const {
     titleMetadata,
     topMetadata,
@@ -80,49 +78,13 @@ const FlexibleResolvedView = ({
   }, {
     actions: [{
       name: ActionName.PreviewAction,
-      hideIcon: true,
-      onClick: () => {
-        analytics.ui.actionClickedEvent({
-          id: analyticsId,
-          actionType: 'PreviewAction',
-          display: CardDisplay.Block
-        });
-        analytics.operational.invokeSucceededEvent({
-          id: analyticsId,
-          actionType: 'PreviewAction',
-          display: CardDisplay.Block
-        });
-      }
+      hideIcon: true
     }, {
       name: ActionName.ViewAction,
-      hideIcon: true,
-      onClick: () => {
-        analytics.ui.actionClickedEvent({
-          id: analyticsId,
-          actionType: 'ViewAction',
-          display: CardDisplay.Block
-        });
-        analytics.operational.invokeSucceededEvent({
-          id: analyticsId,
-          actionType: 'ViewAction',
-          display: CardDisplay.Block
-        });
-      }
+      hideIcon: true
     }, {
       name: ActionName.DownloadAction,
-      hideIcon: true,
-      onClick: () => {
-        analytics.ui.actionClickedEvent({
-          id: analyticsId,
-          actionType: 'DownloadAction',
-          display: CardDisplay.Block
-        });
-        analytics.operational.invokeSucceededEvent({
-          id: analyticsId,
-          actionType: 'DownloadAction',
-          display: CardDisplay.Block
-        });
-      }
+      hideIcon: true
     }]
   })));
 };

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

@@ -2,6 +2,9 @@ import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import Action from '../index';
 import { downloadUrl as download } from '../../../../../../utils';
+import { ActionName } from '../../../../../../constants';
+import useInvokeClientAction from '../../../../../../state/hooks/use-invoke-client-action';
+import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
 const DownloadAction = props => {
   const {
     appearance,
@@ -11,11 +14,22 @@ const DownloadAction = props => {
     testId,
     url
   } = props;
+  const analytics = useFlexibleUiAnalyticsContext();
+  const invoke = useInvokeClientAction({
+    analytics
+  });
   if (downloadUrl && url) {
     const action = {
       ...props,
       onClick: () => {
-        download(downloadUrl);
+        invoke({
+          actionType: ActionName.DownloadAction,
+          actionFn: async () => download(downloadUrl),
+          // These values have already been set in analytics context.
+          // We only pass these here for ufo experience.
+          display: analytics === null || analytics === void 0 ? void 0 : analytics.display,
+          extensionKey: analytics === null || analytics === void 0 ? void 0 : analytics.extensionKey
+        });
         if (onClick) {
           onClick();
         }

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

@@ -2,10 +2,11 @@ import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import Action from '../index';
 import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
-import { useSmartLinkAnalytics } from '../../../../../../state';
 import { FormattedMessage } from 'react-intl-next';
 import { messages } from '../../../../../../messages';
 import { openEmbedModalWithFlexibleUiIcon } from '../../../utils';
+import useInvokeClientAction from '../../../../../../state/hooks/use-invoke-client-action';
+import { ActionName } from '../../../../../../constants';
 const PreviewAction = props => {
   const {
     appearance,
@@ -20,22 +21,32 @@ const PreviewAction = props => {
     downloadUrl,
     isSupportTheming
   } = props;
-  const defaultAnalytics = useSmartLinkAnalytics(url, () => {});
-  const analytics = useFlexibleUiAnalyticsContext() || defaultAnalytics;
+  const analytics = useFlexibleUiAnalyticsContext();
+  const invoke = useInvokeClientAction({
+    analytics
+  });
   if (src && url) {
-    const embedModal = () => openEmbedModalWithFlexibleUiIcon({
+    const actionFn = async () => openEmbedModalWithFlexibleUiIcon({
+      download: downloadUrl,
       title,
       providerName,
-      downloadUrl,
       isSupportTheming,
       analytics,
       linkIcon,
-      src
+      src,
+      url
     });
     const action = {
       ...props,
       onClick: () => {
-        embedModal();
+        invoke({
+          actionType: ActionName.PreviewAction,
+          actionFn,
+          // These values have already been set in analytics context.
+          // We only pass these here for ufo experience.
+          display: analytics === null || analytics === void 0 ? void 0 : analytics.display,
+          extensionKey: analytics === null || analytics === void 0 ? void 0 : analytics.extensionKey
+        });
         if (onClick) {
           onClick();
         }

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

@@ -2,6 +2,9 @@ import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import Action from '../index';
 import { openUrl } from '../../../../../../utils';
+import { ActionName } from '../../../../../../constants';
+import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
+import useInvokeClientAction from '../../../../../../state/hooks/use-invoke-client-action';
 const ViewAction = props => {
   const {
     appearance,
@@ -11,11 +14,22 @@ const ViewAction = props => {
     viewUrl,
     url
   } = props;
+  const analytics = useFlexibleUiAnalyticsContext();
+  const invoke = useInvokeClientAction({
+    analytics
+  });
   if (viewUrl && url) {
     const action = {
       ...props,
       onClick: () => {
-        openUrl(viewUrl);
+        invoke({
+          actionType: ActionName.ViewAction,
+          actionFn: async () => openUrl(viewUrl),
+          // These values have already been set in analytics context.
+          // We only pass these here for ufo experience.
+          display: analytics === null || analytics === void 0 ? void 0 : analytics.display,
+          extensionKey: analytics === null || analytics === void 0 ? void 0 : analytics.extensionKey
+        });
         if (onClick) {
           onClick();
         }

package/dist/es2019/view/FlexibleCard/components/utils.js

@@ -142,15 +142,8 @@ export const hasWhiteSpace = str => {
   return str.search(/\s/) >= 0;
 };
 export const openEmbedModalWithFlexibleUiIcon = ({
-  analytics,
-  downloadUrl,
   linkIcon,
-  onClose,
-  providerName,
-  src,
-  title,
-  url,
-  isSupportTheming
+  ...props
 }) => {
   const icon = {
     icon: /*#__PURE__*/React.createElement(Icon, _extends({}, linkIcon, {
@@ -159,18 +152,11 @@ export const openEmbedModalWithFlexibleUiIcon = ({
     isFlexibleUi: true
   };
   return openEmbedModal({
-    analytics,
-    download: downloadUrl,
+    ...props,
     icon,
     // Flex should not send origin as block card. It should be able to support
     // its internal parent components like hover card, block card and
     // itself as a standalone. To be investigated and fix in EDM-7520.
-    origin: 'smartLinkCard',
-    providerName,
-    onClose,
-    src,
-    title,
-    url,
-    isSupportTheming
+    origin: 'smartLinkCard'
   });
 };

package/dist/es2019/view/FlexibleCard/index.js

@@ -13,6 +13,7 @@ import { getContextByStatus, getRetryOptions } from './utils';
  */
 const FlexibleCard = ({
   analytics,
+  appearance = 'flexible',
   cardState,
   children,
   id,
@@ -28,6 +29,7 @@ const FlexibleCard = ({
   ui,
   url
 }) => {
+  var _details$meta2;
   const {
     status: cardType,
     details
@@ -45,6 +47,14 @@ const FlexibleCard = ({
   const {
     title
   } = context || {};
+  const analyticsContext = useMemo(() => {
+    var _details$meta;
+    return analytics ? {
+      ...analytics,
+      display: appearance,
+      extensionKey: details === null || details === void 0 ? void 0 : (_details$meta = details.meta) === null || _details$meta === void 0 ? void 0 : _details$meta.key
+    } : undefined;
+  }, [analytics, appearance, details === null || details === void 0 ? void 0 : (_details$meta2 = details.meta) === null || _details$meta2 === void 0 ? void 0 : _details$meta2.key]);
   useEffect(() => {
     switch (status) {
       case SmartLinkStatus.Resolved:
@@ -70,7 +80,7 @@ const FlexibleCard = ({
     }
   }, [onError, onResolve, status, title, url]);
   return /*#__PURE__*/React.createElement(FlexibleUiAnalyticsContext.Provider, {
-    value: analytics
+    value: analyticsContext
   }, /*#__PURE__*/React.createElement(FlexibleUiOptionContext.Provider, {
     value: ui
   }, /*#__PURE__*/React.createElement(FlexibleUiContext.Provider, {

package/dist/es2019/view/HoverCard/components/HoverCardContent.js

@@ -111,6 +111,7 @@ const HoverCardContent = ({
     subtitle: subtitle
   };
   const flexibleCardProps = {
+    appearance: CardDisplay.HoverCardPreview,
     cardState: cardState,
     onClick: onClick,
     onResolve: onResolve,

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

@@ -8,7 +8,7 @@ import LinkWarningModal from './LinkWarningModal';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 const PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.24.0",
+  packageVersion: "26.25.0",
   componentName: 'linkUrl'
 };
 const Link = withLinkClickedEvent('a');

package/dist/esm/extractors/block/index.js

@@ -8,7 +8,7 @@ import { extractCommentCount, extractProgrammingLanguage, extractSubscriberCount
 import { extractLink, extractTitle, extractProvider, extractMembers, extractPersonAssignedTo, extractPersonCreatedBy, extractPersonUpdatedBy, extractImage } from '@atlaskit/link-extractors';
 import { extractByline } from '../common/byline/extractByline';
 import { extractTitlePrefix } from '../common/title-prefix/extractTitlePrefix';
-import { extractActions } from '../common/actions/extractActions';
+import { extractClientActions } from '../common/actions/extractActions';
 import { extractPreviewAction } from '../common/actions/extractPreviewAction';
 import { extractIsTrusted } from '../common/meta/extractIsTrusted';
 var extractBlockIcon = function extractBlockIcon(jsonLd) {
@@ -31,7 +31,7 @@ var extractBlockDetails = function extractBlockDetails(jsonLd) {
 export var extractBlockActions = function extractBlockActions(props, jsonLd, opts, platform, meta) {
   if (opts) {
     var handleInvoke = opts.handleInvoke;
-    var actions = extractActions(jsonLd, handleInvoke);
+    var actions = extractClientActions(jsonLd, handleInvoke);
     var previewAction = extractPreviewAction(_objectSpread(_objectSpread({}, opts), {}, {
       viewProps: props,
       jsonLd: jsonLd,

package/dist/esm/extractors/common/actions/extractActions.js

@@ -1,4 +1,3 @@
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -37,27 +36,6 @@ var getClientActionProps = function getClientActionProps(jsonLd, action, handler
     }
   });
 };
-var getServerActionProps = function getServerActionProps(jsonLd, action, handler) {
-  var id = action['@id'] || action['@type'];
-  var data = {
-    type: 'server',
-    key: action.identifier,
-    action: {
-      type: action['@type'],
-      payload: {
-        id: id,
-        context: jsonLd.context
-      }
-    }
-  };
-  return {
-    id: id,
-    text: action.name,
-    promise: function promise() {
-      return handler(data);
-    }
-  };
-};
 export var getActionsFromJsonLd = function getActionsFromJsonLd(jsonLd) {
   var actions = jsonLd && jsonLd['schema:potentialAction'];
   if (!actions) {
@@ -68,17 +46,11 @@ export var getActionsFromJsonLd = function getActionsFromJsonLd(jsonLd) {
   }
   return actions;
 };
-export function extractActions(jsonLd, handler) {
+export function extractClientActions(jsonLd, handler) {
   var actions = getActionsFromJsonLd(jsonLd);
   var clientActions = actions.filter(isClientAction);
-  var serverActions = actions.filter(function (action) {
-    return !isClientAction(action);
-  });
   var clientActionImpls = clientActions.map(function (action) {
     return getClientActionProps(jsonLd, action, handler);
   });
-  var serverActionImpls = serverActions.map(function (action) {
-    return getServerActionProps(jsonLd, action, handler);
-  });
-  return [].concat(_toConsumableArray(clientActionImpls), _toConsumableArray(serverActionImpls));
+  return clientActionImpls;
 }

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

@@ -247,11 +247,11 @@ export var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, _dispatch
        * @param extensionKey The extensionKey of the Smart Link resovler invoked.
        * @param actionType The type of the action that was clicked, e.g. PreviewAction
        * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
-       * @param invokeType Whether the action invoked made a call to a server.
+       * @param invokeType @deprecated {@link https://hello.atlassian.net/browse/ENGHEALTH-2681 Internal documentation for deprecation (no external access)}
        * @returns
        */
       actionClickedEvent: function actionClickedEvent(_ref6) {
-        var experienceId = _ref6.id,
+        var id = _ref6.id,
           actionType = _ref6.actionType,
           display = _ref6.display,
           invokeType = _ref6.invokeType,
@@ -262,14 +262,8 @@ export var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, _dispatch
           destinationSubproduct = _ref6.destinationSubproduct,
           location = _ref6.location;
         var extensionKey = overrideExtensionKey !== null && overrideExtensionKey !== void 0 ? overrideExtensionKey : extractedExtensionKey;
-        startUfoExperience('smart-link-action-invocation', experienceId, {
-          actionType: actionType,
-          display: display,
-          extensionKey: extensionKey,
-          invokeType: invokeType
-        });
         dispatchAnalytics(applyCommonAttributes(uiActionClickedEvent({
-          id: defaultId,
+          id: id !== null && id !== void 0 ? id : defaultId,
           actionType: actionType,
           display: display,
           extensionKey: extensionKey,
@@ -527,7 +521,7 @@ export var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, _dispatch
        * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
        */
       invokeSucceededEvent: function invokeSucceededEvent(_ref13) {
-        var experienceId = _ref13.id,
+        var id = _ref13.id,
           actionType = _ref13.actionType,
           display = _ref13.display,
           extensionKey = _ref13.extensionKey,
@@ -536,9 +530,8 @@ export var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, _dispatch
           destinationProduct = _ref13.destinationProduct,
           destinationSubproduct = _ref13.destinationSubproduct,
           location = _ref13.location;
-        succeedUfoExperience('smart-link-action-invocation', experienceId);
         dispatchAnalytics(applyCommonAttributes(_invokeSucceededEvent({
-          id: defaultId,
+          id: id !== null && id !== void 0 ? id : defaultId,
           actionType: actionType,
           display: display,
           extensionKey: extensionKey,
@@ -558,7 +551,7 @@ export var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, _dispatch
        * @param reason The reason the invocation failed.
        */
       invokeFailedEvent: function invokeFailedEvent(_ref14) {
-        var experienceId = _ref14.id,
+        var id = _ref14.id,
           actionType = _ref14.actionType,
           display = _ref14.display,
           reason = _ref14.reason,
@@ -568,9 +561,8 @@ export var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, _dispatch
           destinationProduct = _ref14.destinationProduct,
           destinationSubproduct = _ref14.destinationSubproduct,
           location = _ref14.location;
-        failUfoExperience('smart-link-action-invocation', experienceId);
         dispatchAnalytics(applyCommonAttributes(_invokeFailedEvent({
-          id: defaultId,
+          id: id !== null && id !== void 0 ? id : defaultId,
           actionType: actionType,
           display: display,
           reason: reason,