chore(runway): cherry-pick fix: metrics call during onboarding (#13226)

<!--
Please submit this PR as a draft initially.
Do not mark it as "Ready for review" until the template has been
completely filled out, and PR status checks have passed at least once.
-->

## **Description**

- refactor track trackOnboarding calls to pass an event built with
MetricsEventBuilder
- pass the properties with MetricsEventBuilder.addProperties

## **Related issues**

Fixes MetaMask/mobile-planning#2122

## **Manual testing steps**

```gherkin
Feature: track metrics during onboarding

  Scenario: user creates new wallet
    Given a freshly installed app
    And user opted in for metrics
    When user creates a new wallet
    And user enters a new password
    Then no 'TRACK event saved {"event": undefined, "properties": {}, "type": "track"}' log is visible
    And the "Wallet Setup Started", "Wallet Created" and "Wallet Setup Completed" log is visible

  Scenario: user imports wallet
    Given a freshly installed app
    And user opted in for metrics
    When user imports a wallet
    And user enters a new password
    Then no 'TRACK event saved {"event": undefined, "properties": {}, "type": "track"}' log is visible
    And the "Wallet Import Started", "Wallet Imported" and "Wallet Setup Completed" log is visible

  Scenario: user manually backs the wallet up
    Given a freshly installed app
    And user opted in for metrics
    And user created a new wallet
    When user saves SRP
    Then no 'TRACK event saved {"event": undefined, "properties": {}, "type": "track"}' log is visible
    And the "Wallet Security Started", "Manual Backup Initiated", "Phrase Revealed", "Phrase Confirmed" and "Wallet Security Completed" log is visible

  Scenario: user skips wallet backup
    Given a freshly installed app
    And user opted in for metrics
    And user created a new wallet
    When user skips SRP backup by touching "remind me later"
    Then no 'TRACK event saved {"event": undefined, "properties": {}, "type": "track"}' log is visible
    And the "Wallet Security Skip Initiated", "Wallet Security Skip Confirmed" and "Automatic Security Checks Prompt Viewed" log is visible
```

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before**

```
INFO  TRACK event saved {"event": undefined, "properties": {}, "type": "track"}
```

### **After**
examples of fixed event tracking
```
INFO  TRACK event saved {"event": "Wallet Setup Started", "properties": {}, "type": "track"}
INFO  TRACK event saved {"event": "Wallet Created", "properties": {"biometrics_enabled": false}, "type": "track"}
INFO  TRACK event saved {"event": "Wallet Setup Completed", "properties": {"new_wallet": true, "wallet_setup_type": "new"}, "type": "track"}
```

```
INFO  TRACK event saved {"event": "Wallet Import Started", "properties": {}, "type": "track"}
INFO  TRACK event saved {"event": "Wallet Imported", "properties": {"biometrics_enabled": false}, "type": "track"}
INFO  TRACK event saved {"event": "Wallet Setup Completed", "properties": {"new_wallet": false, "wallet_setup_type": "import"}, "type": "track"}
```

```
INFO  TRACK event saved {"event": "Wallet Security Skip Initiated", "properties": {}, "type": "track"}
INFO  TRACK event saved {"event": "Wallet Security Skip Confirmed", "properties": {}, "type": "track"}
INFO  TRACK event saved {"event": "Automatic Security Checks Prompt Viewed", "properties": {"applicationVersion": "7.37.1", "currentBuildNumber": "1520", "deviceBrand": "Apple", "operatingSystemVersion": "18.2", "platform": "ios"}, "type": "track"}
INFO  TRACK event saved {"event": "Wallet Security Reminder Dismissed", "properties": {"source": "Backup Alert", "wallet_protection_required": false}, "type": "track"}
```
## **Pre-merge author checklist**

- [x] I’ve followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile
Coding
Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [x] I've completed the PR template to the best of my ability
- [x] I’ve included tests if applicable
- [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [x] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.

---------

Co-authored-by: sethkfman <[email protected]>

app/components/Views/AccountBackupStep1/index.js

@@ -32,6 +32,7 @@ import { useTheme } from '../../../util/theme';
 import { ManualBackUpStepsSelectorsIDs } from '../../../../e2e/selectors/Onboarding/ManualBackUpSteps.selectors';
 import trackOnboarding from '../../../util/metrics/TrackOnboarding/trackOnboarding';
 import Routes from '../../../../app/constants/navigation/Routes';
+import { MetricsEventBuilder } from '../../../core/Analytics/MetricsEventBuilder';
 
 const createStyles = (colors) =>
   StyleSheet.create({
@@ -129,7 +130,9 @@ const AccountBackupStep1 = (props) => {
   const styles = createStyles(colors);
 
   const track = (event, properties) => {
-    trackOnboarding(event, properties);
+      const eventBuilder = MetricsEventBuilder.createEventBuilder(event);
+      eventBuilder.addProperties(properties);
+      trackOnboarding(eventBuilder.build());
   };
 
   useEffect(() => {

app/components/Views/ChoosePassword/index.js

@@ -64,6 +64,7 @@ import navigateTermsOfUse from '../../../util/termsOfUse/termsOfUse';
 import { ChoosePasswordSelectorsIDs } from '../../../../e2e/selectors/Onboarding/ChoosePassword.selectors';
 import trackOnboarding from '../../../util/metrics/TrackOnboarding/trackOnboarding';
 import { enableProfileSyncing } from '../../../actions/identity';
+import {MetricsEventBuilder} from '../../../core/Analytics/MetricsEventBuilder';
 const createStyles = (colors) =>
   StyleSheet.create({
     mainWrapper: {
@@ -256,7 +257,9 @@ class ChoosePassword extends PureComponent {
   keyringControllerPasswordSet = false;
 
   track = (event, properties) => {
-    trackOnboarding(event, properties);
+    const eventBuilder = MetricsEventBuilder.createEventBuilder(event);
+    eventBuilder.addProperties(properties);
+    trackOnboarding(eventBuilder.build());
   };
 
   updateNavBar = () => {

app/components/Views/ImportFromSecretRecoveryPhrase/index.js

@@ -65,6 +65,7 @@ import { ImportFromSeedSelectorsIDs } from '../../../../e2e/selectors/Onboarding
 import { ChoosePasswordSelectorsIDs } from '../../../../e2e/selectors/Onboarding/ChoosePassword.selectors';
 import trackOnboarding from '../../../util/metrics/TrackOnboarding/trackOnboarding';
 import { useProfileSyncing } from '../../../util/identity/hooks/useProfileSyncing';
+import {MetricsEventBuilder} from '../../../core/Analytics/MetricsEventBuilder';
 
 const MINIMUM_SUPPORTED_CLIPBOARD_VERSION = 9;
 
@@ -108,7 +109,9 @@ const ImportFromSecretRecoveryPhrase = ({
   const confirmPasswordInput = React.createRef();
 
   const track = (event, properties) => {
-    trackOnboarding(event, properties);
+    const eventBuilder = MetricsEventBuilder.createEventBuilder(event);
+    eventBuilder.addProperties(properties);
+    trackOnboarding(eventBuilder.build());
   };
 
   const updateNavBar = () => {

app/components/Views/ManualBackupStep3/index.js

@@ -173,7 +173,11 @@ class ManualBackupStep3 extends PureComponent {
       SEED_PHRASE_HINTS,
       JSON.stringify({ ...parsedHints, manualBackup: hintText }),
     );
-    this.track(MetaMetricsEvents.WALLET_SECURITY_RECOVERY_HINT_SAVED);
+    trackOnboarding(
+        MetricsEventBuilder.createEventBuilder(
+            MetaMetricsEvents.WALLET_SECURITY_RECOVERY_HINT_SAVED,
+        ).build(),
+    );
   };
 
   done = async () => {

app/components/Views/Onboarding/index.js

@@ -50,6 +50,7 @@ import Routes from '../../../constants/navigation/Routes';
 import { selectAccounts } from '../../../selectors/accountTrackerController';
 import trackOnboarding from '../../../util/metrics/TrackOnboarding/trackOnboarding';
 import { trace, TraceName, TraceOperation } from '../../../util/trace';
+import { MetricsEventBuilder } from '../../../core/Analytics/MetricsEventBuilder';
 
 const createStyles = (colors) =>
   StyleSheet.create({
@@ -321,7 +322,7 @@ class Onboarding extends PureComponent {
   };
 
   track = (event) => {
-    trackOnboarding(event);
+    trackOnboarding(MetricsEventBuilder.createEventBuilder(event).build());
   };
 
   alertExistingUser = (callback) => {