From 7a5a837fab67939b59b885f1db1978b44c55a1dd Mon Sep 17 00:00:00 2001 From: Martin CAYUELAS <112866305+mcayuelas-ledger@users.noreply.github.com> Date: Mon, 2 Sep 2024 14:02:58 +0200 Subject: [PATCH] [FEAT]: Rework LedgerSync Analytics (#7720) --- .changeset/eighty-bikes-press.md | 5 +++ .../src/analytics/segment.ts | 13 ++++++++ .../useSelectAddAccountMethodViewModel.ts | 2 +- .../WalletSync/components/Error/Simple.tsx | 5 ++- .../ManageInstances/ListInstances.tsx | 3 ++ .../components/ManageKey/ManageKey.tsx | 3 ++ .../WalletSync/components/Success/index.tsx | 5 ++- .../hooks/useLedgerSyncAnalytics.ts | 18 ++++++----- .../WalletSync/hooks/useSpecificError.tsx | 6 ++-- .../screens/Activation/ActivationSuccess.tsx | 14 ++++++++ .../WalletSync/screens/Manage/index.tsx | 8 ++--- .../ManageInstances/DeletionSuccess.tsx | 7 ++++ .../ManageInstances/ManageInstancesDrawer.tsx | 10 ++---- .../useManageInstanceDrawer.ts | 13 +++++++- .../screens/ManageKey/DeletionSuccess.tsx | 2 ++ .../screens/ManageKey/ManageKeyDrawer.tsx | 13 +++----- .../screens/ManageKey/useManageKeyDrawer.ts | 32 +++++++++++++++++-- .../screens/Synchronize/QrCodeMethod.tsx | 7 ++-- .../screens/Synchronize/SyncError.tsx | 14 +++++++- 19 files changed, 139 insertions(+), 41 deletions(-) create mode 100644 .changeset/eighty-bikes-press.md diff --git a/.changeset/eighty-bikes-press.md b/.changeset/eighty-bikes-press.md new file mode 100644 index 000000000000..4f81c8a47416 --- /dev/null +++ b/.changeset/eighty-bikes-press.md @@ -0,0 +1,5 @@ +--- +"live-mobile": patch +--- + +Rework LedgerSync Analytics diff --git a/apps/ledger-live-mobile/src/analytics/segment.ts b/apps/ledger-live-mobile/src/analytics/segment.ts index 1a049425acc7..bf70f149af19 100644 --- a/apps/ledger-live-mobile/src/analytics/segment.ts +++ b/apps/ledger-live-mobile/src/analytics/segment.ts @@ -97,6 +97,16 @@ runOnceWhen(() => !!analyticsFeatureFlagMethod && !!segmentClient, getFeatureFla export const updateSessionId = () => (sessionId = uuid()); +const getLedgerSyncAttributes = (state: State) => { + if (!analyticsFeatureFlagMethod) return false; + const ledgerSync = analyticsFeatureFlagMethod("llmWalletSync"); + + return { + hasLedgerSync: !!ledgerSync?.enabled, + ledgerSyncActivated: !!state.trustchain.trustchain?.rootId, + }; +}; + const getMandatoryProperties = async (store: AppStore) => { const state: State = store.getState(); const { user } = await getOrCreateUser(); @@ -175,6 +185,8 @@ const extraProperties = async (store: AppStore) => { const stakingProvidersCount = stakingProviders?.enabled && stakingProviders?.params?.listProvider.length; + const ledgerSyncAtributes = getLedgerSyncAttributes(state); + return { ...mandatoryProperties, appVersion, @@ -209,6 +221,7 @@ const extraProperties = async (store: AppStore) => { staxLockscreen: customImageType || "none", nps, stakingProvidersEnabled: stakingProvidersCount || "flag not loaded", + ...ledgerSyncAtributes, }; }; diff --git a/apps/ledger-live-mobile/src/newArch/features/Accounts/screens/AddAccount/components/SelectAddAccountMethod/useSelectAddAccountMethodViewModel.ts b/apps/ledger-live-mobile/src/newArch/features/Accounts/screens/AddAccount/components/SelectAddAccountMethod/useSelectAddAccountMethodViewModel.ts index 3c44bf7bf992..b2f865ae99a3 100644 --- a/apps/ledger-live-mobile/src/newArch/features/Accounts/screens/AddAccount/components/SelectAddAccountMethod/useSelectAddAccountMethodViewModel.ts +++ b/apps/ledger-live-mobile/src/newArch/features/Accounts/screens/AddAccount/components/SelectAddAccountMethod/useSelectAddAccountMethodViewModel.ts @@ -37,7 +37,7 @@ const useSelectAddAccountMethodViewModel = ({ currency, onClose }: AddAccountScr }, []); const onClickImport = useCallback(() => { - trackButtonClick("Import from Desktop"); + trackButtonClick("Import via another Ledger Live app"); onClose?.(); navigation.navigate(NavigatorName.ImportAccounts); }, [navigation, trackButtonClick, onClose]); diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/Error/Simple.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/Error/Simple.tsx index aba928734e22..44088110ed7e 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/Error/Simple.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/Error/Simple.tsx @@ -1,6 +1,7 @@ import { Box, Button, Flex, Icons, Text } from "@ledgerhq/native-ui"; import React from "react"; import styled, { useTheme } from "styled-components/native"; +import { TrackScreen } from "~/analytics"; type Props = { title: string; desc?: string; @@ -9,12 +10,14 @@ type Props = { onPress: () => void; outline: boolean; }; + analyticsPage: string; }; -export function ErrorComponent({ title, desc, mainButton }: Props) { +export function ErrorComponent({ title, desc, mainButton, analyticsPage }: Props) { const { colors } = useTheme(); return ( + diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/ManageInstances/ListInstances.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/ManageInstances/ListInstances.tsx index a847b7257442..09773db612a9 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/ManageInstances/ListInstances.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/ManageInstances/ListInstances.tsx @@ -6,6 +6,8 @@ import { useTranslation } from "react-i18next"; import { TrustchainMember } from "@ledgerhq/trustchain/types"; import { TinyCard } from "../TinyCard"; import { Scene } from "../../screens/ManageInstances/useManageInstanceDrawer"; +import { TrackScreen } from "~/analytics"; +import { AnalyticsPage } from "../../hooks/useLedgerSyncAnalytics"; type Props = { onClickInstance: (member: TrustchainMember) => void; @@ -41,6 +43,7 @@ export function ListInstances({ onClickInstance, changeScene, members, currentIn return ( + {t("walletSync.walletSyncActivated.manageInstances.title")} diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/ManageKey/ManageKey.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/ManageKey/ManageKey.tsx index 258f7b103020..81d100cc365e 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/ManageKey/ManageKey.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/ManageKey/ManageKey.tsx @@ -4,6 +4,8 @@ import { Flex, Icons, rgba, Text } from "@ledgerhq/native-ui"; import { TouchableOpacity } from "react-native"; import styled, { useTheme } from "styled-components/native"; import { useTranslation } from "react-i18next"; +import { TrackScreen } from "~/analytics"; +import { AnalyticsPage } from "../../hooks/useLedgerSyncAnalytics"; type Props = { onClickDelete: () => void; @@ -14,6 +16,7 @@ export function ManageKey({ onClickDelete }: Props) { const { colors } = useTheme(); return ( + {t("walletSync.walletSyncActivated.manageKey.drawer.step1.title")} diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/Success/index.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/Success/index.tsx index 90e68185ee17..2225178ade55 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/Success/index.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/Success/index.tsx @@ -1,6 +1,7 @@ import { Box, Button, Flex, Icons, Text } from "@ledgerhq/native-ui"; import React from "react"; import styled, { useTheme } from "styled-components/native"; +import { TrackScreen } from "~/analytics"; import SafeAreaView from "~/components/SafeAreaView"; type Props = { title: string; @@ -14,12 +15,14 @@ type Props = { label: string; onPress: () => void; }; + analyticsPage: string; }; -export function Success({ title, desc, mainButton, secondaryButton }: Props) { +export function Success({ title, desc, mainButton, secondaryButton, analyticsPage }: Props) { const { colors } = useTheme(); return ( + diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/hooks/useLedgerSyncAnalytics.ts b/apps/ledger-live-mobile/src/newArch/features/WalletSync/hooks/useLedgerSyncAnalytics.ts index 368654a35246..8e2801d5f272 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/hooks/useLedgerSyncAnalytics.ts +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/hooks/useLedgerSyncAnalytics.ts @@ -4,6 +4,7 @@ export enum AnalyticsPage { ActivateLedgerSync = "Activate Ledger Sync", ChooseSyncMethod = "Choose sync method", BackupCreationSuccess = "Backup creation success", + SyncSuccess = "Sync success", ScanQRCode = "Scan QR code", ShowQRCode = "Show QR code", SyncWithQrCode = "Sync with QR code", @@ -14,14 +15,15 @@ export enum AnalyticsPage { LedgerSyncSettings = "Ledger Sync Settings", ManageSyncInstances = "Manage synchronized instances", RemoveInstanceWrongDevice = "Remove instance wrong device connected", - ManageBackup = "Manage backup", + RemoveInstanceSuccess = "Instance removal success", + ManageBackup = "Manage key", ConfirmDeleteBackup = "Confirm delete backup", + DeleteBackupSuccess = "Delete key success", SyncWithNoKey = "Sync with no key", LedgerSyncActivated = "Ledger Sync activated", - AutoRemove = "Remove current instance", - Unbacked = "Unbacked", - OtherSeed = "Other seed", - SameSeed = "Same seed", + AutoRemove = "Can’t remove current instance", + OtherSeed = "You can’t use this Ledger to Sync", + SameSeed = "App already secured with this Ledger", ScanAttemptWithSameBackup = "Scan attempt with same backup", ScanAttemptWithDifferentBackups = "Scan attempt with different backups", } @@ -32,7 +34,7 @@ export enum AnalyticsFlow { export enum AnalyticsButton { SyncYourAccounts = "Sync your accounts", - AlreadyCreatedKey = "Already created key", + AlreadyCreatedKey = "Already synced a Ledger Live app", Close = "Close", UseYourLedger = "Use your Ledger", ScanQRCode = "Scan a QR code", @@ -41,7 +43,7 @@ export enum AnalyticsButton { TryAgain = "Try again", Synchronize = "Synchronize", ManageKey = "Manage key", - ManageSynchronizations = "Manage Synchronizations", + ManageInstances = "Manage instances", RemoveInstance = "Remove instance", ConnectAnotherLedger = "Connect another Ledger", DeleteKey = "Delete key", @@ -49,7 +51,7 @@ export enum AnalyticsButton { Cancel = "Cancel", CreateYourKey = "Create your key", LedgerSync = "Ledger Sync", - UseAnother = "Connect new ledger", + UseAnother = "Connect another ledger", Understand = "I understand", } diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/hooks/useSpecificError.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/hooks/useSpecificError.tsx index 1718a7994d44..5dc711373be2 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/hooks/useSpecificError.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/hooks/useSpecificError.tsx @@ -153,7 +153,6 @@ export function useSpecificError({ primaryAction, secondaryAction }: SpecificPro cta: t("walletSync.synchronize.qrCode.backedWithDifferentSeeds.cta"), analyticsPage: AnalyticsPage.ScanAttemptWithDifferentBackups, buttonType: "main" as ButtonProps["type"], - primaryAction: () => { primaryAction(); onGoToDelete(AnalyticsPage.ScanAttemptWithDifferentBackups); @@ -164,12 +163,11 @@ export function useSpecificError({ primaryAction, secondaryAction }: SpecificPro title: t("walletSync.synchronize.qrCode.unbacked.title"), description: t("walletSync.synchronize.qrCode.unbacked.description"), cta: t("walletSync.synchronize.qrCode.unbacked.cta"), - analyticsPage: AnalyticsPage.Unbacked, + analyticsPage: AnalyticsPage.SyncWithNoKey, buttonType: "main" as ButtonProps["type"], - primaryAction: () => { primaryAction(); - onCreate(AnalyticsPage.Unbacked); + onCreate(AnalyticsPage.SyncWithNoKey); }, }, }; diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Activation/ActivationSuccess.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Activation/ActivationSuccess.tsx index 2864478d1766..b96142165867 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Activation/ActivationSuccess.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Activation/ActivationSuccess.tsx @@ -15,6 +15,8 @@ import { isFromLedgerSyncOnboardingSelector } from "~/reducers/settings"; import { useNavigation } from "@react-navigation/native"; import { BaseNavigatorStackParamList } from "~/components/RootNavigator/types/BaseNavigator"; import { setFromLedgerSyncOnboarding } from "~/actions/settings"; +import { AnalyticsButton, AnalyticsFlow, AnalyticsPage } from "../../hooks/useLedgerSyncAnalytics"; +import { track } from "~/analytics"; type Props = BaseComposite< StackNavigatorProps @@ -26,16 +28,27 @@ export function ActivationSuccess({ navigation, route }: Props) { const { created } = route.params; const title = created ? "walletSync.success.activation" : "walletSync.success.sync"; const desc = created ? "walletSync.success.activationDesc" : "walletSync.success.syncDesc"; + const page = created ? AnalyticsPage.BackupCreationSuccess : AnalyticsPage.SyncSuccess; const dispatch = useDispatch(); const navigationOnbarding = useNavigation>>(); function syncAnother(): void { + track("button_clicked", { + button: AnalyticsButton.SyncWithAnotherLedgerLive, + page, + flow: AnalyticsFlow.LedgerSync, + }); navigation.navigate(ScreenName.WalletSyncActivationProcess); } function close(): void { + track("button_clicked", { + button: AnalyticsButton.Close, + page, + flow: AnalyticsFlow.LedgerSync, + }); if (isFromLedgerSyncOnboarding) { dispatch(setFromLedgerSyncOnboarding(false)); navigationOnbarding.navigate(NavigatorName.Base, { @@ -60,6 +73,7 @@ export function ActivationSuccess({ navigation, route }: Props) { label: t("walletSync.success.close"), onPress: close, }} + analyticsPage={page} /> ); } diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Manage/index.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Manage/index.tsx index d31908e1abb0..a3216aed97e3 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Manage/index.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Manage/index.tsx @@ -37,21 +37,21 @@ const WalletSyncManage = () => { const goToSync = () => { setIsSyncDrawerOpen(true); - onClickTrack({ button: AnalyticsButton.Synchronize, page: AnalyticsPage.LedgerSyncActivated }); + onClickTrack({ button: AnalyticsButton.Synchronize, page: AnalyticsPage.LedgerSyncSettings }); }; const closeSyncDrawer = () => setIsSyncDrawerOpen(false); const goToManageBackup = () => { manageKeyHook.openDrawer(); - onClickTrack({ button: AnalyticsButton.ManageKey, page: AnalyticsPage.LedgerSyncActivated }); + onClickTrack({ button: AnalyticsButton.ManageKey, page: AnalyticsPage.LedgerSyncSettings }); }; const goToManageInstances = () => { manageInstancesHook.openDrawer(); onClickTrack({ - button: AnalyticsButton.ManageSynchronizations, - page: AnalyticsPage.LedgerSyncActivated, + button: AnalyticsButton.ManageInstances, + page: AnalyticsPage.LedgerSyncSettings, }); }; diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/DeletionSuccess.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/DeletionSuccess.tsx index 65c918cc22ad..24c7b1ff217f 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/DeletionSuccess.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/DeletionSuccess.tsx @@ -5,6 +5,8 @@ import { BaseComposite, StackNavigatorProps } from "~/components/RootNavigator/t import { WalletSyncNavigatorStackParamList } from "~/components/RootNavigator/types/WalletSyncNavigator"; import { NavigatorName, ScreenName } from "~/const"; +import { AnalyticsButton, AnalyticsPage } from "../../hooks/useLedgerSyncAnalytics"; +import { track } from "~/analytics"; type Props = BaseComposite< StackNavigatorProps< @@ -17,6 +19,10 @@ export function WalletSyncManageInstanceDeletionSuccess({ navigation, route }: P const { t } = useTranslation(); const member = route.params?.member.name; function close(): void { + track("button_clicked", { + button: AnalyticsButton.Close, + page: AnalyticsPage.RemoveInstanceSuccess, + }); navigation.navigate(NavigatorName.Settings, { screen: ScreenName.GeneralSettings, }); @@ -31,6 +37,7 @@ export function WalletSyncManageInstanceDeletionSuccess({ navigation, route }: P label: t("walletSync.success.close"), onPress: close, }} + analyticsPage={AnalyticsPage.RemoveInstanceSuccess} /> ); } diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/ManageInstancesDrawer.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/ManageInstancesDrawer.tsx index 767b6f4465bd..952a6efa15e8 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/ManageInstancesDrawer.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/ManageInstancesDrawer.tsx @@ -1,6 +1,5 @@ import React, { useCallback } from "react"; import QueuedDrawer from "LLM/components/QueuedDrawer"; -import { TrackScreen } from "~/analytics"; import GenericErrorView from "~/components/GenericErrorView"; import { Flex, InfiniteLoader } from "@ledgerhq/native-ui"; @@ -63,12 +62,9 @@ const ManageInstancesDrawer = ({ }; return ( - <> - - - {getScene()} - - + + {getScene()} + ); }; diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/useManageInstanceDrawer.ts b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/useManageInstanceDrawer.ts index 538b5e11c9b6..90219aa39acc 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/useManageInstanceDrawer.ts +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageInstances/useManageInstanceDrawer.ts @@ -9,6 +9,8 @@ import { useNavigation } from "@react-navigation/native"; import { StackNavigatorNavigation } from "~/components/RootNavigator/types/helpers"; import { WalletSyncNavigatorStackParamList } from "~/components/RootNavigator/types/WalletSyncNavigator"; import { ScreenName } from "~/const"; +import { track } from "~/analytics"; +import { AnalyticsButton, AnalyticsPage } from "../../hooks/useLedgerSyncAnalytics"; const messageLog = "Follow Steps on device"; @@ -49,9 +51,18 @@ export const useManageInstancesDrawer = (): HookResult => { const closeDrawer = useCallback(() => { setIsDrawerInstructionsVisible(false); logDrawer(messageLog, "close"); - }, []); + + track("button_clicked", { + button: AnalyticsButton.Close, + page: scene === Scene.List ? AnalyticsPage.ManageSyncInstances : AnalyticsPage.AutoRemove, + }); + }, [scene]); const onClickInstance = (instance: TrustchainMember) => { + track("button_clicked", { + button: AnalyticsButton.RemoveInstance, + page: AnalyticsPage.ManageSyncInstances, + }); navigation.navigate(ScreenName.WalletSyncManageInstancesProcess, { member: instance, }); diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/DeletionSuccess.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/DeletionSuccess.tsx index 2e6c36c955b7..a7a8d8cfce44 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/DeletionSuccess.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/DeletionSuccess.tsx @@ -5,6 +5,7 @@ import { BaseComposite, StackNavigatorProps } from "~/components/RootNavigator/t import { WalletSyncNavigatorStackParamList } from "~/components/RootNavigator/types/WalletSyncNavigator"; import { NavigatorName, ScreenName } from "~/const"; +import { AnalyticsPage } from "../../hooks/useLedgerSyncAnalytics"; type Props = BaseComposite< StackNavigatorProps< @@ -29,6 +30,7 @@ export function WalletSyncManageKeyDeletionSuccess({ navigation }: Props) { label: t("walletSync.success.close"), onPress: close, }} + analyticsPage={AnalyticsPage.DeleteBackupSuccess} /> ); } diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/ManageKeyDrawer.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/ManageKeyDrawer.tsx index 582d5181289f..295f235086f4 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/ManageKeyDrawer.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/ManageKeyDrawer.tsx @@ -1,6 +1,5 @@ import React from "react"; import QueuedDrawer from "LLM/components/QueuedDrawer"; -import { TrackScreen } from "~/analytics"; import GenericErrorView from "~/components/GenericErrorView"; import { Flex, InfiniteLoader } from "@ledgerhq/native-ui"; @@ -16,6 +15,7 @@ const ManageKeyDrawer = ({ scene, onClickDelete, onClickConfirm, + handleCancel, }: HookResult) => { const getScene = () => { if (deleteMutation.error) { @@ -40,17 +40,14 @@ const ManageKeyDrawer = ({ return ; } if (scene === Scene.Confirm) { - return ; + return ; } }; return ( - <> - - - {getScene()} - - + + {getScene()} + ); }; diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/useManageKeyDrawer.ts b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/useManageKeyDrawer.ts index 98c98c6cf238..a82e22a20424 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/useManageKeyDrawer.ts +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/ManageKey/useManageKeyDrawer.ts @@ -9,6 +9,8 @@ import { UseMutationResult } from "@tanstack/react-query"; import { useDispatch, useSelector } from "react-redux"; import { setWallectSyncManageKeyDrawer } from "~/actions/walletSync"; import { manageKeyDrawerSelector } from "~/reducers/walletSync"; +import { track } from "~/analytics"; +import { AnalyticsButton, AnalyticsPage } from "../../hooks/useLedgerSyncAnalytics"; const messageLog = "Follow Steps on device"; @@ -26,6 +28,7 @@ export type HookResult = { scene: Scene; onClickConfirm: () => Promise; deleteMutation: UseMutationResult; + handleCancel: () => void; }; export const useManageKeyDrawer = () => { @@ -37,7 +40,13 @@ export const useManageKeyDrawer = () => { const [scene, setScene] = useState(Scene.Manage); - const onClickDelete = () => setScene(Scene.Confirm); + const onClickDelete = () => { + track("button_clicked", { + button: AnalyticsButton.DeleteKey, + page: AnalyticsPage.ManageBackup, + }); + setScene(Scene.Confirm); + }; const openDrawer = useCallback(() => { dispatch(setWallectSyncManageKeyDrawer(true)); @@ -46,6 +55,7 @@ export const useManageKeyDrawer = () => { }, [dispatch]); const closeDrawer = useCallback(() => { + setScene(Scene.Manage); dispatch(setWallectSyncManageKeyDrawer(false)); logDrawer(messageLog, "close"); }, [dispatch]); @@ -54,10 +64,27 @@ export const useManageKeyDrawer = () => { const handleClose = () => { closeDrawer(); - setScene(Scene.Manage); + + track("button_clicked", { + button: AnalyticsButton.Close, + page: AnalyticsPage.ManageBackup, + }); + }; + + const handleCancel = () => { + closeDrawer(); + track("button_clicked", { + button: AnalyticsButton.Cancel, + page: AnalyticsPage.ConfirmDeleteBackup, + }); }; const onClickConfirm = async () => { + track("button_clicked", { + button: AnalyticsButton.Delete, + page: AnalyticsPage.ConfirmDeleteBackup, + }); + await deleteMutation.mutateAsync(); closeDrawer(); navigation.navigate(ScreenName.WalletSyncManageKeyDeleteSuccess); @@ -72,5 +99,6 @@ export const useManageKeyDrawer = () => { scene, onClickConfirm, deleteMutation, + handleCancel, }; }; diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Synchronize/QrCodeMethod.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Synchronize/QrCodeMethod.tsx index 03b083db11b3..0681e0498738 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Synchronize/QrCodeMethod.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Synchronize/QrCodeMethod.tsx @@ -31,9 +31,10 @@ const QrCodeMethod = ({ setSelectedOption(option); const button = option === Options.SCAN ? AnalyticsButton.ScanQRCode : AnalyticsButton.ShowQRCode; + const page = option === Options.SCAN ? AnalyticsPage.ScanQRCode : AnalyticsPage.ShowQRCode; onClickTrack({ button, - page: AnalyticsPage.ScanQRCode, + page, }); }; @@ -42,14 +43,14 @@ const QrCodeMethod = ({ case Options.SCAN: return ( <> - + ); case Options.SHOW_QR: return ( <> - + ); diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Synchronize/SyncError.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Synchronize/SyncError.tsx index 46efd300cce6..1d1946c0bf00 100644 --- a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Synchronize/SyncError.tsx +++ b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Synchronize/SyncError.tsx @@ -1,6 +1,8 @@ import React from "react"; import { useTranslation } from "react-i18next"; import { ErrorComponent } from "../../components/Error/Simple"; +import { AnalyticsButton, AnalyticsPage } from "../../hooks/useLedgerSyncAnalytics"; +import { track } from "~/analytics"; interface Props { tryAgain: () => void; @@ -8,15 +10,25 @@ interface Props { export default function SyncError({ tryAgain }: Props) { const { t } = useTranslation(); + + const onTryAgain = () => { + tryAgain(); + track("button_clicked", { + button: AnalyticsButton.TryAgain, + page: AnalyticsPage.PinCodesDoNotMatch, + }); + }; + return ( ); }