@atlaskit/smart-card 19.1.13 → 19.1.14

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

@@ -26,17 +26,19 @@ export function CardWithUrlContent({
   inlinePreloaderStyle,
   ui,
   children,
-  showHoverPreview
+  showHoverPreview,
+  analyticsEvents
 }) {
   // Get state, actions for this card.
   const {
     state,
     actions,
+    analytics: defaultAnalytics,
     config,
-    analytics,
     renderers,
     error
   } = useSmartLink(id, url, dispatchAnalytics);
+  const analytics = analyticsEvents || defaultAnalytics;
   const definitionId = getDefinitionId(state.details);
   const extensionKey = getExtensionKey(state.details);
   const resourceType = getResourceType(state.details);
@@ -48,17 +50,15 @@ export function CardWithUrlContent({
     isSpecialEvent(event) ? window.open(clickUrl, '_blank') : window.open(clickUrl, '_self');
   }, [state.details, url]);
   const handleClickWrapper = useCallback(event => {
-    if (state.status === 'resolved') {
-      const isModifierKeyPressed = isSpecialEvent(event);
-      analytics.ui.cardClickedEvent(isFlexibleUi ? 'flexible' : appearance, definitionId, extensionKey, isModifierKeyPressed);
-    }
+    const isModifierKeyPressed = isSpecialEvent(event);
+    analytics.ui.cardClickedEvent(id, isFlexibleUi ? 'flexible' : appearance, state.status, definitionId, extensionKey, isModifierKeyPressed);
 
     if (onClick) {
       onClick(event);
     } else if (!isFlexibleUi) {
       handleClick(event);
     }
-  }, [state.status, analytics.ui, appearance, definitionId, extensionKey, onClick, handleClick, isFlexibleUi]);
+  }, [id, state.status, analytics.ui, appearance, definitionId, extensionKey, onClick, handleClick, isFlexibleUi]);
   const handleAuthorize = useCallback(() => actions.authorize(appearance), [actions, appearance]);
   const handleRetry = useCallback(() => {
     actions.reload();
@@ -80,7 +80,7 @@ export function CardWithUrlContent({
 
   useEffect(() => {
     if (isFinalState(state.status)) {
-      analytics.ui.renderSuccessEvent(appearance, id, definitionId, extensionKey);
+      analytics.ui.renderSuccessEvent(appearance, state.status, id, definitionId, extensionKey);
     }
   }, [appearance, state.details, state.status, url, definitionId, extensionKey, analytics.ui, id]);
 
@@ -98,6 +98,7 @@ export function CardWithUrlContent({
     }
 
     return /*#__PURE__*/React.createElement(FlexibleCard, {
+      id: id,
       cardState: cardState,
       onAuthorize: services.length && handleAuthorize || undefined,
       onClick: handleClickWrapper,
@@ -117,6 +118,7 @@ export function CardWithUrlContent({
   switch (appearance) {
     case 'inline':
       return /*#__PURE__*/React.createElement(InlineCard, {
+        id: id,
         url: url,
         renderers: renderers,
         cardState: state,
@@ -131,6 +133,7 @@ export function CardWithUrlContent({
 
     case 'block':
       return /*#__PURE__*/React.createElement(BlockCard, {
+        id: id,
         url: url,
         renderers: renderers,
         authFlow: config && config.authFlow,
@@ -149,6 +152,7 @@ export function CardWithUrlContent({
 
     case 'embed':
       return /*#__PURE__*/React.createElement(EmbedCard, {
+        id: id,
         url: url,
         cardState: state,
         handleAuthorize: services.length && handleAuthorize || undefined,

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

@@ -9,7 +9,7 @@ const LazyCardWithUrlContent = /*#__PURE__*/lazy(() => import(
 /* webpackChunkName: "@atlaskit-internal_smartcard-urlcardcontent" */
 './component-lazy/index'));
 export function CardWithURLRenderer(props) {
-  const [id] = useState(() => uuid());
+  const [id] = useState(() => props.id ? props.id : uuid());
   useEffect(() => {
     // ComponentWillUnmount
     return () => {
@@ -34,7 +34,8 @@ export function CardWithURLRenderer(props) {
     createAnalyticsEvent,
     children,
     ui,
-    showHoverPreview
+    showHoverPreview,
+    analyticsEvents
   } = props; // Wrapper around analytics.
 
   const dispatchAnalytics = useCallback(analyticsPayload => {
@@ -94,7 +95,8 @@ export function CardWithURLRenderer(props) {
     embedIframeRef,
     inlinePreloaderStyle,
     ui,
-    showHoverPreview
+    showHoverPreview,
+    analyticsEvents
   };
   return /*#__PURE__*/React.createElement(ErrorBoundary, {
     FallbackComponent: ErrorFallback,

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

@@ -20,6 +20,7 @@ import { getSimulatedMetadata } from './utils';
 import extractPreview from '../../extractors/flexible/extract-preview';
 export const HoverCardComponent = ({
   children,
+  id,
   url,
   createAnalyticsEvent
 }) => {
@@ -32,7 +33,7 @@ export const HoverCardComponent = ({
   const fadeInTimeoutId = useRef();
   const cardOpenTime = useRef();
   const linkState = useLinkState(url);
-  const analytics = useSmartLinkAnalytics(analyticsHandler);
+  const analytics = useSmartLinkAnalytics(url, analyticsHandler, id);
   const extensionKey = useMemo(() => getExtensionKey(linkState.details), [linkState]);
   const definitionId = useMemo(() => getDefinitionId(linkState.details), [linkState]);
   const initHideCard = useCallback(() => {
@@ -106,6 +107,7 @@ export const HoverCardComponent = ({
       onMouseLeave: initHideCard,
       css: HoverCardContainer
     }, jsx(Card, {
+      id: id,
       appearance: "block",
       url: url,
       ui: {

package/dist/es2019/view/HoverCard/utils.js

@@ -1,4 +1,4 @@
-export const getSimulatedMetadata = extensionKey => {
+export const getSimulatedMetadata = (extensionKey = '') => {
   switch (extensionKey) {
     case 'confluence-object-provider':
       return {

package/dist/es2019/view/InlineCard/ResolvedView/index.js

@@ -22,6 +22,7 @@ export class InlineCardResolvedView extends React.Component {
 
   render() {
     const {
+      id,
       title = '',
       isSelected,
       onClick,
@@ -46,6 +47,7 @@ export class InlineCardResolvedView extends React.Component {
 
     if (showHoverPreview && link) {
       return /*#__PURE__*/React.createElement(HoverCard, {
+        id: id,
         url: link
       }, inlineCardResolvedView);
     }

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

@@ -11,6 +11,7 @@ import { InlineCardResolvingView } from './ResolvingView';
 import { InlineCardUnauthorizedView } from './UnauthorisedView';
 export { InlineCardResolvedView, InlineCardResolvingView, InlineCardErroredView, InlineCardForbiddenView, InlineCardUnauthorizedView };
 export const InlineCard = ({
+  id,
   url,
   cardState,
   handleAuthorize,
@@ -53,6 +54,7 @@ export const InlineCard = ({
       }
 
       return /*#__PURE__*/React.createElement(InlineCardResolvedView, _extends({}, resolvedProps, {
+        id: id,
         showHoverPreview: showHoverPreview,
         link: url,
         isSelected: isSelected,

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

@@ -73,7 +73,7 @@ export var extractPreviewAction = function extractPreviewAction() {
     var previewAction = PreviewAction(_objectSpread(_objectSpread({}, metadata), {}, {
       testId: testId,
       onOpen: function onOpen() {
-        handleAnalytics(uiRenderSuccessEvent('preview', key));
+        handleAnalytics(uiRenderSuccessEvent('preview', 'resolved', key));
       },
       onOpenFailed: function onOpenFailed(error, errorInfo) {
         handleAnalytics(uiRenderFailedEvent('preview', error, errorInfo));

package/dist/esm/index.js

@@ -1,4 +1,4 @@
-export { SmartCardProvider as Provider, SmartCardContext } from './state';
+export { SmartCardProvider as Provider, SmartCardContext, useSmartLinkAnalytics } from './state';
 export { EditorCardProvider, editorCardProvider } from '@atlaskit/link-provider';
 export { APIError } from '@atlaskit/linking-common';
 export { CardClient as Client } from '@atlaskit/link-provider';

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

@@ -1,34 +1,149 @@
 import { useMemo } from 'react';
-import { uiAuthEvent, uiAuthAlternateAccountEvent, uiCardClickedEvent, uiActionClickedEvent, uiClosedAuthEvent, uiRenderSuccessEvent, uiHoverCardViewedEvent, uiHoverCardDismissedEvent, uiHoverCardOpenLinkClickedEvent, resolvedEvent as _resolvedEvent, unresolvedEvent as _unresolvedEvent, invokeSucceededEvent as _invokeSucceededEvent, invokeFailedEvent as _invokeFailedEvent, connectSucceededEvent as _connectSucceededEvent, connectFailedEvent as _connectFailedEvent, trackAppAccountConnected, screenAuthPopupEvent, instrumentEvent } from '../../utils/analytics';
+import { getUrl } from '@atlaskit/linking-common';
+import { uiAuthEvent, uiAuthAlternateAccountEvent, uiCardClickedEvent, uiActionClickedEvent, uiClosedAuthEvent, uiRenderSuccessEvent, uiHoverCardViewedEvent, uiHoverCardDismissedEvent, uiHoverCardOpenLinkClickedEvent, invokeSucceededEvent as _invokeSucceededEvent, invokeFailedEvent as _invokeFailedEvent, connectSucceededEvent as _connectSucceededEvent, connectFailedEvent as _connectFailedEvent, trackAppAccountConnected, screenAuthPopupEvent, instrumentEvent } from '../../utils/analytics';
 import { failUfoExperience, startUfoExperience, succeedUfoExperience } from './ufoExperiences';
-export var useSmartLinkAnalytics = function useSmartLinkAnalytics(dispatchAnalytics) {
+import { getDefinitionId, getExtensionKey, getResourceType } from '../helpers';
+import { useSmartLinkContext } from '@atlaskit/link-provider';
+/**
+ * This hook provides usage of Smart Link analytics outside of the Card component.
+ * Can be provided to Card via the analyticsEvents prop to change the analytics events.
+ * @param url URL of the link
+ * @param dispatchAnalytics dispatchAnalytics function
+ * @param id fallback id of the events sent if no id is available
+ * @param defaultLocation location attribute to be used
+ * @returns
+ */
+
+export var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, dispatchAnalytics, id, defaultLocation) {
+  var defaultId = id || 'NULL'; // We don't want to trigger a re-render by using useSmartCardState
+
+  var _useSmartLinkContext = useSmartLinkContext(),
+      store = _useSmartLinkContext.store;
+
+  var state = getUrl(store, url);
+  var extractedDefinitionId = getDefinitionId(state.details);
+  var extractedExtensionKey = getExtensionKey(state.details);
+  var extractedResourceType = getResourceType(state.details);
+  /** Contains all ui analytics events */
+
   var ui = useMemo(function () {
     return {
-      authEvent: function authEvent(display, definitionId, extensionKey) {
+      /**
+       * This fires an event that represents when a user clicks on the authentication
+       * call to action with no current authenticated account. (i.e. Connect to Preview).
+       * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @returns
+       */
+      authEvent: function authEvent(display) {
+        var definitionId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedDefinitionId;
+        var extensionKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedExtensionKey;
         return dispatchAnalytics(uiAuthEvent(display, definitionId, extensionKey));
       },
-      authAlternateAccountEvent: function authAlternateAccountEvent(display, definitionId, extensionKey) {
+
+      /**
+       * This fires an event that represents when a user clicks on the authentication
+       * call to action with a forbidden authenticated account. (i.e. Try another account).
+       * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @returns
+       */
+      authAlternateAccountEvent: function authAlternateAccountEvent(display) {
+        var definitionId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedDefinitionId;
+        var extensionKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedExtensionKey;
         return dispatchAnalytics(uiAuthAlternateAccountEvent(display, definitionId, extensionKey));
       },
-      cardClickedEvent: function cardClickedEvent(display, definitionId, extensionKey, isModifierKeyPressed) {
-        return dispatchAnalytics(uiCardClickedEvent(display, definitionId, extensionKey, isModifierKeyPressed));
+
+      /**
+       * This fires an event that represents when a user clicks on a Smart Link.
+       * @param id The unique ID for this Smart Link.
+       * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @param isModifierKeyPressed Whether a modifier key was pressed when clicking the Smart Link.
+       * @param location Where the Smart Link is currently rendered.
+       * @param destinationProduct The product the Smart Link is linked to.
+       * @returns
+       */
+      cardClickedEvent: function cardClickedEvent() {
+        var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultId;
+        var display = arguments.length > 1 ? arguments[1] : undefined;
+        var status = arguments.length > 2 ? arguments[2] : undefined;
+        var definitionId = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : extractedDefinitionId;
+        var extensionKey = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : extractedExtensionKey;
+        var isModifierKeyPressed = arguments.length > 5 ? arguments[5] : undefined;
+        var location = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : defaultLocation;
+        var destinationProduct = arguments.length > 7 ? arguments[7] : undefined;
+        return dispatchAnalytics(uiCardClickedEvent(id, display, status, definitionId, extensionKey, isModifierKeyPressed, location, destinationProduct));
       },
-      actionClickedEvent: function actionClickedEvent(id, extensionKey, actionType, display, invokeType) {
+
+      /**
+       * This fires an event that represents when a user clicks on a Smart Link action.
+       * Note: This also starts the UFO smart-link-action-invocation experience.
+       * @param id The unique ID for this Smart Link.
+       * @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.
+       * @returns
+       */
+      actionClickedEvent: function actionClickedEvent() {
+        var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultId;
+        var extensionKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedExtensionKey;
+        var actionType = arguments.length > 2 ? arguments[2] : undefined;
+        var display = arguments.length > 3 ? arguments[3] : undefined;
+        var invokeType = arguments.length > 4 ? arguments[4] : undefined;
         startUfoExperience('smart-link-action-invocation', id, {
           actionType: actionType,
           display: display,
           extensionKey: extensionKey,
           invokeType: invokeType
         });
-        dispatchAnalytics(uiActionClickedEvent(extensionKey, actionType, display));
+        dispatchAnalytics(uiActionClickedEvent(actionType, extensionKey, display));
       },
-      hoverCardOpenLinkClickedEvent: function hoverCardOpenLinkClickedEvent(previewDisplay, definitionId, extensionKey, previewInvokeMethod) {
+
+      /**
+       * This fires an event that represents when a user clicks on a hover preview's "navigate to link" button.
+       * https://product-fabric.atlassian.net/wiki/spaces/EM/pages/3206743323/Analytics+Metrics+-+Hover+Previews
+       * @param previewDisplay What format the preview is in.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @param previewInvokeMethod How the preview was triggered.
+       */
+      hoverCardOpenLinkClickedEvent: function hoverCardOpenLinkClickedEvent(previewDisplay) {
+        var definitionId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedDefinitionId;
+        var extensionKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedExtensionKey;
+        var previewInvokeMethod = arguments.length > 3 ? arguments[3] : undefined;
         dispatchAnalytics(uiHoverCardOpenLinkClickedEvent(previewDisplay, definitionId, extensionKey, previewInvokeMethod));
       },
-      closedAuthEvent: function closedAuthEvent(display, definitionId, extensionKey) {
+
+      /**
+       * This fires an event that represents when a user closed the authentication window without authenticating after opening it.
+       * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @returns
+       */
+      closedAuthEvent: function closedAuthEvent(display) {
+        var definitionId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedDefinitionId;
+        var extensionKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedExtensionKey;
         return dispatchAnalytics(uiClosedAuthEvent(display, definitionId, extensionKey));
       },
-      renderSuccessEvent: function renderSuccessEvent(display, id, definitionId, extensionKey) {
+
+      /**
+       * This fires an event that represents when a Smart Link was rendered successfully.
+       * Note: this fires even if the Smart Link request errored out.
+       * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+       * @param id The unique ID for this Smart Link.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       */
+      renderSuccessEvent: function renderSuccessEvent(display, status) {
+        var id = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : defaultId;
+        var definitionId = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : extractedDefinitionId;
+        var extensionKey = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : extractedExtensionKey;
         succeedUfoExperience('smart-link-rendered', id, {
           extensionKey: extensionKey,
           display: display
@@ -37,47 +152,131 @@ export var useSmartLinkAnalytics = function useSmartLinkAnalytics(dispatchAnalyt
         succeedUfoExperience('smart-link-authenticated', id, {
           display: display
         });
-        dispatchAnalytics(uiRenderSuccessEvent(display, definitionId, extensionKey));
+        dispatchAnalytics(uiRenderSuccessEvent(display, status, definitionId, extensionKey));
       },
-      hoverCardViewedEvent: function hoverCardViewedEvent(hoverDisplay, definitionId, extensionKey, previewInvokeMethod) {
+
+      /**
+       * This fires an event that represents a hover preview being opened.
+       * @param hoverDisplay Whether the hover preview was displayed as a card or embed.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @param previewInvokeMethod How the preview was triggered.
+       * @returns
+       */
+      hoverCardViewedEvent: function hoverCardViewedEvent(hoverDisplay) {
+        var definitionId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedDefinitionId;
+        var extensionKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedExtensionKey;
+        var previewInvokeMethod = arguments.length > 3 ? arguments[3] : undefined;
         return dispatchAnalytics(uiHoverCardViewedEvent(hoverDisplay, definitionId, extensionKey, previewInvokeMethod));
       },
-      hoverCardDismissedEvent: function hoverCardDismissedEvent(hoverDisplay, hoverTime, definitionId, extensionKey, previewInvokeMethod) {
+
+      /**
+       * This fires an event that represents a hover preview being dismissed.
+       * @param hoverDisplay Whether the hover preview was displayed as a card or embed.
+       * @param hoverTime The duration that the user hovered over a Smart Link before the preview was dismissed.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @param previewInvokeMethod How the preview was triggered.
+       * @returns
+       */
+      hoverCardDismissedEvent: function hoverCardDismissedEvent(hoverDisplay, hoverTime) {
+        var definitionId = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedDefinitionId;
+        var extensionKey = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : extractedExtensionKey;
+        var previewInvokeMethod = arguments.length > 4 ? arguments[4] : undefined;
         return dispatchAnalytics(uiHoverCardDismissedEvent(hoverDisplay, hoverTime, definitionId, extensionKey, previewInvokeMethod));
       }
     };
-  }, [dispatchAnalytics]);
+  }, [defaultId, defaultLocation, extractedDefinitionId, extractedExtensionKey, dispatchAnalytics]);
+  /** Contains all operational analytics events */
+
   var operational = useMemo(function () {
     return {
-      resolvedEvent: function resolvedEvent(id, definitionId, extensionKey, resourceType) {
-        return dispatchAnalytics(_resolvedEvent(id, definitionId, extensionKey, resourceType));
-      },
-      unresolvedEvent: function unresolvedEvent(id, status, definitionId, extensionKey, resourceType) {
-        return dispatchAnalytics(_unresolvedEvent(id, status, definitionId, extensionKey, resourceType));
-      },
-      invokeSucceededEvent: function invokeSucceededEvent(id, providerKey, actionType, display) {
+      /**
+       * This fires an event that represents an action being successfully invoked.
+       * @param id The unique ID for this Smart Link.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @param actionType The type of action invoked, e.g. PreviewAction
+       * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+       */
+      invokeSucceededEvent: function invokeSucceededEvent() {
+        var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultId;
+        var extensionKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedExtensionKey;
+        var actionType = arguments.length > 2 ? arguments[2] : undefined;
+        var display = arguments.length > 3 ? arguments[3] : undefined;
         succeedUfoExperience('smart-link-action-invocation', id);
-        dispatchAnalytics(_invokeSucceededEvent(id, providerKey, actionType, display));
+        dispatchAnalytics(_invokeSucceededEvent(id, actionType, display, extensionKey));
       },
-      invokeFailedEvent: function invokeFailedEvent(id, providerKey, actionType, display, reason) {
+
+      /**
+       * This fires an event that represents an action being unsuccessfully invoked.
+       * @param id The unique ID for this Smart Link.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @param actionType The type of action invoked, e.g. PreviewAction
+       * @param display Whether the card was an Inline, Block, Embed or Flexible UI.
+       * @param reason The reason the invocation failed.
+       */
+      invokeFailedEvent: function invokeFailedEvent() {
+        var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultId;
+        var providerKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedExtensionKey;
+        var actionType = arguments.length > 2 ? arguments[2] : undefined;
+        var display = arguments.length > 3 ? arguments[3] : undefined;
+        var reason = arguments.length > 4 ? arguments[4] : undefined;
         failUfoExperience('smart-link-action-invocation', id);
-        dispatchAnalytics(_invokeFailedEvent(id, providerKey, actionType, display, reason));
+        dispatchAnalytics(_invokeFailedEvent(id, actionType, display, reason, providerKey));
       },
-      connectSucceededEvent: function connectSucceededEvent(id, definitionId, extensionKey) {
+
+      /**
+       * This fires an event that represents an account successfully being connected via a Smart Link.
+       * @param id The unique ID for this Smart Link.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       */
+      connectSucceededEvent: function connectSucceededEvent() {
+        var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultId;
+        var definitionId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedDefinitionId;
+        var extensionKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedExtensionKey;
         startUfoExperience('smart-link-authenticated', id, {
           extensionKey: extensionKey,
           status: 'success'
         });
         dispatchAnalytics(_connectSucceededEvent(definitionId, extensionKey));
       },
-      connectFailedEvent: function connectFailedEvent(id, definitionId, extensionKey, status) {
+
+      /**
+       * This fires an event that represents an account unsuccessfully being connected.
+       * @param id The unique ID for this Smart Link.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @param reason The reason why the Smart Link connect account failed.
+       */
+      connectFailedEvent: function connectFailedEvent() {
+        var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultId;
+        var definitionId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedDefinitionId;
+        var extensionKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedExtensionKey;
+        var reason = arguments.length > 3 ? arguments[3] : undefined;
         startUfoExperience('smart-link-authenticated', id, {
           extensionKey: extensionKey,
-          status: status
+          status: reason
         });
-        dispatchAnalytics(_connectFailedEvent(definitionId, extensionKey, status));
+        dispatchAnalytics(_connectFailedEvent(definitionId, extensionKey, reason));
       },
-      instrument: function instrument(id, status, definitionId, extensionKey, resourceType, error) {
+
+      /**
+       * This fires an event which represents a Smart Link request succeeding or failing based on the status.
+       * @param id The unique ID for this Smart Link.
+       * @param status The status of the Smart Link.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @param resourceType The type of resource that was invoked. This is provider specific (e.g. File, PullRequest).
+       * @param error An error representing why the Smart Link request failed.
+       */
+      instrument: function instrument() {
+        var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultId;
+        var status = arguments.length > 1 ? arguments[1] : undefined;
+        var definitionId = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedDefinitionId;
+        var extensionKey = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : extractedExtensionKey;
+        var resourceType = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : extractedResourceType;
+        var error = arguments.length > 5 ? arguments[5] : undefined;
         var event = instrumentEvent(id, status, definitionId, extensionKey, resourceType, error);
 
         if (event) {
@@ -85,21 +284,41 @@ export var useSmartLinkAnalytics = function useSmartLinkAnalytics(dispatchAnalyt
         }
       }
     };
-  }, [dispatchAnalytics]);
+  }, [defaultId, extractedResourceType, extractedDefinitionId, extractedExtensionKey, dispatchAnalytics]);
+  /** Contains all track analytics events */
+
   var track = useMemo(function () {
     return {
-      appAccountConnected: function appAccountConnected(definitionId, extensionKey) {
+      /**
+       * This fires an event which represents a user starting the Smart Link connect account process.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @returns
+       */
+      appAccountConnected: function appAccountConnected() {
+        var definitionId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : extractedDefinitionId;
+        var extensionKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedExtensionKey;
         return dispatchAnalytics(trackAppAccountConnected(definitionId, extensionKey));
       }
     };
-  }, [dispatchAnalytics]);
+  }, [extractedDefinitionId, extractedExtensionKey, dispatchAnalytics]);
+  /** Contains all screen analytics events */
+
   var screen = useMemo(function () {
     return {
-      authPopupEvent: function authPopupEvent(definitionId, extensionKey) {
+      /**
+       * This fires an event which represents the connect account page being opened.
+       * @param definitionId The definitionId of the Smart Link resolver invoked.
+       * @param extensionKey The extensionKey of the Smart Link resovler invoked.
+       * @returns
+       */
+      authPopupEvent: function authPopupEvent() {
+        var definitionId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : extractedDefinitionId;
+        var extensionKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedExtensionKey;
         return dispatchAnalytics(screenAuthPopupEvent(definitionId, extensionKey));
       }
     };
-  }, [dispatchAnalytics]);
+  }, [extractedDefinitionId, extractedExtensionKey, dispatchAnalytics]);
   return useMemo(function () {
     return {
       ui: ui,

package/dist/esm/state/hooks/useSmartLink.js

@@ -7,7 +7,7 @@ import { useSmartLinkAnalytics } from '../analytics';
 import { useSmartLinkRenderers } from '../renderers';
 export function useSmartLink(id, url, dispatchAnalytics) {
   var state = useSmartLinkState(url);
-  var analytics = useSmartLinkAnalytics(dispatchAnalytics);
+  var analytics = useSmartLinkAnalytics(url, dispatchAnalytics, id);
   var actions = useSmartLinkActions(id, url, analytics);
   var config = useSmartLinkConfig();
   var renderers = useSmartLinkRenderers(); // NB: used to propagate errors from hooks to error boundaries.

package/dist/esm/state/hooks-external/useSmartLinkActions.js

@@ -22,7 +22,7 @@ export function useSmartLinkActions(_ref) {
       setActions = _useState2[1];
 
   var linkState = useLinkState(url);
-  var linkAnalytics = useLinkAnalytics(analyticsHandler);
+  var linkAnalytics = useLinkAnalytics(url, analyticsHandler, id);
   var linkActions = useLinkActions(id, url, linkAnalytics);
   useEffect(function () {
     if (!linkState.details) {

package/dist/esm/state/hooks-external/useSmartLinkReload.js

@@ -14,7 +14,7 @@ export function useSmartLinkReload(_ref) {
   var id = useMemo(function () {
     return uuid();
   }, []);
-  var linkAnalytics = useLinkAnalytics(analyticsHandler);
+  var linkAnalytics = useLinkAnalytics(url, analyticsHandler, id);
   var linkActions = useLinkActions(id, url, linkAnalytics);
   return linkActions.reload;
 }

package/dist/esm/state/index.js

@@ -1,2 +1,3 @@
 export { SmartCardContext, SmartCardProvider, useSmartLinkContext } from '@atlaskit/link-provider';
-export { useSmartLink, usePrefetch } from './hooks';
+export { useSmartLink, usePrefetch } from './hooks';
+export { useSmartLinkAnalytics } from './analytics';