feat: Views folder migration events from W to R beginning letters

app/components/Views/RestoreWallet/RestoreWallet.tsx

@@ -19,9 +19,10 @@ import { useAppThemeFromContext } from '../../../util/theme';
 import { createWalletResetNeededNavDetails } from './WalletResetNeeded';
 import { createWalletRestoredNavDetails } from './WalletRestored';
 import { MetaMetricsEvents } from '../../../core/Analytics';
-import { trackEventV2 as trackEvent } from '../../../util/analyticsV2';
+
 import generateDeviceAnalyticsMetaData from '../../../util/metrics';
 import { StackNavigationProp } from '@react-navigation/stack';
+import { useMetrics } from '../../../components/hooks/useMetrics';
 
 /* eslint-disable import/no-commonjs, @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports */
 const onboardingDeviceImage = require('../../../images/swaps_onboard_device.png');
@@ -43,6 +44,7 @@ export const createRestoreWalletNavDetailsNested =
   );
 
 const RestoreWallet = () => {
+  const { trackEvent } = useMetrics();
   const { colors } = useAppThemeFromContext();
   const styles = createStyles(colors);
 
@@ -58,13 +60,13 @@ const RestoreWallet = () => {
       MetaMetricsEvents.VAULT_CORRUPTION_RESTORE_WALLET_SCREEN_VIEWED,
       { ...deviceMetaData, previousScreen },
     );
-  }, [deviceMetaData, previousScreen]);
+  }, [deviceMetaData, previousScreen, trackEvent]);
 
   const handleOnNext = useCallback(async (): Promise<void> => {
     setLoading(true);
     trackEvent(
       MetaMetricsEvents.VAULT_CORRUPTION_RESTORE_WALLET_BUTTON_PRESSED,
-      deviceMetaData,
+      { ...deviceMetaData },
     );
     const restoreResult = await EngineService.initializeVaultFromBackup();
     if (restoreResult.success) {
@@ -74,7 +76,7 @@ const RestoreWallet = () => {
       replace(...createWalletResetNeededNavDetails());
       setLoading(false);
     }
-  }, [deviceMetaData, replace]);
+  }, [deviceMetaData, replace, trackEvent]);
 
   return (
     <SafeAreaView style={styles.screen}>

app/components/Views/RestoreWallet/WalletResetNeeded.tsx

@@ -18,15 +18,16 @@ import { useNavigation } from '@react-navigation/native';
 import { StackNavigationProp } from '@react-navigation/stack';
 import { createRestoreWalletNavDetails } from './RestoreWallet';
 import { MetaMetricsEvents } from '../../../core/Analytics';
-import { trackEventV2 as trackEvent } from '../../../util/analyticsV2';
 import generateDeviceAnalyticsMetaData from '../../../util/metrics';
+import { useMetrics } from '../../../components/hooks/useMetrics';
 
 export const createWalletResetNeededNavDetails = createNavigationDetails(
   Routes.VAULT_RECOVERY.WALLET_RESET_NEEDED,
 );
 
 const WalletResetNeeded = () => {
   const { colors } = useAppThemeFromContext();
+  const { trackEvent } = useMetrics();
   const styles = createStyles(colors);
 
   const navigation = useNavigation<StackNavigationProp<any>>();
@@ -36,31 +37,31 @@ const WalletResetNeeded = () => {
   useEffect(() => {
     trackEvent(
       MetaMetricsEvents.VAULT_CORRUPTION_WALLET_RESET_NEEDED_SCREEN_VIEWED,
-      deviceMetaData,
+      { ...deviceMetaData },
     );
-  }, [deviceMetaData]);
+  }, [trackEvent, deviceMetaData]);
 
   const handleCreateNewWallet = useCallback(async () => {
     trackEvent(
       MetaMetricsEvents.VAULT_CORRUPTION_WALLET_RESET_NEEDED_CREATE_NEW_WALLET_BUTTON_PRESSED,
-      deviceMetaData,
+      { ...deviceMetaData },
     );
     navigation.navigate(Routes.MODAL.ROOT_MODAL_FLOW, {
       screen: Routes.MODAL.DELETE_WALLET,
     });
-  }, [deviceMetaData, navigation]);
+  }, [deviceMetaData, navigation, trackEvent]);
 
   const handleTryAgain = useCallback(async () => {
     trackEvent(
       MetaMetricsEvents.VAULT_CORRUPTION_WALLET_RESET_NEEDED_TRY_AGAIN_BUTTON_PRESSED,
-      deviceMetaData,
+      { ...deviceMetaData },
     );
     navigation.replace(
       ...createRestoreWalletNavDetails({
         previousScreen: Routes.VAULT_RECOVERY.WALLET_RESET_NEEDED,
       }),
     );
-  }, [deviceMetaData, navigation]);
+  }, [deviceMetaData, navigation, trackEvent]);
 
   return (
     <SafeAreaView style={styles.screen}>

app/components/Views/RestoreWallet/WalletRestored.tsx

@@ -22,11 +22,11 @@ import { useNavigation } from '@react-navigation/native';
 import { Authentication } from '../../../core';
 import { useAppThemeFromContext } from '../../../util/theme';
 import { MetaMetricsEvents } from '../../../core/Analytics';
-import { trackEventV2 as trackEvent } from '../../../util/analyticsV2';
 import generateDeviceAnalyticsMetaData from '../../../util/metrics';
 import { SRP_GUIDE_URL } from '../../../constants/urls';
 import { StackNavigationProp } from '@react-navigation/stack';
 import { selectSelectedAddress } from '../../../selectors/preferencesController';
+import { useMetrics } from '../../../components/hooks/useMetrics';
 
 export const createWalletRestoredNavDetails = createNavigationDetails(
   Routes.VAULT_RECOVERY.WALLET_RESTORED,
@@ -35,6 +35,7 @@ export const createWalletRestoredNavDetails = createNavigationDetails(
 const WalletRestored = () => {
   const [loading, setLoading] = useState<boolean>(false);
   const { colors } = useAppThemeFromContext();
+  const { trackEvent } = useMetrics();
   const styles = createStyles(colors);
   const navigation = useNavigation<StackNavigationProp<any>>();
   const selectedAddress = useSelector(selectSelectedAddress);
@@ -44,9 +45,9 @@ const WalletRestored = () => {
   useEffect(() => {
     trackEvent(
       MetaMetricsEvents.VAULT_CORRUPTION_WALLET_SUCCESSFULLY_RESTORED_SCREEN_VIEWED,
-      deviceMetaData,
+      { ...deviceMetaData },
     );
-  }, [deviceMetaData]);
+  }, [deviceMetaData, trackEvent]);
 
   const finishWalletRestore = useCallback(async (): Promise<void> => {
     try {
@@ -71,10 +72,10 @@ const WalletRestored = () => {
     setLoading(true);
     trackEvent(
       MetaMetricsEvents.VAULT_CORRUPTION_WALLET_SUCCESSFULLY_RESTORED_CONTINUE_BUTTON_PRESSED,
-      deviceMetaData,
+      { ...deviceMetaData },
     );
     await finishWalletRestore();
-  }, [deviceMetaData, finishWalletRestore]);
+  }, [deviceMetaData, finishWalletRestore, trackEvent]);
 
   return (
     <SafeAreaView style={styles.screen}>

app/components/Views/RevealPrivateCredential/RevealPrivateCredential.tsx

@@ -39,7 +39,6 @@ import { useTheme } from '../../../util/theme';
 import Engine from '../../../core/Engine';
 import { BIOMETRY_CHOICE } from '../../../constants/storage';
 import { MetaMetricsEvents } from '../../../core/Analytics';
-import AnalyticsV2 from '../../../util/analyticsV2';
 import { uint8ArrayToMnemonic } from '../../../util/mnemonic';
 import { passwordRequirementsMet } from '../../../util/password';
 import { Authentication } from '../../../core/';
@@ -54,6 +53,7 @@ import generateTestId from '../../../../wdio/utils/generateTestId';
 import { RevealSeedViewSelectorsIDs } from '../../../../e2e/selectors/Settings/SecurityAndPrivacy/RevealSeedView.selectors';
 
 import { selectSelectedAddress } from '../../../selectors/preferencesController';
+import { useMetrics } from '../../../components/hooks/useMetrics';
 
 const PRIVATE_KEY = 'private_key';
 
@@ -89,6 +89,7 @@ const RevealPrivateCredential = ({
   const dispatch = useDispatch();
 
   const theme = useTheme();
+  const { trackEvent } = useMetrics();
   const { colors, themeAppearance } = theme;
   const styles = createStyles(theme);
 
@@ -153,7 +154,7 @@ const RevealPrivateCredential = ({
     updateNavBar();
     // Track SRP Reveal screen rendered
     if (!isPrivateKey) {
-      AnalyticsV2.trackEvent(MetaMetricsEvents.REVEAL_SRP_SCREEN, {});
+      trackEvent(MetaMetricsEvents.REVEAL_SRP_SCREEN, {});
     }
 
     const unlockWithBiometrics = async () => {
@@ -186,15 +187,14 @@ const RevealPrivateCredential = ({
 
   const cancelReveal = () => {
     if (!unlocked)
-      AnalyticsV2.trackEvent(
+      trackEvent(
         isPrivateKey
           ? MetaMetricsEvents.REVEAL_PRIVATE_KEY_CANCELLED
           : MetaMetricsEvents.REVEAL_SRP_CANCELLED,
         { view: 'Enter password' },
       );
 
-    if (!isPrivateKey)
-      AnalyticsV2.trackEvent(MetaMetricsEvents.CANCEL_REVEAL_SRP_CTA, {});
+    if (!isPrivateKey) trackEvent(MetaMetricsEvents.CANCEL_REVEAL_SRP_CTA, {});
     if (cancel) return cancel();
     navigateBack();
   };
@@ -212,7 +212,7 @@ const RevealPrivateCredential = ({
     if (!isPrivateKey) {
       const currentDate = new Date();
       dispatch(recordSRPRevealTimestamp(currentDate.toString()));
-      AnalyticsV2.trackEvent(MetaMetricsEvents.NEXT_REVEAL_SRP_CTA, {});
+      trackEvent(MetaMetricsEvents.NEXT_REVEAL_SRP_CTA, {});
     }
     setIsModalVisible(true);
     setWarningIncorrectPassword('');
@@ -223,22 +223,21 @@ const RevealPrivateCredential = ({
   };
 
   const done = () => {
-    if (!isPrivateKey)
-      AnalyticsV2.trackEvent(MetaMetricsEvents.SRP_DONE_CTA, {});
+    if (!isPrivateKey) trackEvent(MetaMetricsEvents.SRP_DONE_CTA, {});
     navigateBack();
   };
 
   const copyPrivateCredentialToClipboard = async (
     privCredentialName: string,
   ) => {
-    AnalyticsV2.trackEvent(
+    trackEvent(
       privCredentialName === PRIVATE_KEY
         ? MetaMetricsEvents.REVEAL_PRIVATE_KEY_COMPLETED
         : MetaMetricsEvents.REVEAL_SRP_COMPLETED,
       { action: 'copied to clipboard' },
     );
 
-    if (!isPrivateKey) AnalyticsV2.trackEvent(MetaMetricsEvents.COPY_SRP, {});
+    if (!isPrivateKey) trackEvent(MetaMetricsEvents.COPY_SRP, {});
 
     await ClipboardManager.setStringExpire(clipboardPrivateCredential);
 
@@ -283,24 +282,23 @@ const RevealPrivateCredential = ({
 
   const onTabBarChange = (event: { i: number }) => {
     if (event.i === 0) {
-      AnalyticsV2.trackEvent(
+      trackEvent(
         isPrivateKey
           ? MetaMetricsEvents.REVEAL_PRIVATE_KEY_COMPLETED
           : MetaMetricsEvents.REVEAL_SRP_COMPLETED,
         { action: 'viewed SRP' },
       );
 
-      if (!isPrivateKey) AnalyticsV2.trackEvent(MetaMetricsEvents.VIEW_SRP, {});
+      if (!isPrivateKey) trackEvent(MetaMetricsEvents.VIEW_SRP, {});
     } else if (event.i === 1) {
-      AnalyticsV2.trackEvent(
+      trackEvent(
         isPrivateKey
           ? MetaMetricsEvents.REVEAL_PRIVATE_KEY_COMPLETED
           : MetaMetricsEvents.REVEAL_SRP_COMPLETED,
         { action: 'viewed QR code' },
       );
 
-      if (!isPrivateKey)
-        AnalyticsV2.trackEvent(MetaMetricsEvents.VIEW_SRP_QR, {});
+      if (!isPrivateKey) trackEvent(MetaMetricsEvents.VIEW_SRP_QR, {});
     }
   };
 
@@ -395,17 +393,14 @@ const RevealPrivateCredential = ({
   );
 
   const closeModal = () => {
-    AnalyticsV2.trackEvent(
+    trackEvent(
       isPrivateKey
         ? MetaMetricsEvents.REVEAL_PRIVATE_KEY_CANCELLED
         : MetaMetricsEvents.REVEAL_SRP_CANCELLED,
       { view: 'Hold to reveal' },
     );
 
-    AnalyticsV2.trackEvent(
-      MetaMetricsEvents.SRP_DISMISS_HOLD_TO_REVEAL_DIALOG,
-      {},
-    );
+    trackEvent(MetaMetricsEvents.SRP_DISMISS_HOLD_TO_REVEAL_DIALOG, {});
 
     setIsModalVisible(false);
   };

app/components/Views/Settings/AdvancedSettings/index.js

@@ -36,7 +36,7 @@ import {
   selectUseTokenDetection,
 } from '../../../../selectors/preferencesController';
 import Routes from '../../../../constants/navigation/Routes';
-import { trackEventV2 as trackEvent } from '../../../../util/analyticsV2';
+
 import { MetaMetricsEvents } from '../../../../core/Analytics';
 import { AdvancedViewSelectorsIDs } from '../../../../../e2e/selectors/Settings/AdvancedView.selectors';
 import Text, {
@@ -52,6 +52,7 @@ import Banner, {
   BannerAlertSeverity,
   BannerVariant,
 } from '../../../../component-library/components/Banners/Banner';
+import { withMetricsAwareness } from '../../../../components/hooks/useMetrics';
 import { wipeTransactions } from '../../../../util/transaction-controller';
 
 const createStyles = (colors) =>
@@ -186,6 +187,10 @@ class AdvancedSettings extends PureComponent {
      * Object that represents the current route info like params passed to it
      */
     route: PropTypes.object,
+    /**
+     * Metrics injected by withMetricsAwareness HOC
+     */
+    metrics: PropTypes.object,
   };
 
   scrollView = React.createRef();
@@ -291,7 +296,10 @@ class AdvancedSettings extends PureComponent {
       // Disable eth_sign directly without friction
       const { PreferencesController } = Engine.context;
       PreferencesController.setDisabledRpcMethodPreference('eth_sign', false);
-      trackEvent(MetaMetricsEvents.SETTINGS_ADVANCED_ETH_SIGN_DISABLED, {});
+      this.props.metrics.trackEvent(
+        MetaMetricsEvents.SETTINGS_ADVANCED_ETH_SIGN_DISABLED,
+        {},
+      );
     }
   };
 
@@ -552,4 +560,7 @@ const mapDispatchToProps = (dispatch) => ({
     dispatch(setShowCustomNonce(showCustomNonce)),
 });
 
-export default connect(mapStateToProps, mapDispatchToProps)(AdvancedSettings);
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps,
+)(withMetricsAwareness(AdvancedSettings));

app/components/Views/Settings/ExperimentalSettings/BlockaidIndicator/BlockaidIndicator.tsx

@@ -20,7 +20,6 @@ import Icon, {
   IconName,
   IconColor,
 } from '../../../../../component-library/components/Icons/Icon';
-import AnalyticsV2 from '../../../../../util/analyticsV2';
 import { MetaMetricsEvents } from '../../../../../core/Analytics';
 import Engine from '../../../../../core/Engine';
 import Routes from '../../../../../constants/navigation/Routes';
@@ -33,6 +32,7 @@ import { selectIsSecurityAlertsEnabled } from '../../../../../selectors/preferen
 
 // Internal dependencies
 import createStyles from './BlockaidIndicator.styles';
+import { useMetrics } from '../../../../../components/hooks/useMetrics';
 
 enum Status {
   Idle = 'IDLE',
@@ -41,6 +41,7 @@ enum Status {
 
 const BlockaidIndicator = ({ navigation }: Props) => {
   const dispatch = useDispatch();
+  const { trackEvent } = useMetrics();
   const { PreferencesController } = Engine.context;
   const styles = createStyles();
 
@@ -62,7 +63,7 @@ const BlockaidIndicator = ({ navigation }: Props) => {
         setFailureCount(failureCount + 1);
       }
       if (ppomInitialisationStatus === PPOMInitialisationStatus.SUCCESS) {
-        AnalyticsV2.trackEvent(
+        trackEvent(
           MetaMetricsEvents.SETTINGS_EXPERIMENTAL_SECURITY_ALERTS_ENABLED,
           {
             security_alerts_enabled: true,

app/components/Views/Settings/ExperimentalSettings/index.tsx

@@ -11,7 +11,6 @@ import Text, {
   TextColor,
 } from '../../../../component-library/components/Texts/Text';
 import { UpdatePPOMInitializationStatus } from '../../../../actions/experimental';
-import AnalyticsV2 from '../../../../util/analyticsV2';
 import { MetaMetricsEvents } from '../../../../core/Analytics';
 import { getNavigationOptionsTitle } from '../../../UI/Navbar';
 import SECURITY_ALERTS_TOGGLE_TEST_ID from './constants';
@@ -28,6 +27,7 @@ import Button, {
 } from '../../../../component-library/components/Buttons/Button';
 import Device from '../../../../../app/util/device';
 import { SES_URL } from '../../../../../app/constants/urls';
+import { useMetrics } from '../../../../components/hooks/useMetrics';
 
 const storage = new MMKV(); // id: mmkv.default
 
@@ -53,13 +53,14 @@ const ExperimentalSettings = ({ navigation, route }: Props) => {
   const isFullScreenModal = route?.params?.isFullScreenModal;
 
   const theme = useTheme();
+  const { trackEvent } = useMetrics();
   const { colors } = theme;
   const styles = createStyles(colors);
 
   const toggleSecurityAlertsEnabled = () => {
     if (securityAlertsEnabled) {
       PreferencesController?.setSecurityAlertsEnabled(false);
-      AnalyticsV2.trackEvent(
+      trackEvent(
         MetaMetricsEvents.SETTINGS_EXPERIMENTAL_SECURITY_ALERTS_ENABLED,
         {
           security_alerts_enabled: false,