Merge branch 'main' into fix/account-connect-origin-spoof

Author: joaoloureirop

.android.env.example

@@ -2,15 +2,3 @@ export MM_FOX_CODE="EXAMPLE_FOX_CODE"
 export MM_BRANCH_KEY_TEST=
 export MM_BRANCH_KEY_LIVE=
 export METAMASK_BUILD_TYPE=
-# Firebase
-export FCM_CONFIG_API_KEY=
-export FCM_CONFIG_AUTH_DOMAIN=
-export FCM_CONFIG_PROJECT_ID=
-export FCM_CONFIG_STORAGE_BUCKET=
-export FCM_CONFIG_MESSAGING_SENDER_ID=
-export FCM_CONFIG_APP_ID=
-export GOOGLE_SERVICES_B64_ANDROID=
-#Notifications Feature Announcements
-export FEATURES_ANNOUNCEMENTS_ACCESS_TOKEN=
-export FEATURES_ANNOUNCEMENTS_SPACE_ID=
-

.ios.env.example

@@ -1,14 +1,3 @@
 MM_FOX_CODE = EXAMPLE_FOX_CODE
 MM_BRANCH_KEY_TEST =
 MM_BRANCH_KEY_LIVE =
-# Firebase
-FCM_CONFIG_API_KEY=
-FCM_CONFIG_AUTH_DOMAIN=
-FCM_CONFIG_PROJECT_ID=
-FCM_CONFIG_STORAGE_BUCKET=
-FCM_CONFIG_MESSAGING_SENDER_ID=
-FCM_CONFIG_APP_ID=
-GOOGLE_SERVICES_B64_IOS=
-#Notifications Feature Announcements
-FEATURES_ANNOUNCEMENTS_ACCESS_TOKEN=
-FEATURES_ANNOUNCEMENTS_SPACE_ID=

.js.env.example

@@ -18,7 +18,11 @@ export MM_FOX_CODE="EXAMPLE_FOX_CODE"
 
 export MM_INFURA_PROJECT_ID="null"
 export IGNORE_BOXLOGS_DEVELOPMENT="false"
+
+# Sentry.init dsn value
 export MM_SENTRY_DSN=""
+# Sentry.init debug option is set to true in dev environments by default. Set this to "false" to turn it off
+export SENTRY_DEBUG_DEV="false"
 # Determines if Sentry will auto upload source maps and debug files. Disabled by default
 export SENTRY_DISABLE_AUTO_UPLOAD="true"
 
@@ -79,12 +83,6 @@ export PORTFOLIO_VIEW="true"
 # Temporary mechanism to enable security alerts API prior to release.
 export MM_SECURITY_ALERTS_API_ENABLED="true"
 # Firebase
-export FCM_CONFIG_API_KEY=""
-export FCM_CONFIG_AUTH_DOMAIN=""
-export FCM_CONFIG_PROJECT_ID=""
-export FCM_CONFIG_STORAGE_BUCKET=""
-export FCM_CONFIG_MESSAGING_SENDER_ID=""
-export FCM_CONFIG_APP_ID=""
 export GOOGLE_SERVICES_B64_ANDROID=""
 export GOOGLE_SERVICES_B64_IOS=""
 # Notifications Feature Announcements

app/actions/notification/helpers/index.ts

@@ -2,15 +2,14 @@ import { getErrorMessage } from '@metamask/utils';
 
 import { notificationsErrors } from '../constants';
 import Engine from '../../../core/Engine';
-import {
-  Notification,
-  mmStorage,
-  getAllUUIDs,
-} from '../../../util/notifications';
-import type { UserStorage } from '@metamask/notification-services-controller/notification-services';
+import { mmStorage, getAllUUIDs } from '../../../util/notifications';
+import type {
+  UserStorage,
+  INotification,
+} from '@metamask/notification-services-controller/notification-services';
 
 export type MarkAsReadNotificationsParam = Pick<
-  Notification,
+  INotification,
   'id' | 'type' | 'isRead'
 >[];
 

app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentage.stories.tsx

@@ -1,11 +1,9 @@
 import React from 'react';
 import { Provider } from 'react-redux';
-import AggregatedPercentage, {
-  AggregatedPercentageProps,
-} from './AggregatedPercentage';
+import AggregatedPercentage from './AggregatedPercentage';
 import { createStore } from 'redux';
 import initialBackgroundState from '../../../../util/test/initial-background-state.json';
