From b6959e279d09cbb4651b665c4e384fc1dd7ff92b Mon Sep 17 00:00:00 2001 From: Jyoti Puri Date: Wed, 20 Nov 2024 15:24:17 +0530 Subject: [PATCH 01/12] Add alert when selected account is different from signing account in confirmation --- app/_locales/en/messages.json | 9 + .../info/__snapshots__/info.test.tsx.snap | 375 +++++++++++++++ .../__snapshots__/approve.test.tsx.snap | 75 +++ .../approve-details/approve-details.tsx | 2 + .../approve/revoke-details/revoke-details.tsx | 6 +- .../base-transaction-info.test.tsx.snap | 75 +++ .../__snapshots__/personal-sign.test.tsx.snap | 150 ++++++ .../info/personal-sign/personal-sign.tsx | 16 +- .../set-approval-for-all-info.test.tsx.snap | 75 +++ .../transaction-details.test.tsx.snap | 75 +++ .../transaction-details.tsx | 24 + .../transaction-flow-section.test.tsx.snap | 156 +++++- .../transaction-flow-section.tsx | 39 +- .../__snapshots__/typed-sign-v1.test.tsx.snap | 75 +++ .../info/typed-sign-v1/typed-sign-v1.tsx | 9 + .../__snapshots__/typed-sign.test.tsx.snap | 375 +++++++++++++++ .../confirm/info/typed-sign/typed-sign.tsx | 8 + .../__snapshots__/confirm.test.tsx.snap | 450 ++++++++++++++++++ .../hooks/alerts/useSelectedAccountAlerts.ts | 42 ++ .../hooks/useConfirmationAlerts.ts | 3 + 20 files changed, 1997 insertions(+), 42 deletions(-) create mode 100644 ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.ts diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 74e7d745cae7..ef5439cbe758 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -416,6 +416,12 @@ "alertMessageAddressMismatchWarning": { "message": "Attackers sometimes mimic sites by making small changes to the site address. Make sure you're interacting with the intended site before you continue." }, + "selectedAccountMismatch": { + "message": "Different account selected" + }, + "alertSelectedAccountWarning": { + "message": "This request is for a different account than the one selected in your wallet. To use another account, connect it to the site." + }, "alertMessageChangeInSimulationResults": { "message": "Estimated changes for this transaction have been updated. Review them closely before proceeding." }, @@ -4504,6 +4510,9 @@ "requestFrom": { "message": "Request from" }, + "signingAccount": { + "message": "Signing Account" + }, "requestFromInfo": { "message": "This is the site asking for your signature." }, diff --git a/ui/pages/confirmations/components/confirm/info/__snapshots__/info.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/__snapshots__/info.test.tsx.snap index f0c3a5183789..ef6563e03bdb 100644 --- a/ui/pages/confirmations/components/confirm/info/__snapshots__/info.test.tsx.snap +++ b/ui/pages/confirmations/components/confirm/info/__snapshots__/info.test.tsx.snap @@ -50,6 +50,81 @@ exports[`Info renders info section for approve request 1`] = `

+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x2e0D7...5d09B +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x2e0D7...5d09B +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ Test Account +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x2e0D7...5d09B +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ Test Account +

+
+
+
renders component for approve request 1`] = `

+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x2e0D7...5d09B +

+
+
+
+ {showAdvancedDetails && ( <> diff --git a/ui/pages/confirmations/components/confirm/info/approve/revoke-details/revoke-details.tsx b/ui/pages/confirmations/components/confirm/info/approve/revoke-details/revoke-details.tsx index 49bf5e7724e1..6da55fea5acf 100644 --- a/ui/pages/confirmations/components/confirm/info/approve/revoke-details/revoke-details.tsx +++ b/ui/pages/confirmations/components/confirm/info/approve/revoke-details/revoke-details.tsx @@ -1,11 +1,15 @@ import React from 'react'; import { ConfirmInfoSection } from '../../../../../../../components/app/confirm/info/row/section'; -import { OriginRow } from '../../shared/transaction-details/transaction-details'; +import { + OriginRow, + SigningInWithRow, +} from '../../shared/transaction-details/transaction-details'; export const RevokeDetails = () => { return ( + ); }; diff --git a/ui/pages/confirmations/components/confirm/info/base-transaction-info/__snapshots__/base-transaction-info.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/base-transaction-info/__snapshots__/base-transaction-info.test.tsx.snap index 47d28a0ba29d..d58cb2a1ae56 100644 --- a/ui/pages/confirmations/components/confirm/info/base-transaction-info/__snapshots__/base-transaction-info.test.tsx.snap +++ b/ui/pages/confirmations/components/confirm/info/base-transaction-info/__snapshots__/base-transaction-info.test.tsx.snap @@ -233,6 +233,81 @@ exports[` renders component for contract interaction requ
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x2e0D7...5d09B +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ Test Account +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ Test Account +

