@atlaskit/profilecard 24.13.7 → 24.14.0

package/dist/es2019/client/UserProfileCardClient.js

@@ -1,7 +1,7 @@
 import { print } from 'graphql';
 import gql from 'graphql-tag';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { userRequestAnalytics } from '../util/analytics';
+import { PACKAGE_META_DATA, userRequestAnalytics } from '../util/analytics';
 import { localTime } from '../util/date';
 import { getPageTime } from '../util/performance';
 import CachingClient from './CachingClient';
@@ -149,7 +149,7 @@ export default class UserProfileCardClient extends CachingClient {
       timestring: timestring
     };
   }
-  getProfile(cloudId, userId, analytics) {
+  getProfile(cloudId, userId, analytics, analyticsNext) {
     if (!userId) {
       return Promise.reject(new Error('userId missing'));
     }
@@ -160,25 +160,62 @@ export default class UserProfileCardClient extends CachingClient {
     }
     return new Promise((resolve, reject) => {
       const startTime = getPageTime();
-      if (analytics) {
-        analytics(userRequestAnalytics('triggered'));
+      if (fg('ptc-enable-profile-card-analytics-refactor')) {
+        if (analyticsNext) {
+          analyticsNext('operational.profilecard.triggered.request', {
+            firedAt: Math.round(getPageTime()),
+            ...PACKAGE_META_DATA
+          });
+        }
+      } else {
+        if (analytics) {
+          analytics(userRequestAnalytics('triggered'));
+        }
       }
       this.makeRequest(cloudId, userId).then(data => {
         if (this.cache) {
           this.setCachedProfile(cacheIdentifier, data);
         }
-        if (analytics) {
-          analytics(userRequestAnalytics('succeeded', {
-            duration: getPageTime() - startTime
-          }));
+        if (fg('ptc-enable-profile-card-analytics-refactor')) {
+          if (analyticsNext) {
+            analyticsNext('operational.profilecard.succeeded.request', {
+              duration: getPageTime() - startTime,
+              firedAt: Math.round(getPageTime()),
+              ...PACKAGE_META_DATA
+            });
+          }
+        } else {
+          if (analytics) {
+            analytics(userRequestAnalytics('succeeded', {
+              duration: getPageTime() - startTime
+            }));
+          }
         }
         resolve(data);
       }).catch(error => {
-        if (analytics) {
-          analytics(userRequestAnalytics('failed', {
-            duration: getPageTime() - startTime,
-            ...getErrorAttributes(error)
-          }));
+        if (fg('ptc-enable-profile-card-analytics-refactor')) {
+          if (analyticsNext) {
+            const errorAttributes = getErrorAttributes(error);
+            analyticsNext('operational.profilecard.failed.request', {
+              duration: getPageTime() - startTime,
+              ...errorAttributes,
+              traceId: errorAttributes.traceId || null,
+              errorCategory: errorAttributes.errorCategory || null,
+              errorType: errorAttributes.errorType || null,
+              errorPath: errorAttributes.errorPath || null,
+              errorNumber: errorAttributes.errorNumber || null,
+              errorStatusCode: errorAttributes.errorStatusCode || null,
+              firedAt: Math.round(getPageTime()),
+              ...PACKAGE_META_DATA
+            });
+          }
+        } else {
+          if (analytics) {
+            analytics(userRequestAnalytics('failed', {
+              duration: getPageTime() - startTime,
+              ...getErrorAttributes(error)
+            }));
+          }
         }
         reject(error);
       });

package/dist/es2019/client/getOrgIdForCloudIdFromAGG.js

@@ -6,7 +6,7 @@ const ORG_ID_FROM_CLOUD_ID_QUERY = `query OrgIdFromCloudId($cloudId: ID!) {
 }`;
 const addHeaders = headers => {
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "24.13.6");
+  headers.append('atl-client-version', "24.13.7");
   return headers;
 };
 export async function getOrgIdForCloudIdFromAGG(url, cloudId) {

package/dist/es2019/client/getTeamFromAGG.js

@@ -77,7 +77,7 @@ export const addHeaders = headers => {
   headers.append('X-ExperimentalApi', 'teams-beta');
   headers.append('X-ExperimentalApi', 'team-members-beta');
   headers.append('atl-client-name', "@atlaskit/profilecard");
-  headers.append('atl-client-version', "24.13.6");
+  headers.append('atl-client-version', "24.13.7");
   return headers;
 };
 export async function getTeamFromAGG(url, teamId, siteId) {

package/dist/es2019/components/Agent/AgentProfileCard.js

@@ -129,6 +129,9 @@ const AgentProfileCard = ({
     return /*#__PURE__*/React.createElement(AgentProfileCardWrapper, null, /*#__PURE__*/React.createElement(ErrorMessage, {
       errorType: errorType,
       fireAnalytics: fireAnalytics
+      // TODO: Add fireAnalyticsNext
+      ,
+      fireAnalyticsNext: () => {}
     }));
   }
   return /*#__PURE__*/React.createElement(AgentProfileCardWrapper, null, /*#__PURE__*/React.createElement(Box, {

package/dist/es2019/components/Agent/AgentProfileCardResourced.js

@@ -89,7 +89,8 @@ export const AgentProfileCardResourced = props => {
         fetchData();
       },
       errorType: error || null,
-      fireAnalytics: () => {}
+      fireAnalytics: () => {},
+      fireAnalyticsNext: () => {}
     }));
   }
   return /*#__PURE__*/React.createElement(Suspense, {

package/dist/es2019/components/Error/ErrorMessage.js

@@ -2,10 +2,11 @@ import React, { useEffect } from 'react';
 import Button from '@atlaskit/button/new';
 import CrossCircleIcon from '@atlaskit/icon/core/cross-circle';
 import IconError from '@atlaskit/icon/glyph/cross-circle';
+import { fg } from '@atlaskit/platform-feature-flags';
 // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Text } from '@atlaskit/primitives';
 import { ErrorTitle, ErrorWrapper } from '../../styled/Error';
-import { profileCardRendered } from '../../util/analytics';
+import { PACKAGE_META_DATA, profileCardRendered } from '../../util/analytics';
 const ErrorMessage = props => {
   const errorType = props.errorType || {
     reason: 'default'
@@ -13,15 +14,25 @@ const ErrorMessage = props => {
   const errorReason = errorType.reason;
   const {
     fireAnalytics,
+    fireAnalyticsNext,
     reload
   } = props;
   const hasRetry = !!reload;
   useEffect(() => {
-    fireAnalytics(profileCardRendered('user', 'error', {
-      hasRetry,
-      errorType: errorReason
-    }));
-  }, [errorReason, fireAnalytics, hasRetry]);
+    if (fg('ptc-enable-profile-card-analytics-refactor')) {
+      fireAnalyticsNext('ui.profilecard.rendered.error', {
+        hasRetry,
+        errorType: errorReason,
+        firedAt: Math.round(performance.now()),
+        ...PACKAGE_META_DATA
+      });
+    } else {
+      fireAnalytics(profileCardRendered('user', 'error', {
+        hasRetry,
+        errorType: errorReason
+      }));
+    }
+  }, [errorReason, fireAnalytics, fireAnalyticsNext, hasRetry]);
   const errorContent = () => {
     if (errorReason === 'NotFound') {
       return /*#__PURE__*/React.createElement(ErrorTitle, null, "The user is no longer available for the site");

package/dist/es2019/components/User/OverflowProfileCardButtons.js

@@ -7,7 +7,8 @@ import MoreIcon from '@atlaskit/icon/core/migration/show-more-horizontal--more';
 import { fg } from '@atlaskit/platform-feature-flags';
 import messages from '../../messages';
 import { OverflowActionButtonsWrapper } from '../../styled/Card';
-import { moreActionsClicked } from '../../util/analytics';
+import { moreActionsClicked, PACKAGE_META_DATA } from '../../util/analytics';
+import { getPageTime } from '../../util/performance';
 export const ACTION_OVERFLOW_THRESHOLD = 2;
 export const OverflowProfileCardButtons = props => {
   const intl = useIntl();
@@ -15,7 +16,8 @@ export const OverflowProfileCardButtons = props => {
   const {
     actions,
     onItemClick,
-    fireAnalyticsWithDuration
+    fireAnalyticsWithDuration,
+    fireAnalyticsWithDurationNext
   } = props;
   const numActions = actions.length + ACTION_OVERFLOW_THRESHOLD;
   const onOpenChange = useCallback(({
@@ -23,14 +25,23 @@ export const OverflowProfileCardButtons = props => {
   }) => {
     setOpen(prevOpen => {
       if (nextOpen && !prevOpen) {
-        fireAnalyticsWithDuration(duration => moreActionsClicked('user', {
-          duration,
-          numActions
-        }));
+        if (fg('ptc-enable-profile-card-analytics-refactor')) {
+          fireAnalyticsWithDurationNext('ui.profilecard.clicked.moreActions', duration => ({
+            duration,
+            numActions,
+            firedAt: Math.round(getPageTime()),
+            ...PACKAGE_META_DATA
+          }));
+        } else {
+          fireAnalyticsWithDuration(duration => moreActionsClicked('user', {
+            duration,
+            numActions
+          }));
+        }
       }
       return nextOpen;
     });
-  }, [numActions, fireAnalyticsWithDuration]);
+  }, [numActions, fireAnalyticsWithDuration, fireAnalyticsWithDurationNext]);
   return /*#__PURE__*/React.createElement(OverflowActionButtonsWrapper, {
     testId: "profilecard-actions-overflow"
   }, /*#__PURE__*/React.createElement(DropdownMenu, {

package/dist/es2019/components/User/ProfileCard.js

@@ -5,12 +5,14 @@ import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import Avatar from '@atlaskit/avatar';
 import { LinkButton } from '@atlaskit/button/new';
 import { fg } from '@atlaskit/platform-feature-flags';
+import { componentWithFG } from '@atlaskit/platform-feature-flags-react';
 import Spinner from '@atlaskit/spinner';
+import { useAnalyticsEvents } from '@atlaskit/teams-app-internal-analytics';
 import { N0 } from '@atlaskit/theme/colors';
 import messages from '../../messages';
 import { ActionButtonGroup, ActionsFlexSpacer, AnimatedKudosButton, AnimationWrapper, CardContainer, CardContent, KudosBlobAnimation, ProfileImage } from '../../styled/Card';
 import { CardWrapper, SpinnerContainer } from '../../styled/UserTrigger';
-import { actionClicked, fireEvent, profileCardRendered } from '../../util/analytics';
+import { actionClicked, fireEvent, PACKAGE_META_DATA, profileCardRendered } from '../../util/analytics';
 import { isBasicClick } from '../../util/click';
 import { getPageTime } from '../../util/performance';
 import { ErrorMessage } from '../Error';
@@ -54,6 +56,9 @@ export const ProfilecardInternal = props => {
   const {
     createAnalyticsEvent
   } = props;
+  const {
+    fireEvent: fireEventNext
+  } = useAnalyticsEvents();
   const fireAnalytics = useCallback(payload => {
     if (createAnalyticsEvent) {
       fireEvent(createAnalyticsEvent, payload);
@@ -64,6 +69,11 @@ export const ProfilecardInternal = props => {
     const event = generator(elapsed);
     fireAnalytics(event);
   }, [fireAnalytics, openTime]);
+  const fireAnalyticsWithDurationNext = useCallback((eventKey, generator) => {
+    const duration = getPageTime() - openTime;
+    const attributes = generator(duration);
+    fireEventNext(eventKey, attributes);
+  }, [openTime, fireEventNext]);
   const {
     kudosAction
   } = useKudos(props.cloudId, props.userId, props.teamCentralBaseUrl, props.openKudosDrawer);
@@ -87,22 +97,33 @@ export const ProfilecardInternal = props => {
   const canRender = !hasError && !isLoading && !!(fullName || status === 'closed');
   useEffect(() => {
     if (canRender) {
-      fireAnalyticsWithDuration(duration => profileCardRendered('user', 'content', {
-        duration,
-        numActions: realActions.length
-      }));
+      if (fg('ptc-enable-profile-card-analytics-refactor')) {
+        fireAnalyticsWithDurationNext('ui.profilecard.rendered.content', duration => ({
+          duration,
+          numActions: realActions.length,
+          firedAt: Math.round(getPageTime()),
+          ...PACKAGE_META_DATA
+        }));
+      } else {
+        fireAnalyticsWithDuration(duration => profileCardRendered('user', 'content', {
+          duration,
+          numActions: realActions.length
+        }));
+      }
     }
-  }, [canRender, fireAnalyticsWithDuration, realActions]);
+  }, [canRender, fireAnalyticsWithDuration, fireAnalyticsWithDurationNext, realActions]);
   if (hasError) {
     return /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(ErrorMessage, {
       reload: props.clientFetchProfile,
       errorType: props.errorType || null,
-      fireAnalytics: fireAnalytics
+      fireAnalytics: fireAnalytics,
+      fireAnalyticsNext: fireEventNext
     }));
   }
   if (isLoading) {
     return /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(LoadingView, {
-      fireAnalyticsWithDuration: fireAnalyticsWithDuration
+      fireAnalyticsWithDuration: fireAnalyticsWithDuration,
+      fireAnalyticsWithDurationNext: fireAnalyticsWithDurationNext
     }));
   }
   if (!canRender) {
@@ -118,35 +139,51 @@ export const ProfilecardInternal = props => {
     borderColor: `var(--ds-shadow-overlay, ${N0})`
   })), /*#__PURE__*/React.createElement(CardContent, null, /*#__PURE__*/React.createElement(ProfileCardDetails, _extends({}, props, {
     status: status,
-    fireAnalyticsWithDuration: fireAnalyticsWithDuration
+    fireAnalyticsWithDuration: fireAnalyticsWithDuration,
+    fireAnalyticsWithDurationNext: fireAnalyticsWithDurationNext
   })), realActions && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ActionsFlexSpacer, null), /*#__PURE__*/React.createElement(Actions, _extends({}, fg('jfp_a11y_team_profile_card_actions_label') && {
     fullName
   }, {
     fullName: fullName,
     actions: realActions,
     fireAnalyticsWithDuration: fireAnalyticsWithDuration,
-    isTriggeredUsingKeyboard: props.isTriggeredUsingKeyboard
+    isTriggeredUsingKeyboard: props.isTriggeredUsingKeyboard,
+    fireAnalyticsWithDurationNext: fireAnalyticsWithDurationNext
   }))))));
 };
 const Actions = ({
   actions,
   fireAnalyticsWithDuration,
+  fireAnalyticsWithDurationNext,
   isTriggeredUsingKeyboard,
   fullName
 }) => {
   const onActionClick = useCallback((action, args, event, index) => {
-    fireAnalyticsWithDuration(duration => actionClicked('user', {
-      duration,
-      hasHref: !!action.link,
-      hasOnClick: !!action.callback,
-      index,
-      actionId: action.id || 'no-id-specified'
-    }));
+    if (fg('ptc-enable-profile-card-analytics-refactor')) {
+      fireAnalyticsWithDurationNext('ui.profilecard.clicked.action', duration => ({
+        method: 'click',
+        firedAt: Math.round(getPageTime()),
+        duration,
+        hasHref: !!action.link,
+        hasOnClick: !!action.callback,
+        index,
+        actionId: action.id || 'no-id-specified',
+        ...PACKAGE_META_DATA
+      }));
+    } else {
+      fireAnalyticsWithDuration(duration => actionClicked('user', {
+        duration,
+        hasHref: !!action.link,
+        hasOnClick: !!action.callback,
+        index,
+        actionId: action.id || 'no-id-specified'
+      }));
+    }
     if (action.callback && isBasicClick(event)) {
       event.preventDefault();
       action.callback(event, ...args);
     }
-  }, [fireAnalyticsWithDuration]);
+  }, [fireAnalyticsWithDuration, fireAnalyticsWithDurationNext]);
   if (!actions || actions.length === 0) {
     return null;
   }
@@ -175,21 +212,31 @@ const Actions = ({
   }), overflowActions && /*#__PURE__*/React.createElement(OverflowProfileCardButtons, _extends({
     actions: overflowActions,
     fireAnalyticsWithDuration: fireAnalyticsWithDuration,
+    fireAnalyticsWithDurationNext: fireAnalyticsWithDurationNext,
     onItemClick: (action, args, event, index) => onActionClick(action, args, event, index + ACTION_OVERFLOW_THRESHOLD)
   }, fg('jfp_a11y_team_profile_card_actions_label') && {
     fullName
   })));
 };
-const LoadingView = ({
-  fireAnalyticsWithDuration
+export const LoadingView = ({
+  fireAnalyticsWithDuration,
+  fireAnalyticsWithDurationNext
 }) => {
   useEffect(() => {
-    fireAnalyticsWithDuration(duration => profileCardRendered('user', 'spinner', {
-      duration
-    }));
-  }, [fireAnalyticsWithDuration]);
+    if (fg('ptc-enable-profile-card-analytics-refactor')) {
+      fireAnalyticsWithDurationNext('ui.profilecard.rendered.spinner', duration => ({
+        firedAt: Math.round(getPageTime()),
+        duration,
+        ...PACKAGE_META_DATA
+      }));
+    } else {
+      fireAnalyticsWithDuration(duration => profileCardRendered('user', 'spinner', {
+        duration
+      }));
+    }
+  }, [fireAnalyticsWithDuration, fireAnalyticsWithDurationNext]);
   return /*#__PURE__*/React.createElement(SpinnerContainer, {
     testId: "profilecard-spinner-container"
   }, /*#__PURE__*/React.createElement(Spinner, null));
 };
-export default withAnalyticsEvents()(ProfilecardInternal);
+export default componentWithFG('ptc-enable-profile-card-analytics-refactor', ProfilecardInternal, withAnalyticsEvents()(ProfilecardInternal));

package/dist/es2019/components/User/ProfileCardDetails.js

@@ -137,6 +137,7 @@ export const ProfileCardDetails = props => {
     reportingLines: props.reportingLines,
     reportingLinesProfileUrl: props.reportingLinesProfileUrl,
     onReportingLinesClick: props.onReportingLinesClick,
-    fireAnalyticsWithDuration: props.fireAnalyticsWithDuration
+    fireAnalyticsWithDuration: props.fireAnalyticsWithDuration,
+    fireAnalyticsWithDurationNext: props.fireAnalyticsWithDurationNext
   }));
 };

package/dist/es2019/components/User/ProfileCardResourced.js

@@ -3,6 +3,8 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React, { Suspense } from 'react';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { GiveKudosLauncherLazy, KudosType } from '@atlaskit/give-kudos';
+import { componentWithFG } from '@atlaskit/platform-feature-flags-react';
+import { useAnalyticsEvents } from '@atlaskit/teams-app-internal-analytics';
 import filterActions from '../../internal/filterActions';
 import { CardWrapper } from '../../styled/UserTrigger';
 import { fireEvent } from '../../util/analytics';
@@ -33,6 +35,15 @@ class ProfileCardResourced extends React.PureComponent {
         fireEvent(this.props.createAnalyticsEvent, payload);
       }
     });
+    _defineProperty(this, "fireAnalyticsNext", (eventKey, ...attributes) => {
+      // Don't fire analytics if the component is unmounted
+      if (!this._isMounted) {
+        return;
+      }
+      if (this.props.fireEvent) {
+        this.props.fireEvent(eventKey, ...attributes);
+      }
+    });
     _defineProperty(this, "clientFetchProfile", () => {
       const {
         cloudId,
@@ -50,7 +61,7 @@ class ProfileCardResourced extends React.PureComponent {
         hasError: false,
         data: null
       }, () => {
-        const requests = Promise.all([this.props.resourceClient.getProfile(cloudId, userId, this.fireAnalytics), this.props.resourceClient.getReportingLines(userId), this.props.resourceClient.shouldShowGiveKudos(), this.props.resourceClient.getTeamCentralBaseUrl({
+        const requests = Promise.all([this.props.resourceClient.getProfile(cloudId, userId, this.fireAnalytics, this.fireAnalyticsNext), this.props.resourceClient.getReportingLines(userId), this.props.resourceClient.shouldShowGiveKudos(), this.props.resourceClient.getTeamCentralBaseUrl({
           withOrgContext: true,
           withSiteContext: true
         })]);
@@ -130,7 +141,8 @@ class ProfileCardResourced extends React.PureComponent {
     const isFetchingOrNotStartToFetchYet = isLoading === true || isLoading === undefined;
     if (isFetchingOrNotStartToFetchYet) {
       return /*#__PURE__*/React.createElement(CardWrapper, null, /*#__PURE__*/React.createElement(UserLoadingState, {
-        fireAnalytics: this.fireAnalytics
+        fireAnalytics: this.fireAnalytics,
+        fireAnalyticsNext: this.fireAnalyticsNext
       }));
     } else if (hasError) {
       return /*#__PURE__*/React.createElement(CardWrapper, {
@@ -138,7 +150,8 @@ class ProfileCardResourced extends React.PureComponent {
       }, /*#__PURE__*/React.createElement(ErrorMessage, {
         errorType: error,
         reload: this.clientFetchProfile,
-        fireAnalytics: this.fireAnalytics
+        fireAnalytics: this.fireAnalytics,
+        fireAnalyticsNext: this.fireAnalyticsNext
       }));
     }
     const newProps = {
@@ -177,4 +190,12 @@ _defineProperty(ProfileCardResourced, "defaultProps", {
   actions: []
 });
 export const ProfileCardResourcedInternal = ProfileCardResourced;
-export default withAnalyticsEvents()(ProfileCardResourced);
+const ProfileCardResourcedWithAnalytics = props => {
+  const {
+    fireEvent
+  } = useAnalyticsEvents();
+  return /*#__PURE__*/React.createElement(ProfileCardResourced, _extends({
+    fireEvent: fireEvent
+  }, props));
+};
+export default componentWithFG('ptc-enable-profile-card-analytics-refactor', ProfileCardResourcedWithAnalytics, withAnalyticsEvents()(ProfileCardResourced));

package/dist/es2019/components/User/ProfileCardTrigger.js

@@ -9,12 +9,14 @@ import { GiveKudosLauncherLazy, KudosType } from '@atlaskit/give-kudos';
 import { fg } from '@atlaskit/platform-feature-flags';
 import Popup from '@atlaskit/popup';
 import { Box } from '@atlaskit/primitives/compiled';
+import { useAnalyticsEvents as useAnalyticsEventsNext } from '@atlaskit/teams-app-internal-analytics';
 import { layers } from '@atlaskit/theme/constants';
 import filterActionsInner from '../../internal/filterActions';
 import getLabelMessage from '../../internal/getLabelMessage';
 import { CardWrapper } from '../../styled/UserTrigger';
-import { cardTriggered, fireEvent } from '../../util/analytics';
+import { cardTriggered, fireEvent, PACKAGE_META_DATA } from '../../util/analytics';
 import { DELAY_MS_HIDE, DELAY_MS_SHOW } from '../../util/config';
+import { getPageTime } from '../../util/performance';
 import { AgentProfileCardResourced } from '../Agent/AgentProfileCardResourced';
 import { ProfileCardLazy } from './lazyProfileCard';
 import UserLoadingState from './UserLoadingState';
@@ -105,6 +107,9 @@ export default function ProfilecardTriggerNext({
   const [kudosDrawerOpen, setKudosDrawerOpen] = useState(false);
   const [isTriggeredUsingKeyboard, setTriggeredUsingKeyboard] = useState(false);
   const triggerRef = useRef(null);
+  const {
+    fireEvent: fireEventNext
+  } = useAnalyticsEventsNext();
   useEffect(() => {
     isMounted.current = true;
     return () => {
@@ -123,6 +128,14 @@ export default function ProfilecardTriggerNext({
     setShouldShowGiveKudos(false);
     setTeamCentralBaseUrl(undefined);
   }, [userId]);
+
+  // Create a wrapper function that has the same interface as fireEventNext but includes isMounted check
+  const fireAnalyticsNext = useCallback((eventKey, ...attributes) => {
+    if (!isMounted.current) {
+      return;
+    }
+    fireEventNext(eventKey, ...attributes);
+  }, [fireEventNext]);
   const fireAnalytics = useCallback(payload => {
     // Don't fire any analytics if the component is unmounted
     if (!isMounted.current) {
@@ -180,7 +193,7 @@ export default function ProfilecardTriggerNext({
     setError(null);
     setData(null);
     try {
-      const requests = Promise.all([resourceClient.getProfile(cloudId || '', userId, fireAnalytics), resourceClient.getReportingLines(userId), resourceClient.shouldShowGiveKudos(), resourceClient.getTeamCentralBaseUrl({
+      const requests = Promise.all([resourceClient.getProfile(cloudId || '', userId, fireAnalytics, fireAnalyticsNext), resourceClient.getReportingLines(userId), resourceClient.shouldShowGiveKudos(), resourceClient.getTeamCentralBaseUrl({
         withOrgContext: true,
         withSiteContext: true
       })]);
@@ -189,7 +202,7 @@ export default function ProfilecardTriggerNext({
     } catch (err) {
       handleClientError(err);
     }
-  }, [cloudId, fireAnalytics, isLoading, resourceClient, userId, handleClientSuccess, handleClientError]);
+  }, [cloudId, fireAnalytics, fireAnalyticsNext, isLoading, resourceClient, userId, handleClientSuccess, handleClientError]);
   const showProfilecard = useCallback(() => {
     clearTimeout(hideTimer.current);
     clearTimeout(showTimer.current);
@@ -208,25 +221,49 @@ export default function ProfilecardTriggerNext({
     event.stopPropagation();
     showProfilecard();
     if (!visible) {
-      fireAnalytics(cardTriggered('user', 'click'));
+      if (fg('ptc-enable-profile-card-analytics-refactor')) {
+        fireAnalyticsNext('ui.profilecard.triggered', {
+          method: 'click',
+          firedAt: Math.round(getPageTime()),
+          ...PACKAGE_META_DATA
+        });
+      } else {
+        fireAnalytics(cardTriggered('user', 'click'));
+      }
     }
-  }, [fireAnalytics, showProfilecard, visible]);
+  }, [fireAnalytics, fireAnalyticsNext, showProfilecard, visible]);
   const onMouseEnter = useCallback(() => {
     showProfilecard();
     if (!visible) {
-      fireAnalytics(cardTriggered('user', 'hover'));
+      if (fg('ptc-enable-profile-card-analytics-refactor')) {
+        fireAnalyticsNext('ui.profilecard.triggered', {
+          method: 'hover',
+          firedAt: Math.round(getPageTime()),
+          ...PACKAGE_META_DATA
+        });
+      } else {
+        fireAnalytics(cardTriggered('user', 'hover'));
+      }
     }
-  }, [fireAnalytics, showProfilecard, visible]);
+  }, [fireAnalytics, fireAnalyticsNext, showProfilecard, visible]);
   const onKeyPress = useCallback(event => {
     if (event.key === 'Enter' || event.key === ' ') {
       event.preventDefault();
       setTriggeredUsingKeyboard(true);
       showProfilecard();
       if (!visible) {
-        fireAnalytics(cardTriggered('user', 'click'));
+        if (fg('ptc-enable-profile-card-analytics-refactor')) {
+          fireAnalyticsNext('ui.profilecard.triggered', {
+            method: 'click',
+            firedAt: Math.round(getPageTime()),
+            ...PACKAGE_META_DATA
+          });
+        } else {
+          fireAnalytics(cardTriggered('user', 'click'));
+        }
       }
     }
-  }, [fireAnalytics, showProfilecard, visible]);
+  }, [fireAnalytics, fireAnalyticsNext, showProfilecard, visible]);
   const onFocus = useCallback(() => {
     showProfilecard();
   }, [showProfilecard]);
@@ -301,7 +338,8 @@ export default function ProfilecardTriggerNext({
       placement: position,
       offset: offset !== null && offset !== void 0 ? offset : [0, 8],
       content: () => /*#__PURE__*/React.createElement("div", wrapperProps, showLoading ? /*#__PURE__*/React.createElement(LoadingView, {
-        fireAnalytics: fireAnalytics
+        fireAnalytics: fireAnalytics,
+        fireAnalyticsNext: fireAnalyticsNext
       }) : visible && /*#__PURE__*/React.createElement(ProfileCardContent, {
         profilecardProps: profilecardProps,
         isAgent: !!(data !== null && data !== void 0 && data.isAgent),
@@ -378,7 +416,8 @@ export default function ProfilecardTriggerNext({
     placement: position,
     offset: offset !== null && offset !== void 0 ? offset : [0, 8],
     content: () => /*#__PURE__*/React.createElement("div", wrapperProps, showLoading ? /*#__PURE__*/React.createElement(LoadingView, {
-      fireAnalytics: fireAnalytics
+      fireAnalytics: fireAnalytics,
+      fireAnalyticsNext: fireAnalyticsNext
     }) : visible && /*#__PURE__*/React.createElement(ProfileCardContent, {
       profilecardProps: profilecardProps,
       isAgent: !!(data !== null && data !== void 0 && data.isAgent),
@@ -447,9 +486,11 @@ export default function ProfilecardTriggerNext({
   })));
 }
 const LoadingView = ({
-  fireAnalytics
+  fireAnalytics,
+  fireAnalyticsNext
 }) => /*#__PURE__*/React.createElement(CardWrapper, {
   testId: "profilecard.profilecardtrigger.loading"
 }, /*#__PURE__*/React.createElement(UserLoadingState, {
-  fireAnalytics: fireAnalytics
+  fireAnalytics: fireAnalytics,
+  fireAnalyticsNext: fireAnalyticsNext
 }));