[SIW-1953] Mixpanel tracking of new ITWallet feature

ts/features/itwallet/analytics/enum.ts

@@ -46,7 +46,8 @@ export enum ITW_ACTIONS_EVENTS {
   ITW_START_DEACTIVATION = "ITW_START_DEACTIVATION",
   ITW_NEW_ID_RESET = "ITW_NEW_ID_RESET",
   ITW_CREDENTIAL_RENEW_START = "ITW_CREDENTIAL_RENEW_START",
-  ITW_ISSUANCE_CREDENTIAL_SCROLL = "ITW_ISSUANCE_CREDENTIAL_SCROLL"
+  ITW_ISSUANCE_CREDENTIAL_SCROLL = "ITW_ISSUANCE_CREDENTIAL_SCROLL",
+  ITW_CREDENTIAL_CARD_MODAL = "ITW_CREDENTIAL_CARD_MODAL"
 }
 
 export enum ITW_ERRORS_EVENTS {
@@ -68,7 +69,10 @@ export enum ITW_ERRORS_EVENTS {
   ITW_LOGIN_ID_NOT_MATCH = "ITW_LOGIN_ID_NOT_MATCH",
   ITW_ALREADY_HAS_CREDENTIAL = "ITW_ALREADY_HAS_CREDENTIAL",
   ITW_ADD_CREDENTIAL_INVALID_STATUS = "ITW_ADD_CREDENTIAL_INVALID_STATUS",
-  ITW_ALREADY_ACTIVATED = "ITW_ALREADY_ACTIVATED"
+  ITW_ALREADY_ACTIVATED = "ITW_ALREADY_ACTIVATED",
+  ITW_STATUS_WALLET_ATTESTATION_FAILURE = "ITW_STATUS_WALLET_ATTESTATION_FAILURE",
+  ITW_STATUS_CREDENTIAL_ATTESTATION_FAILURE = "ITW_STATUS_CREDENTIAL_ATTESTATION_FAILURE",
+  ITW_TRUSTMARK_RENEW_FAILURE = "ITW_TRUSTMARK_RENEW_FAILURE"
 }
 
 export enum ITW_EXIT_EVENTS {

ts/features/itwallet/analytics/index.ts

@@ -493,6 +493,16 @@ export function trackIssuanceCredentialScrollToBottom(
   );
 }
 
+export function trackCredentialCardModal(credential: MixPanelCredential) {
+  void mixpanelTrack(
+    ITW_ACTIONS_EVENTS.ITW_CREDENTIAL_CARD_MODAL,
+    buildEventProperties("UX", "action", {
+      credential,
+      credential_status: "valid"
+    })
+  );
+}
+
 // #endregion ACTIONS
 
 // #region ERRORS
@@ -651,6 +661,31 @@ export const trackItwAlreadyActivated = () => {
   );
 };
 
+export const trackItwStatusWalletAttestationFailure = () => {
+  void mixpanelTrack(
+    ITW_ERRORS_EVENTS.ITW_STATUS_WALLET_ATTESTATION_FAILURE,
+    buildEventProperties("KO", "error")
+  );
+};
+
+export const trackItwStatusCredentialAttestationFailure = (
+  credential: MixPanelCredential
+) => {
+  void mixpanelTrack(
+    ITW_ERRORS_EVENTS.ITW_STATUS_CREDENTIAL_ATTESTATION_FAILURE,
+    buildEventProperties("KO", "error", { credential })
+  );
+};
+
+export const trackItwTrustmarkRenewFailure = (
+  credential: MixPanelCredential
+) => {
+  void mixpanelTrack(
+    ITW_ERRORS_EVENTS.ITW_TRUSTMARK_RENEW_FAILURE,
+    buildEventProperties("KO", "error", { credential })
+  );
+};
+
 // #endregion ERRORS
 
 // #region PROFILE PROPERTIES

ts/features/itwallet/credentials/saga/checkCredentialsStatusAttestation.ts

@@ -16,6 +16,10 @@ import { itwCredentialsStore } from "../store/actions";
 import { updateMixpanelProfileProperties } from "../../../../mixpanelConfig/profileProperties";
 import { updateMixpanelSuperProperties } from "../../../../mixpanelConfig/superProperties";
 import { GlobalState } from "../../../../store/reducers/types";
+import {
+  CREDENTIALS_MAP,
+  trackItwStatusCredentialAttestationFailure
+} from "../../analytics";
 
 const { isIssuerResponseError, IssuerResponseErrorCodes: Codes } = Errors;
 