-
+import { AggregatedPercentageProps } from './AggregatedPercentage.types';
 const mockInitialState = {
   wizard: {
     step: 1,

app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentage.tsx

@@ -15,13 +15,7 @@ import {
   FORMATTED_PERCENTAGE_TEST_ID,
 } from './AggregatedPercentage.constants';
 import { DECIMALS_TO_SHOW } from '../../../../components/UI/Tokens/constants';
-
-export interface AggregatedPercentageProps {
-  ethFiat: number;
-  tokenFiat: number;
-  tokenFiat1dAgo: number;
-  ethFiat1dAgo: number;
-}
+import { AggregatedPercentageProps } from './AggregatedPercentage.types';
 
 const isValidAmount = (amount: number | null | undefined): boolean =>
   amount !== null && amount !== undefined && !Number.isNaN(amount);
@@ -32,13 +26,7 @@ const AggregatedPercentage = ({
   tokenFiat1dAgo,
   ethFiat1dAgo,
   privacyMode = false,
-}: {
-  ethFiat: number;
-  tokenFiat: number;
-  tokenFiat1dAgo: number;
-  ethFiat1dAgo: number;
-  privacyMode?: boolean;
-}) => {
+}: AggregatedPercentageProps) => {
   const { styles } = useStyles(styleSheet, {});
 
   const currentCurrency = useSelector(selectCurrentCurrency);

app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentage.types.ts

@@ -0,0 +1,7 @@
+export interface AggregatedPercentageProps {
+  ethFiat: number;
+  tokenFiat: number;
+  tokenFiat1dAgo: number;
+  ethFiat1dAgo: number;
+  privacyMode?: boolean;
+}

app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentageCrossChains.tsx

@@ -17,13 +17,7 @@ import {
   TokensWithBalances,
 } from '../../../../components/hooks/useGetFormattedTokensPerChain';
 import { getFormattedAmountChange, getPercentageTextColor } from './utils';
-
-export interface AggregatedPercentageProps {
-  ethFiat: number;
-  tokenFiat: number;
-  tokenFiat1dAgo: number;
-  ethFiat1dAgo: number;
-}
+import { AggregatedPercentageCrossChainsProps } from './AggregatedPercentageCrossChains.types';
 
 export const getCalculatedTokenAmount1dAgo = (
   tokenFiatBalance: number,
@@ -40,16 +34,7 @@ const AggregatedPercentageCrossChains = ({
   privacyMode = false,
   totalFiatCrossChains,
   tokenFiatBalancesCrossChains,
-}: {
-  privacyMode?: boolean;
-  totalFiatCrossChains: number;
-  tokenFiatBalancesCrossChains: {
-    chainId: string;
-    nativeFiatValue: number;
-    tokenFiatBalances: number[];
-    tokensWithBalances: TokensWithBalances[];
-  }[];
-}) => {
+}: AggregatedPercentageCrossChainsProps) => {
   const crossChainMarketData: MarketDataMapping = useSelector(
     selectTokenMarketData,
   );

app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentageCrossChains.types.tsx

@@ -0,0 +1,12 @@
+import { TokensWithBalances } from '../../../../components/hooks/useGetFormattedTokensPerChain';
+
+export interface AggregatedPercentageCrossChainsProps {
+  privacyMode?: boolean;
+  totalFiatCrossChains: number;
+  tokenFiatBalancesCrossChains: {
+    chainId: string;
+    nativeFiatValue: number;
+    tokenFiatBalances: number[];
+    tokensWithBalances: TokensWithBalances[];
+  }[];
+}

app/components/Approvals/TransactionApproval/TransactionApproval.test.tsx

@@ -7,7 +7,15 @@ import {
   TransactionApproval,
   TransactionModalType,
 } from './TransactionApproval';
-
+import { useConfirmationRedesignEnabled } from '../../Views/confirmations/hooks/useConfirmationRedesignEnabled';
+import renderWithProvider from '../../../util/test/renderWithProvider';
+
+jest.mock(
+  '../../Views/confirmations/hooks/useConfirmationRedesignEnabled',
+  () => ({
+    useConfirmationRedesignEnabled: jest.fn(),
+  }),
+);
 jest.mock('../../Views/confirmations/hooks/useApprovalRequest');
 
 jest.mock('../../UI/QRHardware/withQRHardwareAwareness', () =>
@@ -30,6 +38,13 @@ const mockApprovalRequest = (approvalRequest?: ApprovalRequest<any>) => {
 describe('TransactionApproval', () => {
   beforeEach(() => {
     jest.resetAllMocks();
+    (
+      useConfirmationRedesignEnabled as jest.MockedFn<
+        typeof useConfirmationRedesignEnabled
+      >
+    ).mockReturnValue({
+      isRedesignedEnabled: false,
+    });
   });
 
   it('renders approval component if transaction type is dapp', () => {
@@ -79,9 +94,9 @@ describe('TransactionApproval', () => {
   it('returns null if no approval request', () => {
     mockApprovalRequest(undefined);
 
-    const wrapper = shallow(<TransactionApproval />);
+    const { toJSON } = renderWithProvider(<TransactionApproval />, {});
 
-    expect(wrapper).toMatchSnapshot();
+    expect(toJSON()).toMatchInlineSnapshot(`null`);
   });
 
   it('returns null if incorrect approval request type', () => {
@@ -91,9 +106,9 @@ describe('TransactionApproval', () => {
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } as any);
 
-    const wrapper = shallow(<TransactionApproval />);
+    const { toJSON } = renderWithProvider(<TransactionApproval />, {});
 
-    expect(wrapper).toMatchSnapshot();
+    expect(toJSON()).toMatchInlineSnapshot(`null`);
   });
 
   it('returns null if incorrect transaction type', () => {
@@ -103,8 +118,34 @@ describe('TransactionApproval', () => {
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } as any);
 
-    const wrapper = shallow(<TransactionApproval transactionType="invalid" />);
+    const { toJSON } = renderWithProvider(
+      <TransactionApproval transactionType="invalid" />,
+      {},
+    );
 
-    expect(wrapper).toMatchSnapshot();
+    expect(toJSON()).toMatchInlineSnapshot(`null`);
+  });
+
+  it('returns null if redesign is enabled', () => {
+    mockApprovalRequest({
+      type: ApprovalTypes.TRANSACTION,
+      // TODO: Replace "any" with type
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    } as any);
+
+    (
+      useConfirmationRedesignEnabled as jest.MockedFn<
+        typeof useConfirmationRedesignEnabled
+      >
+    ).mockReturnValue({
+      isRedesignedEnabled: true,
+    });
+
+    const { toJSON } = renderWithProvider(
+      <TransactionApproval transactionType={TransactionModalType.Dapp} />,
+      {},
+    );
+
+    expect(toJSON()).toMatchInlineSnapshot(`null`);
   });
 });

app/components/Approvals/TransactionApproval/TransactionApproval.tsx

@@ -6,6 +6,7 @@ import Approve from '../../Views/confirmations/ApproveView/Approve';
 import QRSigningModal from '../../UI/QRHardware/QRSigningModal';
 import withQRHardwareAwareness from '../../UI/QRHardware/withQRHardwareAwareness';
 import { IQRState } from '../../UI/QRHardware/types';
+import { useConfirmationRedesignEnabled } from '../../Views/confirmations/hooks/useConfirmationRedesignEnabled';
 
 export enum TransactionModalType {
   Transaction = 'transaction',
@@ -24,6 +25,7 @@ export interface TransactionApprovalProps {
 
 const TransactionApprovalInternal = (props: TransactionApprovalProps) => {
   const { approvalRequest } = useApprovalRequest();
+  const { isRedesignedEnabled } = useConfirmationRedesignEnabled();
   const [modalVisible, setModalVisible] = useState(false);
   const { onComplete: propsOnComplete } = props;
 
@@ -32,7 +34,10 @@ const TransactionApprovalInternal = (props: TransactionApprovalProps) => {
     propsOnComplete();
   }, [propsOnComplete]);
 
-  if (approvalRequest?.type !== ApprovalTypes.TRANSACTION && !modalVisible) {
+  if (
+    (approvalRequest?.type !== ApprovalTypes.TRANSACTION && !modalVisible) ||
+    isRedesignedEnabled
+  ) {
     return null;
   }
 

app/components/Approvals/TransactionApproval/__snapshots__/TransactionApproval.test.tsx.snap

@@ -27,9 +27,3 @@ exports[`TransactionApproval renders approve component if transaction type is tr
   modalVisible={true}
 />
 `;
-
-exports[`TransactionApproval returns null if incorrect approval request type 1`] = `""`;
-
-exports[`TransactionApproval returns null if incorrect transaction type 1`] = `""`;
-
-exports[`TransactionApproval returns null if no approval request 1`] = `""`;