Merge branch 'develop' into devdeps-lavamoat-allow-scripts

CHANGELOG.md

@@ -6,6 +6,30 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [10.34.0]
+### Added
+- Add a security quiz to the SRP reveal ([#19283](https://github.com/MetaMask/metamask-extension/pull/19283))
+- [FLASK] Add Snaps keyring and new snap accounts related pages ([#19710](https://github.com/MetaMask/metamask-extension/pull/19710))
+
+
+### Changed
+- Decrease boldness of text in some labels ([#19731](https://github.com/MetaMask/metamask-extension/pull/19731))
+
+### Fixed
+- Fix design inconsistencies in the connect flow ([#19800](https://github.com/MetaMask/metamask-extension/pull/19800))
+- Fix connection issues on some dapps, and ensure that `eth_requestAccount` returns accounts when opening multiple tabs for the same dapp ([#19727](https://github.com/MetaMask/metamask-extension/pull/19727))
+- Fix UI bugs in contacts page ([#19646](https://github.com/MetaMask/metamask-extension/pull/19646))
+- Ensure correct logo shown on Linea ([#19717](https://github.com/MetaMask/metamask-extension/pull/19717))
+- Fix the autolock field in settings on firefox ([#19653](https://github.com/MetaMask/metamask-extension/pull/19653))
+- Prevent duplicate account names that only differ by letter casing ([#19616](https://github.com/MetaMask/metamask-extension/pull/19616))
+- Ensure token details stay within asset dropdown border ([#19626](https://github.com/MetaMask/metamask-extension/pull/19626))
+- Prevent rounded corners in account menu ([#19615](https://github.com/MetaMask/metamask-extension/pull/19615))
+- Ensure network changes before the user accepts a wallet_watchAsset request add the NFT to pre-change chain ID and address ([#19629](https://github.com/MetaMask/metamask-extension/pull/19629))
+- Fix performance degradations noticable on Firefox builds ([#19993](https://github.com/MetaMask/metamask-extension/pull/19993))
+- Fix copy to clipboard of public address, so that it is only cleared from the clipboard after 60 seconds ([#19948](https://github.com/MetaMask/metamask-extension/pull/19948))
+- Fix overlapping text, in some language, in home screen buttons ([#19920](https://github.com/MetaMask/metamask-extension/pull/19920))
+
+
 ## [10.33.1]
 ### Fixed
 - Fix to bug causing users to see an infinite spinner when signing typed messages. ([#19894](https://github.com/MetaMask/metamask-extension/pull/19894))
@@ -3829,7 +3853,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Uncategorized
 - Added the ability to restore accounts from seed words.
 
-[Unreleased]: https://github.com/MetaMask/metamask-extension/compare/v10.33.1...HEAD
+[Unreleased]: https://github.com/MetaMask/metamask-extension/compare/v10.34.0...HEAD
+[10.34.0]: https://github.com/MetaMask/metamask-extension/compare/v10.33.1...v10.34.0
 [10.33.1]: https://github.com/MetaMask/metamask-extension/compare/v10.33.0...v10.33.1
 [10.33.0]: https://github.com/MetaMask/metamask-extension/compare/v10.32.0...v10.33.0
 [10.32.0]: https://github.com/MetaMask/metamask-extension/compare/v10.31.1...v10.32.0

package.json

@@ -1,6 +1,6 @@
 {
   "name": "metamask-crx",
-  "version": "10.33.1",
+  "version": "10.34.0",
   "private": true,
   "repository": {
     "type": "git",

shared/constants/metametrics.ts

@@ -583,10 +583,19 @@ export enum MetaMetricsEventName {
   WalletSetupFailed = 'Wallet Setup Failed',
   WalletCreated = 'Wallet Created',
   ///: BEGIN:ONLY_INCLUDE_IN(build-mmi)
-  UserClickedDeepLink = 'User Clicked Deeplink',
-  UserClickedConnectCustodialAccount = 'Clicked Connect Custodial Account',
-  UserClickedPortfolioButton = 'Clicked Portfolio Button',
-  UserClickedCompliance = 'Clicked Compliance',
+  DeeplinkClicked = 'Deeplink Clicked',
+  ConnectCustodialAccountClicked = 'Connect Custodial Account Clicked',
+  MMIPortfolioButtonClicked = 'MMI Portfolio Button Clicked',
+  StakeButtonClicked = 'Stake Button Clicked',
+  ComplianceButtonClicked = 'Compliance Button Clicked',
+  RefreshTokenListClicked = 'Refresh Token List Clicked',
+  SignatureDeeplinkDisplayed = 'Signature Deeplink Displayed',
+  InstitutionalFeatureConnected = 'Institutional Feature Connected',
+  CustodianSelected = 'Custodian Selected',
+  CustodianConnected = 'Custodian Connected',
+  CustodianConnectionCanceled = 'Custodian Connection Canceled',
+  CustodianConnectionFailed = 'Custodian Connection Failed',
+  CustodialAccountsConnected = 'Custodial Accounts Connected',
   ///: END:ONLY_INCLUDE_IN
   AccountDetailMenuOpened = 'Account Details Menu Opened',
   BlockExplorerLinkClicked = 'Block Explorer Clicked',

ui/components/app/signature-request/signature-request.component.js

@@ -11,7 +11,12 @@ import {
   shortenAddress,
   ///: END:ONLY_INCLUDE_IN
 } from '../../../helpers/utils/util';
-import { MetaMetricsEventCategory } from '../../../../shared/constants/metametrics';
+import {
+  MetaMetricsEventCategory,
+  ///: BEGIN:ONLY_INCLUDE_IN(build-mmi)
+  MetaMetricsEventName,
+  ///: END:ONLY_INCLUDE_IN
+} from '../../../../shared/constants/metametrics';
 import SiteOrigin from '../../ui/site-origin';
 import Button from '../../ui/button';
 import ContractDetailsModal from '../modals/contract-details-modal/contract-details-modal';
@@ -121,8 +126,8 @@ export default class SignatureRequest extends PureComponent {
         onDeepLinkFetched: () => undefined,
         onDeepLinkShown: () => {
           this.context.trackEvent({
-            category: 'MMI',
-            event: 'Show deeplink for signature',
+            category: MetaMetricsEventCategory.MMI,
+            event: MetaMetricsEventName.SignatureDeeplinkDisplayed,
           });
         },
       });

ui/components/app/transaction-list-item/transaction-list-item.component.js

@@ -51,6 +51,7 @@ import {
 import {
   checkNetworkAndAccountSupports1559,
   getCurrentNetwork,
+  getTestNetworkBackgroundColor,
 } from '../../../selectors';
 import { isLegacyTransaction } from '../../../helpers/utils/transactions.util';
 import { formatDateWithYearContext } from '../../../helpers/utils/util';
@@ -77,6 +78,7 @@ function TransactionListItemInner({
   const [showRetryEditGasPopover, setShowRetryEditGasPopover] = useState(false);
   const { supportsEIP1559 } = useGasFeeContext();
   const { openModal } = useTransactionModalContext();
+  const testNetworkBackgroundColor = useSelector(getTestNetworkBackgroundColor);
 
   const {
     initialTransaction: { id },
@@ -276,6 +278,7 @@ function TransactionListItemInner({
                   src={currentChain?.rpcPrefs?.imageUrl}
                   borderWidth={1}
                   borderColor={BackgroundColor.backgroundDefault}
+                  backgroundColor={testNetworkBackgroundColor}
                 />
               }
             >

ui/components/app/wallet-overview/eth-overview.js

@@ -73,15 +73,15 @@ const EthOverview = ({ className, showAddress }) => {
 
   const portfolioEvent = () => {
     trackEvent({
-      category: 'Navigation',
-      event: 'Clicked Portfolio Button',
+      category: MetaMetricsEventCategory.Navigation,
+      event: MetaMetricsEventName.MMIPortfolioButtonClicked,
     });
   };
 
   const stakingEvent = () => {
     trackEvent({
-      category: 'Navigation',
-      event: 'Clicked Stake Button',
+      category: MetaMetricsEventCategory.Navigation,
+      event: MetaMetricsEventName.MMIPortfolioButtonClicked,
     });
   };
 

ui/components/institutional/compliance-details/__snapshots__/compliance-details.test.js.snap

@@ -9,12 +9,12 @@ exports[`ComplianceDetails should render correctly 1`] = `
       class="mm-box compliance-details__row mm-box--padding-top-4 mm-box--padding-bottom-4 mm-box--display-flex mm-box--flex-direction-column mm-box--justify-content-center mm-box--height-2/3"
     >
       <p
-        class="box mm-text mm-text--body-md box--flex-direction-row box--color-text-default"
+        class="mm-box mm-text mm-text--body-md mm-box--color-text-default"
       >
         Address
       </p>
       <p
-        class="box mm-text mm-text--body-xs box--flex-direction-row box--color-text-default"
+        class="mm-box mm-text mm-text--body-xs mm-box--color-text-default"
       >
         0xAddress
       </p>
@@ -26,7 +26,7 @@ exports[`ComplianceDetails should render correctly 1`] = `
         class="mm-box mm-box--margin-bottom-1 mm-box--display-flex mm-box--align-items-center mm-box--color-text-alternative"
       >
         <p
-          class="box mm-text mm-text--body-md box--margin-right-2 box--flex-direction-row box--color-text-default"
+          class="mm-box mm-text mm-text--body-md mm-box--margin-right-2 mm-box--color-text-default"
         >
           Risk rating
         </p>
@@ -60,7 +60,7 @@ exports[`ComplianceDetails should render correctly 1`] = `
         class="mm-box compliance-row__column-risk compliance-row__column-risk--green"
       >
         <p
-          class="box mm-text mm-text--body-md box--flex-direction-row box--color-text-default"
+          class="mm-box mm-text mm-text--body-md mm-box--color-text-default"
         >
           low
         </p>
@@ -73,7 +73,7 @@ exports[`ComplianceDetails should render correctly 1`] = `
         class="mm-box mm-box--display-flex mm-box--align-items-center mm-box--color-text-alternative"
       >
         <p
-          class="box mm-text mm-text--body-md box--margin-right-2 box--flex-direction-row box--color-text-default"
+          class="mm-box mm-text mm-text--body-md mm-box--margin-right-2 mm-box--color-text-default"
         >
           Report last run
         </p>
@@ -104,7 +104,7 @@ exports[`ComplianceDetails should render correctly 1`] = `
         </div>
       </div>
       <p
-        class="box mm-text mm-text--body-md box--flex-direction-row box--color-text-default"
+        class="mm-box mm-text mm-text--body-md mm-box--color-text-default"
       />
     </div>
     <div

ui/components/institutional/compliance-details/compliance-details.js

@@ -11,8 +11,8 @@ import {
   getComplianceTenantSubdomain,
 } from '../../../ducks/institutional/institutional';
 import { formatDate } from '../../../helpers/utils/util';
-import { Box } from '../../component-library';
-import { Text } from '../../component-library/text/deprecated';
+import { Box, Text } from '../../component-library';
+
 import {
   TextColor,
   TextVariant,

ui/components/institutional/compliance-modal/__snapshots__/compliance-modal.test.js.snap

@@ -9,13 +9,13 @@ exports[`ComplianceModal should render the correct content 1`] = `
       class="modal-container__content"
     >
       <div
-        class="box box--flex-direction-row"
+        class="mm-box"
       >
         <header
-          class="box box--display-flex box--flex-direction-row box--justify-content-space-between"
+          class="mm-box mm-box--display-flex mm-box--justify-content-space-between"
         >
           <div
-            class="box box--display-flex box--flex-direction-row box--justify-content-flex-start box--align-items-center"
+            class="mm-box mm-box--display-flex mm-box--justify-content-flex-start mm-box--align-items-center"
           >
             <img
               alt="Codefi Compliance"
@@ -24,7 +24,7 @@ exports[`ComplianceModal should render the correct content 1`] = `
               width="32"
             />
             <h4
-              class="box mm-text mm-text--body-md box--margin-left-2 box--flex-direction-row box--color-text-default"
+              class="mm-box mm-text mm-text--body-md mm-box--margin-left-2 mm-box--color-text-default"
             >
               [codefiCompliance]
             </h4>
@@ -41,18 +41,18 @@ exports[`ComplianceModal should render the correct content 1`] = `
           </button>
         </header>
         <p
-          class="box mm-text mm-text--body-md box--padding-bottom-3 box--flex-direction-row box--color-text-alternative"
+          class="mm-box mm-text mm-text--body-md mm-box--padding-bottom-3 mm-box--color-text-alternative"
           data-testid="compliance-info"
         >
           [complianceBlurb0]
         </p>
         <p
-          class="box mm-text mm-text--body-md box--padding-bottom-3 box--flex-direction-row box--color-text-alternative"
+          class="mm-box mm-text mm-text--body-md mm-box--padding-bottom-3 mm-box--color-text-alternative"
         >
           [complianceBlurb1]
         </p>
         <p
-          class="box mm-text mm-text--body-md box--padding-bottom-3 box--flex-direction-row box--color-text-alternative"
+          class="mm-box mm-text mm-text--body-md mm-box--padding-bottom-3 mm-box--color-text-alternative"
         >
           [complianceBlurpStep0]
         </p>

ui/components/institutional/compliance-modal/compliance-modal.js

@@ -3,14 +3,20 @@ import { useDispatch } from 'react-redux';
 import { useI18nContext } from '../../../hooks/useI18nContext';
 import { hideModal } from '../../../store/actions';
 import Modal from '../../app/modal';
-import Box from '../../ui/box';
-import { ButtonIcon, IconSize, IconName } from '../../component-library';
-import { Text } from '../../component-library/text/deprecated';
+
+import {
+  ButtonIcon,
+  IconSize,
+  IconName,
+  Text,
+  Box,
+} from '../../component-library';
+
 import {
   AlignItems,
   JustifyContent,
   TextColor,
-  DISPLAY,
+  Display,
 } from '../../../helpers/constants/design-system';
 
 const ComplianceModal = () => {
@@ -35,11 +41,11 @@ const ComplianceModal = () => {
       <Box>
         <Box
           as="header"
-          display={DISPLAY.FLEX}
+          display={Display.Flex}
           justifyContent={JustifyContent.spaceBetween}
         >
           <Box
-            display={DISPLAY.FLEX}
+            display={Display.Flex}
             justifyContent={JustifyContent.flexStart}
             alignItems={AlignItems.center}
           >

ui/components/institutional/compliance-settings/__snapshots__/compliance-settings.test.js.snap

@@ -3,15 +3,15 @@
 exports[`Compliance Settings shows disconnect when Compliance is activated 1`] = `
 <div>
   <div
-    class="box box--flex-direction-row"
+    class="mm-box"
   >
     <h6
-      class="box mm-text institutional-feature__content mm-text--body-sm box--flex-direction-row box--color-text-default"
+      class="mm-box mm-text institutional-feature__content mm-text--body-sm mm-box--color-text-default"
     >
       Change your settings or view reports by opening up Codefi Compliance or disconnect below.
     </h6>
     <div
-      class="box institutional-feature__footer box--padding-4 box--sm:padding-6 box--flex-direction-row box--border-style-solid box--border-color-border-muted box--border-width-1"
+      class="mm-box institutional-feature__footer mm-box--padding-4 mm-box--sm:padding-6 mm-box--border-style-solid mm-box--border-color-border-muted mm-box--border-width-1"
     >
       <button
         class="mm-box mm-text mm-button-base mm-button-base--size-lg mm-button-primary mm-text--body-md-medium mm-box--padding-right-4 mm-box--padding-left-4 mm-box--display-inline-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-primary-inverse mm-box--background-color-primary-default mm-box--rounded-pill"
@@ -33,25 +33,25 @@ exports[`Compliance Settings shows disconnect when Compliance is activated 1`] =
 exports[`Compliance Settings shows start btn when Compliance its not activated 1`] = `
 <div>
   <div
-    class="box box--sm:padding-6 box--flex-direction-row box--color-text-alternative"
+    class="mm-box mm-box--padding-0 mm-box--sm:padding-6 mm-box--color-text-alternative"
     data-testid="institutional-content"
   >
     <div
-      class="box institutional-feature__content box--flex-direction-row"
+      class="mm-box institutional-feature__content"
       variant="body-sm"
     >
       <p
-        class="box mm-text mm-text--body-md box--padding-bottom-3 box--flex-direction-row box--color-text-default"
+        class="mm-box mm-text mm-text--body-md mm-box--padding-bottom-3 mm-box--color-text-default"
       >
         DeFi raises AML/CFT risk for institutions, given the decentralised pools and pseudonymous counterparties.
       </p>
       <p
-        class="box mm-text mm-text--body-md box--padding-bottom-3 box--flex-direction-row box--color-text-default"
+        class="mm-box mm-text mm-text--body-md mm-box--padding-bottom-3 mm-box--color-text-default"
       >
         Codefi Compliance is the only product capable of running AML/CFT analysis on DeFi pools. This allows you to identify and avoid pools and counterparties that fail your risk setting.
       </p>
       <p
-        class="box mm-text mm-text--body-md box--padding-bottom-3 box--flex-direction-row box--color-text-default"
+        class="mm-box mm-text mm-text--body-md mm-box--padding-bottom-3 mm-box--color-text-default"
       >
         Steps to enable AML/CFT Compliance:
       </p>
@@ -74,10 +74,10 @@ exports[`Compliance Settings shows start btn when Compliance its not activated 1
       </ol>
     </div>
     <div
-      class="box box--display-flex box--flex-direction-row box--justify-content-center"
+      class="mm-box mm-box--display-flex mm-box--flex-direction-row mm-box--justify-content-center"
     >
       <div
-        class="box institutional-feature__footer box--padding-4 box--sm:padding-6 box--flex-direction-row box--border-style-solid box--border-color-border-muted box--border-width-1"
+        class="mm-box institutional-feature__footer mm-box--padding-4 mm-box--sm:padding-6 mm-box--border-style-solid mm-box--border-color-border-muted mm-box--border-width-1"
       >
         <button
           class="mm-box mm-text mm-button-base mm-button-base--size-lg mm-button-link mm-text--body-md-medium mm-box--padding-right-0 mm-box--padding-left-0 mm-box--display-inline-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-primary-default mm-box--background-color-transparent"

ui/components/institutional/compliance-settings/compliance-settings.js

@@ -2,18 +2,22 @@ import React, { useContext } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import {
   JustifyContent,
-  DISPLAY,
+  Display,
   TextColor,
-  FLEX_DIRECTION,
+  FlexDirection,
   TextVariant,
   BorderStyle,
   BorderColor,
 } from '../../../helpers/constants/design-system';
 import { I18nContext } from '../../../contexts/i18n';
 import { mmiActionsFactory } from '../../../store/institutional/institution-background';
-import { Button, BUTTON_VARIANT, BUTTON_SIZES } from '../../component-library';
-import { Text } from '../../component-library/text/deprecated';
-import Box from '../../ui/box';
+import {
+  Button,
+  BUTTON_VARIANT,
+  BUTTON_SIZES,
+  Text,
+  Box,
+} from '../../component-library';
 
 const ComplianceSettings = () => {
   const t = useContext(I18nContext);
@@ -89,8 +93,8 @@ const ComplianceSettings = () => {
         </ol>
       </Box>
       <Box
-        display={DISPLAY.FLEX}
-        flexDirection={FLEX_DIRECTION.ROW}
+        display={Display.Flex}
+        flexDirection={FlexDirection.Row}
         justifyContent={JustifyContent.center}
       >
         <Box