From e1f5b99abbade445f9b96cf5d4a115f64dc96ab6 Mon Sep 17 00:00:00 2001 From: fAnselmi-Ledger Date: Fri, 7 Feb 2025 14:21:27 +0100 Subject: [PATCH] chore(lld): swapped string to enum for tracking locations --- .changeset/wise-frogs-kiss.md | 2 +- .../hooks/useTrackAddAccountModal.test.ts | 20 +++++++++---------- .../hooks/useTrackAddAccountModal.ts | 6 +++--- .../useTrackManagerSectionEvents.test.ts | 14 ++++++------- .../hooks/useTrackManagerSectionEvents.ts | 6 +++--- .../hooks/useTrackReceiveFlow.test.ts | 3 ++- .../analytics/hooks/useTrackReceiveFlow.ts | 5 +++-- .../src/renderer/analytics/hooks/variables.ts | 3 +++ .../src/renderer/components/Stepper/index.tsx | 3 ++- .../AddAccounts/steps/StepConnectDevice.tsx | 3 ++- .../src/renderer/modals/Receive/index.tsx | 3 ++- .../Receive/steps/StepConnectDevice.tsx | 3 ++- .../EditDeviceName.tsx | 3 ++- .../RemoveCustomImage.tsx | 3 ++- .../src/renderer/screens/manager/index.tsx | 3 ++- 15 files changed, 46 insertions(+), 34 deletions(-) diff --git a/.changeset/wise-frogs-kiss.md b/.changeset/wise-frogs-kiss.md index 2808ad25b02c..3fbed4ec258e 100644 --- a/.changeset/wise-frogs-kiss.md +++ b/.changeset/wise-frogs-kiss.md @@ -2,4 +2,4 @@ "ledger-live-desktop": minor --- -Add Tracking in the ledger sync flow +Add Tracking in the ledger sync flow and polish tracking implementation diff --git a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackAddAccountModal.test.ts b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackAddAccountModal.test.ts index d189e38b52ea..55817652be00 100644 --- a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackAddAccountModal.test.ts +++ b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackAddAccountModal.test.ts @@ -3,7 +3,7 @@ import { UseTrackAddAccountModal, useTrackAddAccountModal } from "./useTrackAddA import { track } from "../segment"; import { CantOpenDevice, UserRefusedOnDevice, LockedDeviceError } from "@ledgerhq/errors"; import type { Device } from "@ledgerhq/types-devices"; -import { CONNECTION_TYPES } from "./variables"; +import { CONNECTION_TYPES, HOOKS_TRACKING_LOCATIONS } from "./variables"; jest.mock("../segment", () => ({ track: jest.fn(), @@ -16,7 +16,7 @@ describe("useTrackAddAccountModal", () => { }; const defaultArgs: UseTrackAddAccountModal = { - location: "Add account modal", + location: HOOKS_TRACKING_LOCATIONS.addAccountModal, requestOpenApp: "Bitcoin", device: deviceMock, error: null, @@ -43,7 +43,7 @@ describe("useTrackAddAccountModal", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.BLE, platform: "LLD", - page: "Add account modal", + page: HOOKS_TRACKING_LOCATIONS.addAccountModal, }), true, ); @@ -70,7 +70,7 @@ describe("useTrackAddAccountModal", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.BLE, platform: "LLD", - page: "Add account modal", + page: HOOKS_TRACKING_LOCATIONS.addAccountModal, }), true, ); @@ -90,7 +90,7 @@ describe("useTrackAddAccountModal", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.BLE, platform: "LLD", - page: "Add account modal", + page: HOOKS_TRACKING_LOCATIONS.addAccountModal, }), true, ); @@ -110,7 +110,7 @@ describe("useTrackAddAccountModal", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.BLE, platform: "LLD", - page: "Add account modal", + page: HOOKS_TRACKING_LOCATIONS.addAccountModal, }), true, ); @@ -130,7 +130,7 @@ describe("useTrackAddAccountModal", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.BLE, platform: "LLD", - page: "Add account modal", + page: HOOKS_TRACKING_LOCATIONS.addAccountModal, }), true, ); @@ -157,13 +157,13 @@ describe("useTrackAddAccountModal", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.USB, platform: "LLD", - page: "Add account modal", + page: HOOKS_TRACKING_LOCATIONS.addAccountModal, }), true, ); }); - it('should not track if location is not "Add account modal"', () => { + it("should not track if location is not HOOKS_TRACKING_LOCATIONS.addAccountModal", () => { renderHook(() => useTrackAddAccountModal({ ...defaultArgs, @@ -191,7 +191,7 @@ describe("useTrackAddAccountModal", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.USB, platform: "LLD", - page: "Add account modal", + page: HOOKS_TRACKING_LOCATIONS.addAccountModal, }), true, ); diff --git a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackAddAccountModal.ts b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackAddAccountModal.ts index 53f1a99fad82..855782a50b2c 100644 --- a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackAddAccountModal.ts +++ b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackAddAccountModal.ts @@ -2,7 +2,7 @@ import { useRef, useEffect } from "react"; import { track } from "../segment"; import { Device } from "@ledgerhq/types-devices"; import { UserRefusedOnDevice, LockedDeviceError, CantOpenDevice } from "@ledgerhq/errors"; -import { CONNECTION_TYPES } from "./variables"; +import { CONNECTION_TYPES, HOOKS_TRACKING_LOCATIONS } from "./variables"; import { LedgerError } from "~/renderer/components/DeviceAction"; export type UseTrackAddAccountModal = { @@ -31,7 +31,7 @@ function getConnectionType(d?: Device): string | undefined { * a custom hook to track events in the Add Account Modal. * tracks user interactions with the Add Account Modal based on state changes and errors. * - * @param location - current location in the app (expected "Add account modal"). + * @param location - current location in the app (expected "Add account modal" from HOOKS_TRACKING_LOCATIONS enum). * @param device - the connected device information. * @param error - current error state. * @param isTrackingEnabled - flag indicating if tracking is enabled. @@ -52,7 +52,7 @@ export const useTrackAddAccountModal = ({ const previousDevice = useRef(undefined); useEffect(() => { - if (location !== "Add account modal") return; + if (location !== HOOKS_TRACKING_LOCATIONS.addAccountModal) return; const defaultPayload = { deviceType: device?.modelId || previousDevice.current?.modelId || undefined, diff --git a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackManagerSectionEvents.test.ts b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackManagerSectionEvents.test.ts index 0fc671b36f85..7c29990bbc5f 100644 --- a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackManagerSectionEvents.test.ts +++ b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackManagerSectionEvents.test.ts @@ -9,7 +9,7 @@ import { UserRefusedDeviceNameChange, UserRefusedFirmwareUpdate, } from "@ledgerhq/errors"; -import { CONNECTION_TYPES } from "./variables"; +import { CONNECTION_TYPES, HOOKS_TRACKING_LOCATIONS } from "./variables"; jest.mock("../segment", () => ({ track: jest.fn(), @@ -23,7 +23,7 @@ describe("useTrackManagerSectionEvents", () => { }; const defaultArgs: UseTrackManagerSectionEvents = { - location: "Manager Dashboard", + location: HOOKS_TRACKING_LOCATIONS.managerDashboard, device: deviceMock, allowManagerRequested: null, clsImageRemoved: null, @@ -51,7 +51,7 @@ describe("useTrackManagerSectionEvents", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.USB, platform: "LLD", - page: "Manager Dashboard", + page: HOOKS_TRACKING_LOCATIONS.managerDashboard, }), true, ); @@ -75,7 +75,7 @@ describe("useTrackManagerSectionEvents", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.USB, platform: "LLD", - page: "Manager Dashboard", + page: HOOKS_TRACKING_LOCATIONS.managerDashboard, }), true, ); @@ -94,7 +94,7 @@ describe("useTrackManagerSectionEvents", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.USB, platform: "LLD", - page: "Manager Dashboard", + page: HOOKS_TRACKING_LOCATIONS.managerDashboard, }), true, ); @@ -113,7 +113,7 @@ describe("useTrackManagerSectionEvents", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.USB, platform: "LLD", - page: "Manager Dashboard", + page: HOOKS_TRACKING_LOCATIONS.managerDashboard, }), true, ); @@ -132,7 +132,7 @@ describe("useTrackManagerSectionEvents", () => { deviceType: "europa", connectionType: CONNECTION_TYPES.USB, platform: "LLD", - page: "Manager Dashboard", + page: HOOKS_TRACKING_LOCATIONS.managerDashboard, }), true, ); diff --git a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackManagerSectionEvents.ts b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackManagerSectionEvents.ts index 634b66e148ee..b9a44ab2a349 100644 --- a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackManagerSectionEvents.ts +++ b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackManagerSectionEvents.ts @@ -6,7 +6,7 @@ import { } from "@ledgerhq/errors"; import { track } from "../segment"; import { Device } from "@ledgerhq/types-devices"; -import { CONNECTION_TYPES } from "./variables"; +import { CONNECTION_TYPES, HOOKS_TRACKING_LOCATIONS } from "./variables"; import { LedgerError } from "~/renderer/components/DeviceAction"; export type UseTrackManagerSectionEvents = { @@ -28,7 +28,7 @@ export type UseTrackManagerSectionEvents = { * a custom hook to track events in the Manager section. * tracks user interactions with the Manager dashboard based on state changes and errors. * - * @param location - current location in the app (expected "Manager"). + * @param location - current location in the app (expected "Manager Dashboard" from HOOKS_TRACKING_LOCATIONS enum). * @param device - the connected device information. * @param allowManagerRequested - flag indicating if the user has allowed the Manager app. * @param clsImageRemoved - flag indicating if the user has removed the custom lock screen image. @@ -47,7 +47,7 @@ export const useTrackManagerSectionEvents = ({ const previousAllowManagerRequested = useRef(undefined); useEffect(() => { - if (location !== "Manager Dashboard") return; + if (location !== HOOKS_TRACKING_LOCATIONS.managerDashboard) return; const defaultPayload = { deviceType: device?.modelId, diff --git a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackReceiveFlow.test.ts b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackReceiveFlow.test.ts index bf9cc3451001..ab861ad67bf7 100644 --- a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackReceiveFlow.test.ts +++ b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackReceiveFlow.test.ts @@ -2,6 +2,7 @@ import { renderHook } from "tests/testUtils"; import { useTrackReceiveFlow, UseTrackReceiveFlow } from "./useTrackReceiveFlow"; import { track } from "../segment"; import { UserRefusedOnDevice } from "@ledgerhq/errors"; +import { HOOKS_TRACKING_LOCATIONS } from "./variables"; jest.mock("../segment", () => ({ track: jest.fn(), @@ -15,7 +16,7 @@ describe("useTrackReceiveFlow", () => { }; const defaultArgs: UseTrackReceiveFlow = { - location: "Receive Modal", + location: HOOKS_TRACKING_LOCATIONS.receiveModal, device: deviceMock, verifyAddressError: null, error: null, diff --git a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackReceiveFlow.ts b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackReceiveFlow.ts index dc5c691e87c6..cca6b1f2d6a5 100644 --- a/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackReceiveFlow.ts +++ b/apps/ledger-live-desktop/src/renderer/analytics/hooks/useTrackReceiveFlow.ts @@ -3,6 +3,7 @@ import { track } from "../segment"; import { Device } from "@ledgerhq/types-devices"; import { UserRefusedOnDevice } from "@ledgerhq/errors"; import { LedgerError } from "~/renderer/components/DeviceAction"; +import { HOOKS_TRACKING_LOCATIONS } from "./variables"; export type UseTrackReceiveFlow = { location: string | undefined; @@ -33,7 +34,7 @@ export type UseTrackReceiveFlow = { * a custom hook to track events in the Receive modal. * tracks user interactions with the Receive modal based on state changes and errors. * - * @param location - current location in the app (expected "Receive Modal"). + * @param location - current location in the app (expected "Receive Modal" from HOOKS_TRACKING_LOCATIONS enum). * @param device - the connected device information. * @param verifyAddressError - optional - error from verifying address. * @param error - optional - current error state. @@ -49,7 +50,7 @@ export const useTrackReceiveFlow = ({ isTrackingEnabled, }: UseTrackReceiveFlow) => { useEffect(() => { - if (location !== "Receive Modal") return; + if (location !== HOOKS_TRACKING_LOCATIONS.receiveModal) return; const defaultPayload = { deviceType: device?.modelId, diff --git a/apps/ledger-live-desktop/src/renderer/analytics/hooks/variables.ts b/apps/ledger-live-desktop/src/renderer/analytics/hooks/variables.ts index 018fdb394985..65f7415f8046 100644 --- a/apps/ledger-live-desktop/src/renderer/analytics/hooks/variables.ts +++ b/apps/ledger-live-desktop/src/renderer/analytics/hooks/variables.ts @@ -5,4 +5,7 @@ export enum CONNECTION_TYPES { export enum HOOKS_TRACKING_LOCATIONS { ledgerSync = "Ledger Sync", + addAccountModal = "Add account modal", + managerDashboard = "Manager Dashboard", + receiveModal = "Receive Modal", } diff --git a/apps/ledger-live-desktop/src/renderer/components/Stepper/index.tsx b/apps/ledger-live-desktop/src/renderer/components/Stepper/index.tsx index 1c2c8cd2e251..2029531d262d 100644 --- a/apps/ledger-live-desktop/src/renderer/components/Stepper/index.tsx +++ b/apps/ledger-live-desktop/src/renderer/components/Stepper/index.tsx @@ -10,6 +10,7 @@ import { useSelector } from "react-redux"; import { trackingEnabledSelector } from "~/renderer/reducers/settings"; import { getCurrentDevice } from "~/renderer/reducers/devices"; import { LedgerError } from "../DeviceAction"; +import { HOOKS_TRACKING_LOCATIONS } from "~/renderer/analytics/hooks/variables"; export type BasicStepProps = { t: TFunction; @@ -72,7 +73,7 @@ const Stepper = ({ [onStepChange, steps], ); useTrackAddAccountModal({ - location: "Add account modal", + location: HOOKS_TRACKING_LOCATIONS.addAccountModal, device: useSelector(getCurrentDevice), error: err, isTrackingEnabled: useSelector(trackingEnabledSelector), diff --git a/apps/ledger-live-desktop/src/renderer/modals/AddAccounts/steps/StepConnectDevice.tsx b/apps/ledger-live-desktop/src/renderer/modals/AddAccounts/steps/StepConnectDevice.tsx index 71f22b81c04d..f725348e1f14 100644 --- a/apps/ledger-live-desktop/src/renderer/modals/AddAccounts/steps/StepConnectDevice.tsx +++ b/apps/ledger-live-desktop/src/renderer/modals/AddAccounts/steps/StepConnectDevice.tsx @@ -8,6 +8,7 @@ import { StepProps } from ".."; import { getEnv } from "@ledgerhq/live-env"; import { mockedEventEmitter } from "~/renderer/components/debug/DebugMock"; import connectApp from "@ledgerhq/live-common/hw/connectApp"; +import { HOOKS_TRACKING_LOCATIONS } from "~/renderer/analytics/hooks/variables"; const action = createAction(getEnv("MOCK") ? mockedEventEmitter : connectApp); const StepConnectDevice = ({ currency, transitionTo, flow }: StepProps) => { invariant(currency, "No crypto asset given"); @@ -40,7 +41,7 @@ const StepConnectDevice = ({ currency, transitionTo, flow }: StepProps) => { transitionTo("import"); }} analyticsPropertyFlow={flow} - location="Add account modal" + location={HOOKS_TRACKING_LOCATIONS.addAccountModal} /> ); diff --git a/apps/ledger-live-desktop/src/renderer/modals/Receive/index.tsx b/apps/ledger-live-desktop/src/renderer/modals/Receive/index.tsx index 2fe58cffb390..f5539ee58b7a 100644 --- a/apps/ledger-live-desktop/src/renderer/modals/Receive/index.tsx +++ b/apps/ledger-live-desktop/src/renderer/modals/Receive/index.tsx @@ -8,6 +8,7 @@ import { openModal, closeModal } from "~/renderer/actions/modals"; import { useTrackReceiveFlow } from "~/renderer/analytics/hooks/useTrackReceiveFlow"; import { trackingEnabledSelector } from "~/renderer/reducers/settings"; import { getCurrentDevice } from "~/renderer/reducers/devices"; +import { HOOKS_TRACKING_LOCATIONS } from "~/renderer/analytics/hooks/variables"; type State = { stepId: StepId; @@ -28,7 +29,7 @@ const ReceiveModal = () => { const device = useSelector(getCurrentDevice); useTrackReceiveFlow({ - location: "Receive Modal", + location: HOOKS_TRACKING_LOCATIONS.receiveModal, device, verifyAddressError, isTrackingEnabled: useSelector(trackingEnabledSelector), diff --git a/apps/ledger-live-desktop/src/renderer/modals/Receive/steps/StepConnectDevice.tsx b/apps/ledger-live-desktop/src/renderer/modals/Receive/steps/StepConnectDevice.tsx index fd9f2c7e98a6..dcdf063fabd8 100644 --- a/apps/ledger-live-desktop/src/renderer/modals/Receive/steps/StepConnectDevice.tsx +++ b/apps/ledger-live-desktop/src/renderer/modals/Receive/steps/StepConnectDevice.tsx @@ -10,6 +10,7 @@ import connectApp from "@ledgerhq/live-common/hw/connectApp"; import { StepProps } from "../Body"; import { mockedEventEmitter } from "~/renderer/components/debug/DebugMock"; import { getEnv } from "@ledgerhq/live-env"; +import { HOOKS_TRACKING_LOCATIONS } from "~/renderer/analytics/hooks/variables"; const action = createAction(getEnv("MOCK") ? mockedEventEmitter : connectApp); export default function StepConnectDevice({ account, @@ -34,7 +35,7 @@ export default function StepConnectDevice({ request={request} onResult={() => transitionTo("receive")} analyticsPropertyFlow="receive" - location="Receive Modal" + location={HOOKS_TRACKING_LOCATIONS.receiveModal} /> ); diff --git a/apps/ledger-live-desktop/src/renderer/screens/manager/DeviceDashboard/DeviceInformationSummary/EditDeviceName.tsx b/apps/ledger-live-desktop/src/renderer/screens/manager/DeviceDashboard/DeviceInformationSummary/EditDeviceName.tsx index 7f56e223f57e..126e39791bc7 100644 --- a/apps/ledger-live-desktop/src/renderer/screens/manager/DeviceDashboard/DeviceInformationSummary/EditDeviceName.tsx +++ b/apps/ledger-live-desktop/src/renderer/screens/manager/DeviceDashboard/DeviceInformationSummary/EditDeviceName.tsx @@ -13,6 +13,7 @@ import getDeviceNameMaxLength from "@ledgerhq/live-common/hw/getDeviceNameMaxLen import renameDevice from "@ledgerhq/live-common/hw/renameDevice"; import { withV3StyleProvider } from "~/renderer/styles/StyleProviderV3"; import { DeviceInfo } from "@ledgerhq/types-live"; +import { HOOKS_TRACKING_LOCATIONS } from "~/renderer/analytics/hooks/variables"; const action = createAction(renameDevice); @@ -144,7 +145,7 @@ const EditDeviceName: React.FC = ({ inlineRetry={false} onResult={onSuccess} onError={(error: Error) => setActionError(error)} - location="Manager Dashboard" + location={HOOKS_TRACKING_LOCATIONS.managerDashboard} /> ) : ( diff --git a/apps/ledger-live-desktop/src/renderer/screens/manager/DeviceDashboard/DeviceInformationSummary/RemoveCustomImage.tsx b/apps/ledger-live-desktop/src/renderer/screens/manager/DeviceDashboard/DeviceInformationSummary/RemoveCustomImage.tsx index 0a9f38059294..bc76881389a2 100644 --- a/apps/ledger-live-desktop/src/renderer/screens/manager/DeviceDashboard/DeviceInformationSummary/RemoveCustomImage.tsx +++ b/apps/ledger-live-desktop/src/renderer/screens/manager/DeviceDashboard/DeviceInformationSummary/RemoveCustomImage.tsx @@ -9,6 +9,7 @@ import styled from "styled-components"; import { useTranslation } from "react-i18next"; import { clearLastSeenCustomImage } from "~/renderer/actions/settings"; import { ImageDoesNotExistOnDevice } from "@ledgerhq/live-common/errors"; +import { HOOKS_TRACKING_LOCATIONS } from "~/renderer/analytics/hooks/variables"; const action = createAction(removeImage); @@ -101,7 +102,7 @@ const RemoveCustomImage: React.FC = ({ onClose, onRemoved }) => { action={action} onResult={onSuccess} onError={onError} - location="Manager Dashboard" + location={HOOKS_TRACKING_LOCATIONS.managerDashboard} /> ) : null} diff --git a/apps/ledger-live-desktop/src/renderer/screens/manager/index.tsx b/apps/ledger-live-desktop/src/renderer/screens/manager/index.tsx index 74f083a3e463..13301d2a62ff 100644 --- a/apps/ledger-live-desktop/src/renderer/screens/manager/index.tsx +++ b/apps/ledger-live-desktop/src/renderer/screens/manager/index.tsx @@ -15,6 +15,7 @@ import { useDispatch } from "react-redux"; import { context } from "~/renderer/drawers/Provider"; import { useDeviceSessionRefresherToggle } from "@ledgerhq/live-dmk"; import { useFeature } from "@ledgerhq/live-common/featureFlags/index"; +import { HOOKS_TRACKING_LOCATIONS } from "~/renderer/analytics/hooks/variables"; const action = createAction(getEnv("MOCK") ? mockedEventEmitter : connectManager); const Manager = () => { @@ -73,7 +74,7 @@ const Manager = () => { onResult={onResult} action={action} request={null} - location="Manager Dashboard" + location={HOOKS_TRACKING_LOCATIONS.managerDashboard} /> ) : (