feat(suite): add anayltics to the device onboarding (seed backup types)

trezor · May 16, 2024 · 75764d8 · 75764d8
1 parent 629d6f8
commit 75764d8
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 2 deletions.
diff --git a/packages/suite-analytics/src/constants.ts b/packages/suite-analytics/src/constants.ts
@@ -87,4 +87,6 @@ export enum EventType {
     GetDesktopApp = 'promo/desktop',
     GetMobileApp = 'promo/mobile',
     T2B1DashboardPromo = 'promo/t2b1-dashboard',
+
+    OnboardingSelectBackupTypeOpened = 'onboarding/select-backup-type-opened',
 }
diff --git a/packages/suite-analytics/src/types/events.ts b/packages/suite-analytics/src/types/events.ts
@@ -417,4 +417,13 @@ export type SuiteAnalyticsEvent =
           payload: {
               action: 'shop' | 'close';
           };
+      }
+    | {
+          type: EventType.OnboardingSelectBackupTypeOpened;
+          payload: {
+              finalSelectedOption: 'shamir-default' | 'shamir-advance' | '12-words' | '24-words';
+              wasSelectTypeOpened: boolean;
+              device: string;
+              unitPackaging: number;
+          };
       };
diff --git a/packages/suite/src/views/onboarding/steps/ResetDevice.tsx b/packages/suite/src/views/onboarding/steps/ResetDevice.tsx
@@ -11,6 +11,7 @@ import { Button, Divider, Text } from '@trezor/components';
 import { SelectBackupType, getDefaultBackupType, isShamirBackupType } from './SelectBackupType';
 import { DeviceModelInternal } from '@trezor/connect';
 import { BackupType } from '../../../reducers/onboarding/onboardingReducer';
+import { analytics, EventType } from '@trezor/suite-analytics';
 
 const SelectWrapper = styled.div`
     width: 100%;
@@ -44,6 +45,7 @@ export const ResetDeviceStep = () => {
 
     const [submitted, setSubmitted] = useState(false);
     const [backupType, setBackupType] = useState<BackupType>(deviceDefaultBackupType);
+    const [wasSelectTypeOpened, setWasSelectTypeOpened] = useState<boolean>(false);
     const { goToPreviousStep, goToNextStep, updateAnalytics, updateBackupType } = useOnboarding();
 
     const dispatch = useDispatch();
@@ -72,6 +74,16 @@ export const ResetDeviceStep = () => {
 
     const handleSubmit = useCallback(
         async (type: BackupType) => {
+            analytics.report({
+                type: EventType.OnboardingSelectBackupTypeOpened,
+                payload: {
+                    wasSelectTypeOpened,
+                    finalSelectedOption: type,
+                    device: deviceModel ?? '',
+                    unitPackaging,
+                },
+            });
+
             switch (type) {
                 case 'shamir-default':
                     await onResetDevice({ backup_type: 1 });
@@ -150,7 +162,8 @@ export const ResetDeviceStep = () => {
                             <>
                                 <SelectBackupType
                                     selected={backupType}
-                                    onSelect={setBackupType}
+                                    onOpen={() => setWasSelectTypeOpened(true)}
+                                    onSelect={value => setBackupType(value)}
                                     isDisabled={isDeviceLocked}
                                     data-test="@onboarding/select-seed-type-open-dialog"
                                 />

diff --git a/packages/suite/src/views/onboarding/steps/SelectBackupType.tsx b/packages/suite/src/views/onboarding/steps/SelectBackupType.tsx
@@ -401,12 +401,14 @@ type SelectBackupTypeProps = {
     isDisabled: boolean;
     selected: BackupType;
     onSelect: (value: BackupType) => void;
+    onOpen: () => void;
     'data-test'?: string;
 };
 
 export const SelectBackupType = ({
     selected,
     onSelect,
+    onOpen,
     isDisabled,
     'data-test': dataTest,
 }: SelectBackupTypeProps) => {
@@ -450,11 +452,16 @@ export const SelectBackupType = ({
     const isShamirDefault = isShamirBackupType(defaultBackupType);
     const isShamirSelected = isShamirBackupType(selected);
 
+    const handleOpen = () => {
+        setIsOpen(true);
+        onOpen();
+    };
+
     return (
         <Wrapper>
             <SelectWrapper $elevation={elevation} ref={refs.setReference} {...getReferenceProps()}>
                 <ElevationUp>
-                    <SelectedOption isDisabled={isDisabled} onClick={() => setIsOpen(true)}>
+                    <SelectedOption isDisabled={isDisabled} onClick={handleOpen}>
                         <OptionText data-test={dataTest}>
                             <Text variant="tertiary" typographyStyle="hint">
                                 <Translation id="TR_ONBOARDING_BACKUP_TYPE" />