@@ -37,6 +41,10 @@ export function* updateCredentialStatusAttestationSaga(
     };
   } catch (e) {
     if (isIssuerResponseError(e, Codes.CredentialInvalidStatus)) {
+      trackItwStatusCredentialAttestationFailure(
+        CREDENTIALS_MAP[credential.credentialType]
+      );
+
       return {
         ...credential,
         storedStatusAttestation: {

ts/features/itwallet/lifecycle/saga/checkWalletInstanceStateSaga.ts

@@ -10,6 +10,7 @@ import { itwUpdateWalletInstanceStatus } from "../../walletInstance/store/action
 import { itwLifecycleIsOperationalOrValid } from "../store/selectors";
 import { itwIntegritySetServiceIsReady } from "../../issuance/store/actions";
 import { getNetworkError } from "../../../../utils/errors";
+import { trackItwStatusWalletAttestationFailure } from "../../analytics";
 import { handleWalletInstanceResetSaga } from "./handleWalletInstanceResetSaga";
 
 export function* getStatusOrResetWalletInstance(integrityKeyTag: string) {
@@ -25,6 +26,7 @@ export function* getStatusOrResetWalletInstance(integrityKeyTag: string) {
 
     if (walletInstanceStatus.is_revoked) {
       yield* call(handleWalletInstanceResetSaga);
+      trackItwStatusWalletAttestationFailure();
     }
 
     // Update wallet instance status

ts/features/itwallet/presentation/components/ItwPresentationDetailsFooter.tsx

@@ -20,10 +20,18 @@ import {
 import { itwIsIPatenteCtaEnabledSelector } from "../../common/store/selectors/remoteConfig";
 import { StoredCredential } from "../../common/utils/itwTypesUtils";
 import { itwCredentialsRemove } from "../../credentials/store/actions";
+import { trackAuthenticationStart } from "../../../fims/common/analytics";
+import { ServiceId } from "../../../../../definitions/backend/ServiceId";
 
 type ItwPresentationDetailFooterProps = {
   credential: StoredCredential;
 };
+// Consts for trackAuthenticationStart function
+const serviceId = "01JEXVQSRV2XRX9XDWQ5XQ6A8T" as ServiceId;
+const serviceOrganizationName =
+  "Ministero delle infrastrutture e dei trasporti";
+const serviceOrganizationFiscalCode = "97532760580";
+const serviceName = "Motorizzazione Civile - Le mie patenti";
 
 const ItwPresentationDetailsFooter = ({
   credential
@@ -148,6 +156,14 @@ const IPatenteListItemAction = () => {
       icon="externalLink"
       label={label}
       onPress={() => {
+        trackAuthenticationStart(
+          serviceId,
+          serviceName,
+          serviceOrganizationName,
+          serviceOrganizationFiscalCode,
+          label,
+          "message_detail"
+        );
         NavigationService.navigate(FIMS_ROUTES.MAIN, {
           screen: FIMS_ROUTES.CONSENTS,
           params: {

ts/features/itwallet/presentation/screens/ItwPresentationCredentialCardModal.tsx

@@ -4,9 +4,10 @@ import {
   useIOTheme,
   VSpacer
 } from "@pagopa/io-app-design-system";
-import React from "react";
+import React, { useCallback } from "react";
 import { StyleSheet, View } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
+import { useFocusEffect } from "@react-navigation/native";
 import I18n from "../../../../i18n";
 import { IOStackNavigationRouteProps } from "../../../../navigation/params/AppParamsList";
 import { useMaxBrightness } from "../../../../utils/brightness";
@@ -21,6 +22,7 @@ import {
 } from "../../common/utils/itwTypesUtils";
 import { ItwParamsList } from "../../navigation/ItwParamsList";
 import { ItwPresentationCredentialCardFlipButton } from "../components/ItwPresentationCredentialCardFlipButton";
+import { CREDENTIALS_MAP, trackCredentialCardModal } from "../../analytics";
 
 export type ItwPresentationCredentialCardModalNavigationParams = {
   credential: StoredCredential;
@@ -43,6 +45,12 @@ const ItwPresentationCredentialCardModal = ({ route, navigation }: Props) => {
 
   useMaxBrightness({ useSmoothTransition: true });
 
+  useFocusEffect(
+    useCallback(() => {
+      trackCredentialCardModal(CREDENTIALS_MAP[credential.credentialType]);
+    }, [credential.credentialType])
+  );
+
   React.useLayoutEffect(() => {
     navigation.setOptions({
       header: () => (

ts/features/itwallet/presentation/screens/ItwPresentationCredentialFiscalCodeModal.tsx

@@ -7,10 +7,11 @@ import {
   BodySmall,
   useIOTheme
 } from "@pagopa/io-app-design-system";
-import React from "react";
+import React, { useCallback } from "react";
 import { Dimensions, StyleSheet, View } from "react-native";
 import Barcode from "react-native-barcode-builder";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
+import { useFocusEffect } from "@react-navigation/native";
 import I18n from "../../../../i18n";
 import { useIONavigation } from "../../../../navigation/params/AppParamsList";
 import { useIOSelector } from "../../../../store/hooks";
@@ -19,6 +20,7 @@ import {
   selectFiscalCodeFromEid,
   selectNameSurnameFromEid
 } from "../../credentials/store/selectors";
+import { trackCredentialCardModal } from "../../analytics";
 
 /**
  * This magic number is the lenght of the encoded fiscal code in a CODE39 barcode.
@@ -74,6 +76,12 @@ const ItwPresentationCredentialFiscalCodeModal = () => {
 
   useMaxBrightness({ useSmoothTransition: true });
 
+  useFocusEffect(
+    useCallback(() => {
+      trackCredentialCardModal("ITW_TS_V2");
+    }, [])
+  );
+
   React.useLayoutEffect(() => {
     navigation.setOptions({
       header: () => (

ts/features/itwallet/trustmark/machine/machine.ts

@@ -1,6 +1,10 @@
 import { addSeconds, differenceInSeconds, isPast } from "date-fns";
 import { assign, fromPromise, not, setup } from "xstate";
 import { ItwTags } from "../../machine/tags";
+import {
+  CREDENTIALS_MAP,
+  trackItwTrustmarkRenewFailure
+} from "../../analytics";
 import {
   GetCredentialTrustmarkUrlActorInput,
   GetCredentialTrustmarkUrlActorOutput,
@@ -53,7 +57,11 @@ export const itwTrustmarkMachine = setup({
       nextAttemptAt: undefined
     }),
     setFailure: assign({
-      failure: ({ event }) => mapEventToFailure(event)
+      failure: ({ event, context }) => {
+        const failure = mapEventToFailure(event);
+        trackItwTrustmarkRenewFailure(CREDENTIALS_MAP[context.credentialType]);
+        return failure;
+      }
     }),
     showRetryFailureToast: notImplemented
   },