Cherry-pick ab37660 (PR ##27543) to V12.4.0

app/scripts/controllers/preferences.js

@@ -291,6 +291,7 @@ export default class PreferencesController {
   }
   ///: END:ONLY_INCLUDE_IF
 
+  ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
   /**
    * Setter for the `watchEthereumAccountEnabled` property.
    *
@@ -302,6 +303,7 @@ export default class PreferencesController {
       watchEthereumAccountEnabled,
     });
   }
+  ///: END:ONLY_INCLUDE_IF
 
   /**
    * Setter for the `bitcoinSupportEnabled` property.

app/scripts/lib/snap-keyring/account-watcher-snap.ts

@@ -1,3 +1,4 @@
+// BEGIN:ONLY_INCLUDE_IF(build-flask)
 import { SnapId } from '@metamask/snaps-sdk';
 import AccountWatcherSnap from '@metamask/account-watcher/dist/preinstalled-snap.json';
 
@@ -6,3 +7,4 @@ export const ACCOUNT_WATCHER_SNAP_ID: SnapId =
 
 export const ACCOUNT_WATCHER_NAME: string =
   AccountWatcherSnap.manifest.proposedName;
+// END:ONLY_INCLUDE_IF

app/scripts/metamask-controller.js

@@ -3155,10 +3155,12 @@ export default class MetamaskController extends EventEmitter {
           preferencesController,
         ),
       ///: END:ONLY_INCLUDE_IF
+      ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
       setWatchEthereumAccountEnabled:
         preferencesController.setWatchEthereumAccountEnabled.bind(
           preferencesController,
         ),
+      ///: END:ONLY_INCLUDE_IF
       setBitcoinSupportEnabled:
         preferencesController.setBitcoinSupportEnabled.bind(
           preferencesController,

app/scripts/snaps/preinstalled-snaps.ts

@@ -1,15 +1,15 @@
 import type { PreinstalledSnap } from '@metamask/snaps-controllers';
 import MessageSigningSnap from '@metamask/message-signing-snap/dist/preinstalled-snap.json';
-import AccountWatcherSnap from '@metamask/account-watcher/dist/preinstalled-snap.json';
 ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
+import AccountWatcherSnap from '@metamask/account-watcher/dist/preinstalled-snap.json';
 import BitcoinWalletSnap from '@metamask/bitcoin-wallet-snap/dist/preinstalled-snap.json';
 ///: END:ONLY_INCLUDE_IF
 
 // The casts here are less than ideal but we expect the SnapController to validate the inputs.
 const PREINSTALLED_SNAPS = Object.freeze<PreinstalledSnap[]>([
   MessageSigningSnap as PreinstalledSnap,
-  AccountWatcherSnap as PreinstalledSnap,
   ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
+  AccountWatcherSnap as PreinstalledSnap,
   BitcoinWalletSnap as unknown as PreinstalledSnap,
   ///: END:ONLY_INCLUDE_IF
 ]);

shared/constants/metametrics.ts

@@ -627,7 +627,9 @@ export enum MetaMetricsEventName {
   WalletSetupCanceled = 'Wallet Setup Canceled',
   WalletSetupFailed = 'Wallet Setup Failed',
   WalletCreated = 'Wallet Created',
+  // BEGIN:ONLY_INCLUDE_IF(build-flask)
   WatchEthereumAccountsToggled = 'Watch Ethereum Accounts Toggled',
+  // END:ONLY_INCLUDE_IF
   ///: BEGIN:ONLY_INCLUDE_IF(build-mmi)
   DeeplinkClicked = 'Deeplink Clicked',
   ConnectCustodialAccountClicked = 'Connect Custodial Account Clicked',

ui/components/multichain/account-list-menu/account-list-menu.tsx

@@ -57,14 +57,14 @@ import {
   getIsAddSnapAccountEnabled,
   ///: END:ONLY_INCLUDE_IF
   ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
+  getIsWatchEthereumAccountEnabled,
   getIsBitcoinSupportEnabled,
   getIsBitcoinTestnetSupportEnabled,
   ///: END:ONLY_INCLUDE_IF
   getMetaMaskAccountsOrdered,
   getOriginOfCurrentTab,
   getSelectedInternalAccount,
   getUpdatedAndSortedAccounts,
-  getIsWatchEthereumAccountEnabled,
 } from '../../../selectors';
 import { setSelectedAccount } from '../../../store/actions';
 import {
@@ -82,6 +82,10 @@ import { getEnvironmentType } from '../../../../app/scripts/lib/util';
 import { ENVIRONMENT_TYPE_POPUP } from '../../../../shared/constants/app';
 import { getAccountLabel } from '../../../helpers/utils/accounts';
 ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
+import {
+  ACCOUNT_WATCHER_NAME,
+  ACCOUNT_WATCHER_SNAP_ID,
+} from '../../../../app/scripts/lib/snap-keyring/account-watcher-snap';
 import {
   hasCreatedBtcMainnetAccount,
   hasCreatedBtcTestnetAccount,
@@ -93,10 +97,6 @@ import {
   AccountConnections,
   MergedInternalAccount,
 } from '../../../selectors/selectors.types';
-import {
-  ACCOUNT_WATCHER_NAME,
-  ACCOUNT_WATCHER_SNAP_ID,
-} from '../../../../app/scripts/lib/snap-keyring/account-watcher-snap';
 import { HiddenAccountList } from './hidden-account-list';
 
 const ACTION_MODES = {
@@ -106,9 +106,9 @@ const ACTION_MODES = {
   MENU: 'menu',
   // Displays the add account form controls
   ADD: 'add',
+  ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
   // Displays the add account form controls (for watch-only account)
   ADD_WATCH_ONLY: 'add-watch-only',
-  ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
   // Displays the add account form controls (for bitcoin account)
   ADD_BITCOIN: 'add-bitcoin',
   // Same but for testnet
@@ -132,9 +132,9 @@ export const getActionTitle = (
   switch (actionMode) {
     case ACTION_MODES.ADD:
     case ACTION_MODES.MENU:
-    case ACTION_MODES.ADD_WATCH_ONLY:
       return t('addAccount');
     ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
+    case ACTION_MODES.ADD_WATCH_ONLY:
     case ACTION_MODES.ADD_BITCOIN:
       return t('addAccount');
     case ACTION_MODES.ADD_BITCOIN_TESTNET:
@@ -225,6 +225,7 @@ export const AccountListMenu = ({
   ///: BEGIN:ONLY_INCLUDE_IF(keyring-snaps)
   const addSnapAccountEnabled = useSelector(getIsAddSnapAccountEnabled);
   ///: END:ONLY_INCLUDE_IF
+  ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
   const isAddWatchEthereumAccountEnabled = useSelector(
     getIsWatchEthereumAccountEnabled,
   );
@@ -242,7 +243,7 @@ export const AccountListMenu = ({
     onClose();
     history.push(`/snaps/view/${encodeURIComponent(ACCOUNT_WATCHER_SNAP_ID)}`);
   }, [trackEvent, onClose, history]);
-  ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
+
   const bitcoinSupportEnabled = useSelector(getIsBitcoinSupportEnabled);
   const bitcoinTestnetSupportEnabled = useSelector(
     getIsBitcoinTestnetSupportEnabled,
@@ -544,19 +545,23 @@ export const AccountListMenu = ({
               </Box>
               ///: END:ONLY_INCLUDE_IF
             }
-            {isAddWatchEthereumAccountEnabled && (
-              <Box marginTop={4}>
-                <ButtonLink
-                  disabled={!isAddWatchEthereumAccountEnabled}
-                  size={ButtonLinkSize.Sm}
-                  startIconName={IconName.Eye}
-                  onClick={handleAddWatchAccount}
-                  data-testid="multichain-account-menu-popover-add-watch-only-account"
-                >
-                  {t('addEthereumWatchOnlyAccount')}
-                </ButtonLink>
-              </Box>
-            )}
+            {
+              ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
+              isAddWatchEthereumAccountEnabled && (
+                <Box marginTop={4}>
+                  <ButtonLink
+                    disabled={!isAddWatchEthereumAccountEnabled}
+                    size={ButtonLinkSize.Sm}
+                    startIconName={IconName.Eye}
+                    onClick={handleAddWatchAccount}
+                    data-testid="multichain-account-menu-popover-add-watch-only-account"
+                  >
+                    {t('addEthereumWatchOnlyAccount')}
+                  </ButtonLink>
+                </Box>
+              )
+              ///: END:ONLY_INCLUDE_IF
+            }
           </Box>
         ) : null}
         {actionMode === ACTION_MODES.LIST ? (

ui/pages/settings/experimental-tab/experimental-tab.component.tsx

@@ -263,6 +263,7 @@ export default class ExperimentalTab extends PureComponent<ExperimentalTabProps>
     });
   }
 
+  ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
   renderWatchAccountToggle() {
     const { t, trackEvent } = this.context;
     const { watchAccountEnabled, setWatchAccountEnabled } = this.props;
@@ -297,7 +298,6 @@ export default class ExperimentalTab extends PureComponent<ExperimentalTabProps>
     });
   }
 
-  ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
   // We're only setting the code fences here since
   // we should remove it for the feature release
   renderBitcoinSupport() {
@@ -385,7 +385,11 @@ export default class ExperimentalTab extends PureComponent<ExperimentalTabProps>
           this.renderKeyringSnapsToggle()
           ///: END:ONLY_INCLUDE_IF
         }
-        {this.renderWatchAccountToggle()}
+        {
+          ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
+          this.renderWatchAccountToggle()
+          ///: END:ONLY_INCLUDE_IF
+        }
         {
           ///: BEGIN:ONLY_INCLUDE_IF(build-flask)
           // We're only setting the code fences here since