+
+
+
{ > - {isSIWE && ( - - - - )} + + + {isSIWE ? ( diff --git a/ui/pages/confirmations/components/confirm/info/set-approval-for-all-info/__snapshots__/set-approval-for-all-info.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/set-approval-for-all-info/__snapshots__/set-approval-for-all-info.test.tsx.snap index b66065f7c898..ca3e2346c946 100644 --- a/ui/pages/confirmations/components/confirm/info/set-approval-for-all-info/__snapshots__/set-approval-for-all-info.test.tsx.snap +++ b/ui/pages/confirmations/components/confirm/info/set-approval-for-all-info/__snapshots__/set-approval-for-all-info.test.tsx.snap @@ -154,6 +154,81 @@ exports[` renders component for approve request 1`] = `

+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x2e0D7...5d09B +

+
+
+
renders component for transaction details 1`] =
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x2e0D7...5d09B +

+
+
+
`; diff --git a/ui/pages/confirmations/components/confirm/info/shared/transaction-details/transaction-details.tsx b/ui/pages/confirmations/components/confirm/info/shared/transaction-details/transaction-details.tsx index 89c2da783a4f..f798a4112ee9 100644 --- a/ui/pages/confirmations/components/confirm/info/shared/transaction-details/transaction-details.tsx +++ b/ui/pages/confirmations/components/confirm/info/shared/transaction-details/transaction-details.tsx @@ -45,6 +45,29 @@ export const OriginRow = () => { ); }; +export const SigningInWithRow = () => { + const t = useI18nContext(); + + const { currentConfirmation } = useConfirmContext(); + + const chainId = currentConfirmation?.chainId as string; + const from = currentConfirmation?.txParams?.from; + + if (!from) { + return null; + } + + return ( + + + + ); +}; + export const RecipientRow = () => { const t = useI18nContext(); const { currentConfirmation } = useConfirmContext(); @@ -156,6 +179,7 @@ export const TransactionDetails = () => { {showAdvancedDetails && } + diff --git a/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap index 23cddb2b59b2..c948d1057d7a 100644 --- a/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap +++ b/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap @@ -10,20 +10,78 @@ exports[` renders correctly 1`] = ` class="mm-box mm-box--padding-3 mm-box--display-flex mm-box--flex-direction-row mm-box--justify-content-space-between mm-box--align-items-center" >
- -

- 0x2e0D7...5d09B -

+

+ From +

+
+
+
+
+ +

+ 0x2e0D7...5d09B +

+
renders correctly 1`] = ` style="mask-image: url('./images/icons/arrow-right.svg');" />
+
+

+ To +

+
+
+
- -

- 0x6B175...71d0F -

+ +

+ 0x6B175...71d0F +

+
diff --git a/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.tsx b/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.tsx index f5a9a46acbb2..57f52ed8d4cb 100644 --- a/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.tsx +++ b/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.tsx @@ -1,11 +1,9 @@ -import { NameType } from '@metamask/name-controller'; import { TransactionMeta, TransactionType, } from '@metamask/transaction-controller'; import React from 'react'; import { ConfirmInfoSection } from '../../../../../../components/app/confirm/info/row/section'; -import Name from '../../../../../../components/app/name'; import { Box, Icon, @@ -19,10 +17,16 @@ import { IconColor, JustifyContent, } from '../../../../../../helpers/constants/design-system'; +import { + ConfirmInfoRow, + ConfirmInfoRowAddress, +} from '../../../../../../components/app/confirm/info/row'; +import { useI18nContext } from '../../../../../../hooks/useI18nContext'; import { useConfirmContext } from '../../../../context/confirm'; import { useDecodedTransactionData } from '../hooks/useDecodedTransactionData'; export const TransactionFlowSection = () => { + const t = useI18nContext(); const { currentConfirmation: transactionMeta } = useConfirmContext(); @@ -52,22 +56,33 @@ export const TransactionFlowSection = () => { alignItems={AlignItems.center} padding={3} > - + + + {recipientAddress && ( - + + + )} diff --git a/ui/pages/confirmations/components/confirm/info/typed-sign-v1/__snapshots__/typed-sign-v1.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/typed-sign-v1/__snapshots__/typed-sign-v1.test.tsx.snap index d4b07b83a269..213ec210be08 100644 --- a/ui/pages/confirmations/components/confirm/info/typed-sign-v1/__snapshots__/typed-sign-v1.test.tsx.snap +++ b/ui/pages/confirmations/components/confirm/info/typed-sign-v1/__snapshots__/typed-sign-v1.test.tsx.snap @@ -47,6 +47,81 @@ exports[`TypedSignInfo correctly renders typed sign data request 1`] = `

+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x935E7...05477 +

+
+
+
{ return null; } + const { from } = currentConfirmation.msgParams ?? { from: '' }; const toolTipMessage = isSnapId(currentConfirmation.msgParams?.origin) ? t('requestFromInfoSnap') : t('requestFromInfo'); @@ -42,6 +44,13 @@ const TypedSignV1Info: React.FC = () => { url={currentConfirmation.msgParams?.origin ?? ''} /> + + +
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x935E7...05477 +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x935E7...05477 +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ Test Account +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x935E7...05477 +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ Test Account +

+
+
+
{ ? t('requestFromInfoSnap') : t('requestFromInfo'); const msgData = currentConfirmation.msgParams?.data as string; + const { from } = currentConfirmation.msgParams ?? { from: '' }; return ( <> @@ -81,6 +82,13 @@ const TypedSignInfo: React.FC = () => { /> )} + + +
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ Test Account +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x935E7...05477 +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x935E7...05477 +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ Test Account +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x935E7...05477 +

+
+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x935E7...05477 +

+
+
+
{ + const t = useI18nContext(); + + const { currentConfirmation } = useConfirmContext(); + const selectedAccount = useSelector(getSelectedAccount); + + const fromAccount = + (currentConfirmation as SignatureRequestType)?.msgParams?.from ?? + (currentConfirmation as TransactionMeta)?.txParams?.from; + const confirmationAccountSameAsSelectedAccount = + !fromAccount || fromAccount === selectedAccount?.address; + + return useMemo((): Alert[] => { + if (confirmationAccountSameAsSelectedAccount) { + return []; + } + + return [ + { + key: 'selectedAccountWarning', + reason: t('selectedAccountMismatch'), + field: RowAlertKey.SigningInWith, + severity: Severity.Warning, + message: t('alertSelectedAccountWarning'), + }, + ]; + }, [confirmationAccountSameAsSelectedAccount, t]); +}; + +export default useSelectedAccountAlerts; diff --git a/ui/pages/confirmations/hooks/useConfirmationAlerts.ts b/ui/pages/confirmations/hooks/useConfirmationAlerts.ts index c5f77f143cb6..31387cb31910 100644 --- a/ui/pages/confirmations/hooks/useConfirmationAlerts.ts +++ b/ui/pages/confirmations/hooks/useConfirmationAlerts.ts @@ -16,6 +16,7 @@ import { useSigningOrSubmittingAlerts } from './alerts/transactions/useSigningOr ///: END:ONLY_INCLUDE_IF import useConfirmationOriginAlerts from './alerts/useConfirmationOriginAlerts'; import useBlockaidAlerts from './alerts/useBlockaidAlerts'; +import useSelectedAccountAlerts from './alerts/useSelectedAccountAlerts'; function useSignatureAlerts(): Alert[] { const accountMismatchAlerts = useAccountMismatchAlerts(); @@ -40,6 +41,7 @@ function useTransactionAlerts(): Alert[] { const signingOrSubmittingAlerts = useSigningOrSubmittingAlerts(); ///: END:ONLY_INCLUDE_IF const queuedConfirmationsAlerts = useQueuedConfirmationsAlerts(); + const selectedAccountAlerts = useSelectedAccountAlerts(); return useMemo( () => [ ...gasEstimateFailedAlerts, @@ -54,6 +56,7 @@ function useTransactionAlerts(): Alert[] { ...signingOrSubmittingAlerts, ///: END:ONLY_INCLUDE_IF ...queuedConfirmationsAlerts, + ...selectedAccountAlerts, ], [ gasEstimateFailedAlerts, From 9b0bdf8b43b0f478388a1db998f7344cbae93dad Mon Sep 17 00:00:00 2001 From: Jyoti Puri Date: Wed, 20 Nov 2024 18:44:13 +0530 Subject: [PATCH 02/12] update --- app/_locales/en/messages.json | 18 +++++------ .../transaction-flow-section.tsx | 31 ++++++++++++------- 2 files changed, 28 insertions(+), 21 deletions(-) diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index ef5439cbe758..5e0a7376bbc3 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -416,12 +416,6 @@ "alertMessageAddressMismatchWarning": { "message": "Attackers sometimes mimic sites by making small changes to the site address. Make sure you're interacting with the intended site before you continue." }, - "selectedAccountMismatch": { - "message": "Different account selected" - }, - "alertSelectedAccountWarning": { - "message": "This request is for a different account than the one selected in your wallet. To use another account, connect it to the site." - }, "alertMessageChangeInSimulationResults": { "message": "Estimated changes for this transaction have been updated. Review them closely before proceeding." }, @@ -494,6 +488,9 @@ "alertReasonWrongAccount": { "message": "Wrong account" }, + "alertSelectedAccountWarning": { + "message": "This request is for a different account than the one selected in your wallet. To use another account, connect it to the site." + }, "alerts": { "message": "Alerts" }, @@ -4510,9 +4507,6 @@ "requestFrom": { "message": "Request from" }, - "signingAccount": { - "message": "Signing Account" - }, "requestFromInfo": { "message": "This is the site asking for your signature." }, @@ -4845,6 +4839,9 @@ "selectType": { "message": "Select Type" }, + "selectedAccountMismatch": { + "message": "Different account selected" + }, "selectingAllWillAllow": { "message": "Selecting all will allow this site to view all of your current accounts. Make sure you trust this site." }, @@ -5005,6 +5002,9 @@ "signing": { "message": "Signing" }, + "signingAccount": { + "message": "Signing Account" + }, "signingInWith": { "message": "Signing in with" }, diff --git a/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.tsx b/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.tsx index 57f52ed8d4cb..d868611be4cc 100644 --- a/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.tsx +++ b/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.tsx @@ -21,6 +21,8 @@ import { ConfirmInfoRow, ConfirmInfoRowAddress, } from '../../../../../../components/app/confirm/info/row'; +import { RowAlertKey } from '../../../../../../components/app/confirm/info/row/constants'; +import { ConfirmInfoAlertRow } from '../../../../../../components/app/confirm/info/row/alert-row/alert-row'; import { useI18nContext } from '../../../../../../hooks/useI18nContext'; import { useConfirmContext } from '../../../../context/confirm'; import { useDecodedTransactionData } from '../hooks/useDecodedTransactionData'; @@ -54,17 +56,20 @@ export const TransactionFlowSection = () => { flexDirection={FlexDirection.Row} justifyContent={JustifyContent.spaceBetween} alignItems={AlignItems.center} - padding={3} > - - - + + + + + { alignItems: AlignItems.flexStart, }} > - + + + )} From 5dbdbb400b14a6f33ab9565115a093a3ac90d3d9 Mon Sep 17 00:00:00 2001 From: Jyoti Puri Date: Wed, 20 Nov 2024 18:57:19 +0530 Subject: [PATCH 03/12] update --- .../alerts/useSelectedAccountAlerts.test.ts | 56 +++++++++++++++++++ 1 file changed, 56 insertions(+) create mode 100644 ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts diff --git a/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts b/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts new file mode 100644 index 000000000000..1cfca9e5c727 --- /dev/null +++ b/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts @@ -0,0 +1,56 @@ +import { TransactionMeta } from '@metamask/transaction-controller'; + +import mockState from '../../../../../test/data/mock-state.json'; +import { genUnapprovedContractInteractionConfirmation } from '../../../../../test/data/confirmations/contract-interaction'; +import { + getMockConfirmStateForTransaction, + getMockPersonalSignConfirmStateForRequest, +} from '../../../../../test/data/confirmations/helper'; +import { renderHookWithConfirmContextProvider } from '../../../../../test/lib/confirmations/render-helpers'; +import { unapprovedPersonalSignMsg } from '../../../../../test/data/confirmations/personal_sign'; +import { SignatureRequestType } from '../../types/confirm'; +import useSelectedAccountAlerts from './useSelectedAccountAlerts'; + +const expectedAlert = [ + { + key: 'selectedAccountWarning', + message: + 'This request is for a different account than the one selected in your wallet. To use another account, connect it to the site.', + reason: 'Different account selected', + severity: 'warning', + field: 'signingInWith', + }, +]; + +describe('useSelectedAccountAlerts', () => { + it('returns an empty array when there is no current confirmation', () => { + const { result } = renderHookWithConfirmContextProvider( + () => useSelectedAccountAlerts(), + mockState, + ); + expect(result.current).toEqual([]); + }); + + it('returns an alert for signature if signing account is different from selected account', () => { + const { result } = renderHookWithConfirmContextProvider( + () => useSelectedAccountAlerts(), + getMockPersonalSignConfirmStateForRequest({ + ...unapprovedPersonalSignMsg, + msgParams: { + ...unapprovedPersonalSignMsg.msgParams, + from: '0x0', + }, + } as SignatureRequestType), + ); + expect(result.current).toEqual(expectedAlert); + }); + + it('returns an alert for transaction if signing account is different from selected account', () => { + const contractInteraction = genUnapprovedContractInteractionConfirmation({ address: '0x0' }); + const { result } = renderHookWithConfirmContextProvider( + () => useSelectedAccountAlerts(), + getMockConfirmStateForTransaction(contractInteraction as TransactionMeta), + ); + expect(result.current).toEqual(expectedAlert); + }); +}); From d795fa1f46977e498d52ed82d6b1536ce8a60cfe Mon Sep 17 00:00:00 2001 From: Jyoti Puri Date: Wed, 20 Nov 2024 19:13:52 +0530 Subject: [PATCH 04/12] update --- .../transaction-flow-section.test.tsx.snap | 158 +++++++++--------- .../transaction-flow-section.test.tsx | 11 ++ 2 files changed, 94 insertions(+), 75 deletions(-) diff --git a/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap index c948d1057d7a..fdb7ae940e68 100644 --- a/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap +++ b/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap @@ -7,14 +7,14 @@ exports[` renders correctly 1`] = ` data-testid="confirmation__transaction-flow" >
renders correctly 1`] = `
+

+ 0x2e0D7...5d09B +

-

- 0x2e0D7...5d09B -

@@ -106,60 +110,64 @@ exports[` renders correctly 1`] = `
+

+ 0x6B175...71d0F +

-

- 0x6B175...71d0F -

diff --git a/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.test.tsx b/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.test.tsx index c23d3645abd3..bdc6ed30678a 100644 --- a/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.test.tsx +++ b/ui/pages/confirmations/components/confirm/info/token-transfer/transaction-flow-section.test.tsx @@ -11,6 +11,17 @@ jest.mock('../hooks/useDecodedTransactionData', () => ({ useDecodedTransactionData: jest.fn(), })); +jest.mock( + '../../../../../../components/app/alert-system/contexts/alertMetricsContext.tsx', + () => ({ + useAlertMetrics: jest.fn(() => ({ + trackInlineAlertClicked: jest.fn(), + trackAlertRender: jest.fn(), + trackAlertActionClicked: jest.fn(), + })), + }), +); + describe('', () => { const useDecodedTransactionDataMock = jest.fn().mockImplementation(() => ({ pending: false, From f0e58251b3ddc466d00e21e3b17ef8c269c01b79 Mon Sep 17 00:00:00 2001 From: Jyoti Puri Date: Wed, 20 Nov 2024 19:36:44 +0530 Subject: [PATCH 05/12] update --- .../hooks/alerts/useSelectedAccountAlerts.test.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts b/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts index 1cfca9e5c727..9650d0a49888 100644 --- a/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts +++ b/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts @@ -46,7 +46,9 @@ describe('useSelectedAccountAlerts', () => { }); it('returns an alert for transaction if signing account is different from selected account', () => { - const contractInteraction = genUnapprovedContractInteractionConfirmation({ address: '0x0' }); + const contractInteraction = genUnapprovedContractInteractionConfirmation({ + address: '0x0', + }); const { result } = renderHookWithConfirmContextProvider( () => useSelectedAccountAlerts(), getMockConfirmStateForTransaction(contractInteraction as TransactionMeta), From 94786bcb3c74115202aafe9dc22de09ed834582b Mon Sep 17 00:00:00 2001 From: Jyoti Puri Date: Wed, 20 Nov 2024 19:57:35 +0530 Subject: [PATCH 06/12] update --- app/_locales/en/messages.json | 3 --- 1 file changed, 3 deletions(-) diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 5e0a7376bbc3..7fb357b39c43 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -5002,9 +5002,6 @@ "signing": { "message": "Signing" }, - "signingAccount": { - "message": "Signing Account" - }, "signingInWith": { "message": "Signing in with" }, From c56b28940ce97839780cf5f18aaac176506b023c Mon Sep 17 00:00:00 2001 From: Jyoti Puri Date: Fri, 22 Nov 2024 18:26:19 +0530 Subject: [PATCH 07/12] update --- .../alerts/useSelectedAccountAlerts.test.ts | 23 ++++++++++++++++++- .../hooks/alerts/useSelectedAccountAlerts.ts | 6 ++--- .../hooks/useConfirmationAlerts.ts | 8 ++++--- 3 files changed, 29 insertions(+), 8 deletions(-) diff --git a/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts b/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts index 9650d0a49888..fb69efb86ba1 100644 --- a/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts +++ b/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.test.ts @@ -9,7 +9,7 @@ import { import { renderHookWithConfirmContextProvider } from '../../../../../test/lib/confirmations/render-helpers'; import { unapprovedPersonalSignMsg } from '../../../../../test/data/confirmations/personal_sign'; import { SignatureRequestType } from '../../types/confirm'; -import useSelectedAccountAlerts from './useSelectedAccountAlerts'; +import { useSelectedAccountAlerts } from './useSelectedAccountAlerts'; const expectedAlert = [ { @@ -45,6 +45,16 @@ describe('useSelectedAccountAlerts', () => { expect(result.current).toEqual(expectedAlert); }); + it('does not returns an alert for signature if signing account is same as selected account', () => { + const { result } = renderHookWithConfirmContextProvider( + () => useSelectedAccountAlerts(), + getMockPersonalSignConfirmStateForRequest( + unapprovedPersonalSignMsg as SignatureRequestType, + ), + ); + expect(result.current).toEqual([]); + }); + it('returns an alert for transaction if signing account is different from selected account', () => { const contractInteraction = genUnapprovedContractInteractionConfirmation({ address: '0x0', @@ -55,4 +65,15 @@ describe('useSelectedAccountAlerts', () => { ); expect(result.current).toEqual(expectedAlert); }); + + it('does not returns an alert for transaction if signing account is same as selected account', () => { + const contractInteraction = genUnapprovedContractInteractionConfirmation({ + address: '0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc', + }); + const { result } = renderHookWithConfirmContextProvider( + () => useSelectedAccountAlerts(), + getMockConfirmStateForTransaction(contractInteraction as TransactionMeta), + ); + expect(result.current).toEqual([]); + }); }); diff --git a/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.ts b/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.ts index 5b4d5389d3cb..b28653545f33 100644 --- a/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.ts +++ b/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.ts @@ -10,7 +10,7 @@ import { useI18nContext } from '../../../../hooks/useI18nContext'; import { SignatureRequestType } from '../../types/confirm'; import { useConfirmContext } from '../../context/confirm'; -const useSelectedAccountAlerts = (): Alert[] => { +export const useSelectedAccountAlerts = (): Alert[] => { const t = useI18nContext(); const { currentConfirmation } = useConfirmContext(); @@ -20,7 +20,7 @@ const useSelectedAccountAlerts = (): Alert[] => { (currentConfirmation as SignatureRequestType)?.msgParams?.from ?? (currentConfirmation as TransactionMeta)?.txParams?.from; const confirmationAccountSameAsSelectedAccount = - !fromAccount || fromAccount === selectedAccount?.address; + !fromAccount || fromAccount.toLowerCase() === selectedAccount?.address?.toLowerCase(); return useMemo((): Alert[] => { if (confirmationAccountSameAsSelectedAccount) { @@ -38,5 +38,3 @@ const useSelectedAccountAlerts = (): Alert[] => { ]; }, [confirmationAccountSameAsSelectedAccount, t]); }; - -export default useSelectedAccountAlerts; diff --git a/ui/pages/confirmations/hooks/useConfirmationAlerts.ts b/ui/pages/confirmations/hooks/useConfirmationAlerts.ts index 31387cb31910..efcb0beacf9e 100644 --- a/ui/pages/confirmations/hooks/useConfirmationAlerts.ts +++ b/ui/pages/confirmations/hooks/useConfirmationAlerts.ts @@ -16,7 +16,7 @@ import { useSigningOrSubmittingAlerts } from './alerts/transactions/useSigningOr ///: END:ONLY_INCLUDE_IF import useConfirmationOriginAlerts from './alerts/useConfirmationOriginAlerts'; import useBlockaidAlerts from './alerts/useBlockaidAlerts'; -import useSelectedAccountAlerts from './alerts/useSelectedAccountAlerts'; +import { useSelectedAccountAlerts } from './alerts/useSelectedAccountAlerts'; function useSignatureAlerts(): Alert[] { const accountMismatchAlerts = useAccountMismatchAlerts(); @@ -41,7 +41,7 @@ function useTransactionAlerts(): Alert[] { const signingOrSubmittingAlerts = useSigningOrSubmittingAlerts(); ///: END:ONLY_INCLUDE_IF const queuedConfirmationsAlerts = useQueuedConfirmationsAlerts(); - const selectedAccountAlerts = useSelectedAccountAlerts(); + return useMemo( () => [ ...gasEstimateFailedAlerts, @@ -56,7 +56,6 @@ function useTransactionAlerts(): Alert[] { ...signingOrSubmittingAlerts, ///: END:ONLY_INCLUDE_IF ...queuedConfirmationsAlerts, - ...selectedAccountAlerts, ], [ gasEstimateFailedAlerts, @@ -80,6 +79,7 @@ export default function useConfirmationAlerts(): Alert[] { const confirmationOriginAlerts = useConfirmationOriginAlerts(); const signatureAlerts = useSignatureAlerts(); const transactionAlerts = useTransactionAlerts(); + const selectedAccountAlerts = useSelectedAccountAlerts(); return useMemo( () => [ @@ -87,12 +87,14 @@ export default function useConfirmationAlerts(): Alert[] { ...confirmationOriginAlerts, ...signatureAlerts, ...transactionAlerts, + ...selectedAccountAlerts, ], [ blockaidAlerts, confirmationOriginAlerts, signatureAlerts, transactionAlerts, + selectedAccountAlerts, ], ); } From 3a6cee01773d431e7ce995a753aa473071bcd6e4 Mon Sep 17 00:00:00 2001 From: Jyoti Puri Date: Fri, 22 Nov 2024 18:36:44 +0530 Subject: [PATCH 08/12] update --- .../info/personal-sign/personal-sign.tsx | 10 ++---- .../sign-in-with-row.test.tsx | 30 ++++++++++++++++ .../sign-in-with-row/sign-in-with-row.tsx | 34 +++++++++++++++++++ .../transaction-details.tsx | 24 +------------ .../info/typed-sign-v1/typed-sign-v1.tsx | 10 ++---- .../confirm/info/typed-sign/typed-sign.tsx | 9 ++--- 6 files changed, 71 insertions(+), 46 deletions(-) create mode 100644 ui/pages/confirmations/components/confirm/info/shared/sign-in-with-row/sign-in-with-row.test.tsx create mode 100644 ui/pages/confirmations/components/confirm/info/shared/sign-in-with-row/sign-in-with-row.tsx diff --git a/ui/pages/confirmations/components/confirm/info/personal-sign/personal-sign.tsx b/ui/pages/confirmations/components/confirm/info/personal-sign/personal-sign.tsx index b0d81eb52bd1..6f2fc83471c4 100644 --- a/ui/pages/confirmations/components/confirm/info/personal-sign/personal-sign.tsx +++ b/ui/pages/confirmations/components/confirm/info/personal-sign/personal-sign.tsx @@ -2,7 +2,6 @@ import React from 'react'; import { useSelector } from 'react-redux'; import { - ConfirmInfoRowAddress, ConfirmInfoRowText, ConfirmInfoRowUrl, } from '../../../../../../components/app/confirm/info/row'; @@ -38,6 +37,7 @@ import { useConfirmContext } from '../../../../context/confirm'; import { selectUseTransactionSimulations } from '../../../../selectors/preferences'; import { SignatureRequestType } from '../../../../types/confirm'; import { isSIWESignatureRequest } from '../../../../utils'; +import { SigningInWithRow } from '../shared/sign-in-with-row/sign-in-with-row'; import { SIWESignInfo } from './siwe-sign'; const PersonalSignInfo: React.FC = () => { @@ -138,13 +138,7 @@ const PersonalSignInfo: React.FC = () => { > - - - + {isSIWE ? ( diff --git a/ui/pages/confirmations/components/confirm/info/shared/sign-in-with-row/sign-in-with-row.test.tsx b/ui/pages/confirmations/components/confirm/info/shared/sign-in-with-row/sign-in-with-row.test.tsx new file mode 100644 index 000000000000..2ee3383160cb --- /dev/null +++ b/ui/pages/confirmations/components/confirm/info/shared/sign-in-with-row/sign-in-with-row.test.tsx @@ -0,0 +1,30 @@ +import React from 'react'; +import configureMockStore from 'redux-mock-store'; +import thunk from 'redux-thunk'; +import { getMockContractInteractionConfirmState } from '../../../../../../../../test/data/confirmations/helper'; +import { renderWithConfirmContextProvider } from '../../../../../../../../test/lib/confirmations/render-helpers'; +import { SigningInWithRow } from './sign-in-with-row'; + +jest.mock( + '../../../../../../../components/app/alert-system/contexts/alertMetricsContext', + () => ({ + useAlertMetrics: jest.fn(() => ({ + trackAlertMetrics: jest.fn(), + })), + }), +); + +describe('', () => { + const middleware = [thunk]; + + it('renders component for transaction details', () => { + const state = getMockContractInteractionConfirmState(); + const mockStore = configureMockStore(middleware)(state); + const { getByText } = renderWithConfirmContextProvider( + , + mockStore, + ); + expect(getByText('Signing in with')).toBeInTheDocument(); + expect(getByText('0x2e0D7...5d09B')).toBeInTheDocument(); + }); +}); diff --git a/ui/pages/confirmations/components/confirm/info/shared/sign-in-with-row/sign-in-with-row.tsx b/ui/pages/confirmations/components/confirm/info/shared/sign-in-with-row/sign-in-with-row.tsx new file mode 100644 index 000000000000..7b20cbc08062 --- /dev/null +++ b/ui/pages/confirmations/components/confirm/info/shared/sign-in-with-row/sign-in-with-row.tsx @@ -0,0 +1,34 @@ +import React from 'react'; +import { TransactionMeta } from '@metamask/transaction-controller'; + +import { ConfirmInfoRowAddress } from '../../../../../../../components/app/confirm/info/row'; +import { ConfirmInfoAlertRow } from '../../../../../../../components/app/confirm/info/row/alert-row/alert-row'; +import { RowAlertKey } from '../../../../../../../components/app/confirm/info/row/constants'; +import { useI18nContext } from '../../../../../../../hooks/useI18nContext'; +import { useConfirmContext } from '../../../../../context/confirm'; +import { SignatureRequestType } from '../../../../../types/confirm'; + +export const SigningInWithRow = () => { + const t = useI18nContext(); + + const { currentConfirmation } = useConfirmContext(); + + const chainId = currentConfirmation?.chainId as string; + const from = + (currentConfirmation as TransactionMeta)?.txParams?.from ?? + (currentConfirmation as SignatureRequestType)?.msgParams?.from; + + if (!from) { + return null; + } + + return ( + + + + ); +}; diff --git a/ui/pages/confirmations/components/confirm/info/shared/transaction-details/transaction-details.tsx b/ui/pages/confirmations/components/confirm/info/shared/transaction-details/transaction-details.tsx index f798a4112ee9..79cea5963c45 100644 --- a/ui/pages/confirmations/components/confirm/info/shared/transaction-details/transaction-details.tsx +++ b/ui/pages/confirmations/components/confirm/info/shared/transaction-details/transaction-details.tsx @@ -20,6 +20,7 @@ import { ConfirmInfoRowCurrency } from '../../../../../../../components/app/conf import { PRIMARY } from '../../../../../../../helpers/constants/common'; import { useUserPreferencedCurrency } from '../../../../../../../hooks/useUserPreferencedCurrency'; import { HEX_ZERO } from '../constants'; +import { SigningInWithRow } from '../sign-in-with-row/sign-in-with-row'; export const OriginRow = () => { const t = useI18nContext(); @@ -45,29 +46,6 @@ export const OriginRow = () => { ); }; -export const SigningInWithRow = () => { - const t = useI18nContext(); - - const { currentConfirmation } = useConfirmContext(); - - const chainId = currentConfirmation?.chainId as string; - const from = currentConfirmation?.txParams?.from; - - if (!from) { - return null; - } - - return ( - - - - ); -}; - export const RecipientRow = () => { const t = useI18nContext(); const { currentConfirmation } = useConfirmContext(); diff --git a/ui/pages/confirmations/components/confirm/info/typed-sign-v1/typed-sign-v1.tsx b/ui/pages/confirmations/components/confirm/info/typed-sign-v1/typed-sign-v1.tsx index 9179871033de..0ed69e23bca2 100644 --- a/ui/pages/confirmations/components/confirm/info/typed-sign-v1/typed-sign-v1.tsx +++ b/ui/pages/confirmations/components/confirm/info/typed-sign-v1/typed-sign-v1.tsx @@ -3,7 +3,6 @@ import React from 'react'; import { ConfirmInfoAlertRow } from '../../../../../../components/app/confirm/info/row/alert-row/alert-row'; import { ConfirmInfoRow, - ConfirmInfoRowAddress, ConfirmInfoRowUrl, } from '../../../../../../components/app/confirm/info/row'; import { RowAlertKey } from '../../../../../../components/app/confirm/info/row/constants'; @@ -16,6 +15,7 @@ import { useConfirmContext } from '../../../../context/confirm'; import { ConfirmInfoRowTypedSignDataV1 } from '../../row/typed-sign-data-v1/typedSignDataV1'; import { ConfirmInfoSection } from '../../../../../../components/app/confirm/info/row/section'; import { isSnapId } from '../../../../../../helpers/utils/snaps'; +import { SigningInWithRow } from '../shared/sign-in-with-row/sign-in-with-row'; const TypedSignV1Info: React.FC = () => { const t = useI18nContext(); @@ -44,13 +44,7 @@ const TypedSignV1Info: React.FC = () => { url={currentConfirmation.msgParams?.origin ?? ''} /> - - - + { @@ -82,13 +83,7 @@ const TypedSignInfo: React.FC = () => { /> )} - - - + Date: Fri, 22 Nov 2024 18:46:41 +0530 Subject: [PATCH 09/12] update --- .../info/approve/approve-details/approve-details.tsx | 2 +- .../confirm/info/approve/revoke-details/revoke-details.tsx | 6 ++---- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/ui/pages/confirmations/components/confirm/info/approve/approve-details/approve-details.tsx b/ui/pages/confirmations/components/confirm/info/approve/approve-details/approve-details.tsx index 77c650dbf34b..e46b581220a4 100644 --- a/ui/pages/confirmations/components/confirm/info/approve/approve-details/approve-details.tsx +++ b/ui/pages/confirmations/components/confirm/info/approve/approve-details/approve-details.tsx @@ -10,13 +10,13 @@ import { ConfirmInfoSection } from '../../../../../../../components/app/confirm/ import { useI18nContext } from '../../../../../../../hooks/useI18nContext'; import { useConfirmContext } from '../../../../../context/confirm'; import { selectConfirmationAdvancedDetailsOpen } from '../../../../../selectors/preferences'; +import { SigningInWithRow } from '../../shared/sign-in-with-row/sign-in-with-row'; import { useDecodedTransactionData } from '../../hooks/useDecodedTransactionData'; import { Container } from '../../shared/transaction-data/transaction-data'; import { MethodDataRow, OriginRow, RecipientRow, - SigningInWithRow, } from '../../shared/transaction-details/transaction-details'; import { getIsRevokeSetApprovalForAll } from '../../utils'; import { useIsNFT } from '../hooks/use-is-nft'; diff --git a/ui/pages/confirmations/components/confirm/info/approve/revoke-details/revoke-details.tsx b/ui/pages/confirmations/components/confirm/info/approve/revoke-details/revoke-details.tsx index 6da55fea5acf..09b2e6a809f3 100644 --- a/ui/pages/confirmations/components/confirm/info/approve/revoke-details/revoke-details.tsx +++ b/ui/pages/confirmations/components/confirm/info/approve/revoke-details/revoke-details.tsx @@ -1,9 +1,7 @@ import React from 'react'; import { ConfirmInfoSection } from '../../../../../../../components/app/confirm/info/row/section'; -import { - OriginRow, - SigningInWithRow, -} from '../../shared/transaction-details/transaction-details'; +import { OriginRow } from '../../shared/transaction-details/transaction-details'; +import { SigningInWithRow } from '../../shared/sign-in-with-row/sign-in-with-row'; export const RevokeDetails = () => { return ( From a0c2c9dd946d3b601461ff72ef25eba66fe47214 Mon Sep 17 00:00:00 2001 From: Jyoti Puri Date: Fri, 22 Nov 2024 18:49:48 +0530 Subject: [PATCH 10/12] update --- .../components/confirm/info/personal-sign/personal-sign.tsx | 2 -- .../components/confirm/info/typed-sign-v1/typed-sign-v1.tsx | 1 - .../components/confirm/info/typed-sign/typed-sign.tsx | 1 - 3 files changed, 4 deletions(-) diff --git a/ui/pages/confirmations/components/confirm/info/personal-sign/personal-sign.tsx b/ui/pages/confirmations/components/confirm/info/personal-sign/personal-sign.tsx index 6f2fc83471c4..bd6c41866917 100644 --- a/ui/pages/confirmations/components/confirm/info/personal-sign/personal-sign.tsx +++ b/ui/pages/confirmations/components/confirm/info/personal-sign/personal-sign.tsx @@ -51,9 +51,7 @@ const PersonalSignInfo: React.FC = () => { return null; } - const { from } = currentConfirmation.msgParams; const isSIWE = isSIWESignatureRequest(currentConfirmation); - const chainId = currentConfirmation.chainId as string; const messageText = sanitizeString( hexToText(currentConfirmation.msgParams?.data), ); diff --git a/ui/pages/confirmations/components/confirm/info/typed-sign-v1/typed-sign-v1.tsx b/ui/pages/confirmations/components/confirm/info/typed-sign-v1/typed-sign-v1.tsx index 0ed69e23bca2..5ebc5a9e0f56 100644 --- a/ui/pages/confirmations/components/confirm/info/typed-sign-v1/typed-sign-v1.tsx +++ b/ui/pages/confirmations/components/confirm/info/typed-sign-v1/typed-sign-v1.tsx @@ -25,7 +25,6 @@ const TypedSignV1Info: React.FC = () => { return null; } - const { from } = currentConfirmation.msgParams ?? { from: '' }; const toolTipMessage = isSnapId(currentConfirmation.msgParams?.origin) ? t('requestFromInfoSnap') : t('requestFromInfo'); diff --git a/ui/pages/confirmations/components/confirm/info/typed-sign/typed-sign.tsx b/ui/pages/confirmations/components/confirm/info/typed-sign/typed-sign.tsx index 9b1eb2c2eb4a..bed2cb524400 100644 --- a/ui/pages/confirmations/components/confirm/info/typed-sign/typed-sign.tsx +++ b/ui/pages/confirmations/components/confirm/info/typed-sign/typed-sign.tsx @@ -53,7 +53,6 @@ const TypedSignInfo: React.FC = () => { ? t('requestFromInfoSnap') : t('requestFromInfo'); const msgData = currentConfirmation.msgParams?.data as string; - const { from } = currentConfirmation.msgParams ?? { from: '' }; return ( <> From a15e8da34161e32967400ebc9b023524bfe0c6d6 Mon Sep 17 00:00:00 2001 From: Jyoti Puri Date: Fri, 22 Nov 2024 19:08:54 +0530 Subject: [PATCH 11/12] update --- .../info/__snapshots__/info.test.tsx.snap | 10 +- .../__snapshots__/approve.test.tsx.snap | 924 ------------------ .../base-transaction-info.test.tsx.snap | 2 +- .../__snapshots__/personal-sign.test.tsx.snap | 4 +- .../set-approval-for-all-info.test.tsx.snap | 2 +- .../transaction-details.test.tsx.snap | 2 +- .../token-details-section.test.tsx.snap | 133 --- .../token-transfer.test.tsx.snap | 376 ------- .../transaction-flow-section.test.tsx.snap | 4 +- .../__snapshots__/typed-sign-v1.test.tsx.snap | 2 +- .../__snapshots__/typed-sign.test.tsx.snap | 10 +- .../__snapshots__/confirm.test.tsx.snap | 12 +- 12 files changed, 24 insertions(+), 1457 deletions(-) delete mode 100644 ui/pages/confirmations/components/confirm/info/approve/__snapshots__/approve.test.tsx.snap delete mode 100644 ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-details-section.test.tsx.snap delete mode 100644 ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-transfer.test.tsx.snap diff --git a/ui/pages/confirmations/components/confirm/info/__snapshots__/info.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/__snapshots__/info.test.tsx.snap index 170a1f8f0b48..6d48461f1c89 100644 --- a/ui/pages/confirmations/components/confirm/info/__snapshots__/info.test.tsx.snap +++ b/ui/pages/confirmations/components/confirm/info/__snapshots__/info.test.tsx.snap @@ -51,7 +51,7 @@ exports[`Info renders info section for approve request 1`] = `
renders component for approve request 1`] = ` -
-
-
-
-
-

- Estimated changes -

-
-
- -
-
-
-
-
-

- You're giving someone else permission to spend this amount from your account. -

-
-
-
-
-
-

- Spending cap -

-
-
-
-
-
-

- 1000 -

-
-
-
- -

- 0x07614...3ad68 -

-
-
-
-
-
-
-
-
-
-
-

- Spender -

-
-
- -
-
-
-
-
-
- -

- 0x2e0D7...5d09B -

-
-
-
-
-
-
-
-

- Request from -

-
-
- -
-
-
-
-
-

- metamask.github.io -

-
-
-
-
-
-

- Signing in with -

-
-
-
-
- -

- 0x2e0D7...5d09B -

-
-
-
-
-
-
-

- Interacting with -

-
-
- -
-
-
-
-
-
- -

- 0x07614...3ad68 -

-
-
-
-
-
-
-
-
-

- Account balance -

-
-
-
-

- 0 -

-
-
-
-
-
-
-

- Spending cap -

-
-
- -
-
-
-
-
-

- 1000 -

- -
-
-
-
-
-
-
-

- Network fee -

-
-
- -
-
-
-
-
-

- 0.0001 ETH -

-

- $0.08 -

- -
-
-
-
-
-

- Speed -

-
-
-
-
-

- 🦊 Market -

-

- - ~ - 0 sec - -

-
-
-
-
-
-
-

- Max fee -

-
-
- -
-
-
-
-
-

- 0.0023 ETH -

-

- $1.26 -

-
-
-
-
-
-
-
-

- Nonce -

-
-
- -
-
-
-
-
-

- undefined -

-
-
-
-
-
- -
-
-

- Data -

-
-
-
-
-
-
-
-

- Function -

-
-
-
-

-

-
-
-
-
-
-

- Param #1 -

-
-
- -
-
-
-
-
-
- -

- 0x2e0D7...5d09B -

-
-
-
-
-
-
-

- Param #2 -

-
-
- -
-
-
-
-
-

- 1 -

-
-
-
-
-
-`; diff --git a/ui/pages/confirmations/components/confirm/info/base-transaction-info/__snapshots__/base-transaction-info.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/base-transaction-info/__snapshots__/base-transaction-info.test.tsx.snap index 380be75aa32d..10506183561d 100644 --- a/ui/pages/confirmations/components/confirm/info/base-transaction-info/__snapshots__/base-transaction-info.test.tsx.snap +++ b/ui/pages/confirmations/components/confirm/info/base-transaction-info/__snapshots__/base-transaction-info.test.tsx.snap @@ -234,7 +234,7 @@ exports[` renders component for contract interaction requ
renders component for approve request 1`] = `
renders component for transaction details 1`] =
-
-
-
-
-

- Network -

-
-
-
-
- G -
-

- Goerli -

-
-
-
-
-
-

- Interacting with -

-
-
- -
-
-
-
-
-
- -

- 0x07614...3ad68 -

-
-
-
-
-
-`; diff --git a/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-transfer.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-transfer.test.tsx.snap deleted file mode 100644 index 9b123875728a..000000000000 --- a/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-transfer.test.tsx.snap +++ /dev/null @@ -1,376 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`TokenTransferInfo renders correctly 1`] = ` -
-
- - - - - - - - - -
-
-
-
-
-
-
-

- Estimated changes -

-
-
- -
-
-
-
-
-
- - - - - - - - - -
-
-
-
-
-
-
-
-

- Network -

-
-
-
-
- G -
-

- Goerli -

-
-
-
-
-
-

- Interacting with -

-
-
- -
-
-
-
-
-
- -

- 0x07614...3ad68 -

-
-
-
-
-
-
-
-
-

- Network fee -

-
-
- -
-
-
-
-
-

- 0.0001 ETH -

-

- $0.08 -

- -
-
-
-
-
-

- Speed -

-
-
-
-
-

- 🦊 Market -

-

- - ~ - 0 sec - -

-
-
-
-
-
-`; diff --git a/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap index fdb7ae940e68..01614eec26cd 100644 --- a/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap +++ b/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/transaction-flow-section.test.tsx.snap @@ -10,7 +10,7 @@ exports[` renders correctly 1`] = ` class="mm-box mm-box--display-flex mm-box--flex-direction-row mm-box--justify-content-space-between mm-box--align-items-center" >
renders correctly 1`] = ` style="mask-image: url('./images/icons/arrow-right.svg');" />
Date: Fri, 22 Nov 2024 19:21:19 +0530 Subject: [PATCH 12/12] update --- .../__snapshots__/approve.test.tsx.snap | 924 ++++++++++++++++++ .../token-details-section.test.tsx.snap | 133 +++ .../token-transfer.test.tsx.snap | 376 +++++++ .../hooks/alerts/useSelectedAccountAlerts.ts | 3 +- 4 files changed, 1435 insertions(+), 1 deletion(-) create mode 100644 ui/pages/confirmations/components/confirm/info/approve/__snapshots__/approve.test.tsx.snap create mode 100644 ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-details-section.test.tsx.snap create mode 100644 ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-transfer.test.tsx.snap diff --git a/ui/pages/confirmations/components/confirm/info/approve/__snapshots__/approve.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/approve/__snapshots__/approve.test.tsx.snap new file mode 100644 index 000000000000..19050e5f3f37 --- /dev/null +++ b/ui/pages/confirmations/components/confirm/info/approve/__snapshots__/approve.test.tsx.snap @@ -0,0 +1,924 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[` renders component for approve request 1`] = ` +
+
+
+
+
+

+ Estimated changes +

+
+
+ +
+
+
+
+
+

+ You're giving someone else permission to spend this amount from your account. +

+
+
+
+
+
+

+ Spending cap +

+
+
+
+
+
+

+ 1000 +

+
+
+
+ +

+ 0x07614...3ad68 +

+
+
+
+
+
+
+
+
+
+
+

+ Spender +

+
+
+ +
+
+
+
+
+
+ +

+ 0x2e0D7...5d09B +

+
+
+
+
+
+
+
+

+ Request from +

+
+
+ +
+
+
+
+
+

+ metamask.github.io +

+
+
+
+
+
+

+ Signing in with +

+
+
+
+
+ +

+ 0x2e0D7...5d09B +

+
+
+
+
+
+
+

+ Interacting with +

+
+
+ +
+
+
+
+
+
+ +

+ 0x07614...3ad68 +

+
+
+
+
+
+
+
+
+

+ Account balance +

+
+
+
+

+ 0 +

+
+
+
+
+
+
+

+ Spending cap +

+
+
+ +
+
+
+
+
+

+ 1000 +

+ +
+
+
+
+
+
+
+

+ Network fee +

+
+
+ +
+
+
+
+
+

+ 0.0001 ETH +

+

+ $0.08 +

+ +
+
+
+
+
+

+ Speed +

+
+
+
+
+

+ 🦊 Market +

+

+ + ~ + 0 sec + +

+
+
+
+
+
+
+

+ Max fee +

+
+
+ +
+
+
+
+
+

+ 0.0023 ETH +

+

+ $1.26 +

+
+
+
+
+
+
+
+

+ Nonce +

+
+
+ +
+
+
+
+
+

+ undefined +

+
+
+
+
+
+ +
+
+

+ Data +

+
+
+
+
+
+
+
+

+ Function +

+
+
+
+

+

+
+
+
+
+
+

+ Param #1 +

+
+
+ +
+
+
+
+
+
+ +

+ 0x2e0D7...5d09B +

+
+
+
+
+
+
+

+ Param #2 +

+
+
+ +
+
+
+
+
+

+ 1 +

+
+
+
+
+
+`; diff --git a/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-details-section.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-details-section.test.tsx.snap new file mode 100644 index 000000000000..6ab7ebb270b7 --- /dev/null +++ b/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-details-section.test.tsx.snap @@ -0,0 +1,133 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`TokenDetailsSection renders correctly 1`] = ` +
+
+
+
+
+

+ Network +

+
+
+
+
+ G +
+

+ Goerli +

+
+
+
+
+
+

+ Interacting with +

+
+
+ +
+
+
+
+
+
+ +

+ 0x07614...3ad68 +

+
+
+
+
+
+`; diff --git a/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-transfer.test.tsx.snap b/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-transfer.test.tsx.snap new file mode 100644 index 000000000000..9b123875728a --- /dev/null +++ b/ui/pages/confirmations/components/confirm/info/token-transfer/__snapshots__/token-transfer.test.tsx.snap @@ -0,0 +1,376 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`TokenTransferInfo renders correctly 1`] = ` +
+
+ + + + + + + + + +
+
+
+
+
+
+
+

+ Estimated changes +

+
+
+ +
+
+
+
+
+
+ + + + + + + + + +
+
+
+
+
+
+
+
+

+ Network +

+
+
+
+
+ G +
+

+ Goerli +

+
+
+
+
+
+

+ Interacting with +

+
+
+ +
+
+
+
+
+
+ +

+ 0x07614...3ad68 +

+
+
+
+
+
+
+
+
+

+ Network fee +

+
+
+ +
+
+
+
+
+

+ 0.0001 ETH +

+

+ $0.08 +

+ +
+
+
+
+
+

+ Speed +

+
+
+
+
+

+ 🦊 Market +

+

+ + ~ + 0 sec + +

+
+
+
+
+
+`; diff --git a/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.ts b/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.ts index b28653545f33..6e4be13b1ae5 100644 --- a/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.ts +++ b/ui/pages/confirmations/hooks/alerts/useSelectedAccountAlerts.ts @@ -20,7 +20,8 @@ export const useSelectedAccountAlerts = (): Alert[] => { (currentConfirmation as SignatureRequestType)?.msgParams?.from ?? (currentConfirmation as TransactionMeta)?.txParams?.from; const confirmationAccountSameAsSelectedAccount = - !fromAccount || fromAccount.toLowerCase() === selectedAccount?.address?.toLowerCase(); + !fromAccount || + fromAccount.toLowerCase() === selectedAccount?.address?.toLowerCase(); return useMemo((): Alert[] => { if (confirmationAccountSameAsSelectedAccount) {