From a430ef09d844ef949d5b0dd949f8a61a9ea10fc8 Mon Sep 17 00:00:00 2001 From: Filip Sekulic Date: Tue, 6 Dec 2022 14:17:45 +0100 Subject: [PATCH 01/12] Fixed navigation through multiple unapproved transactions for ERC20 tokens --- ui/pages/token-allowance/token-allowance.js | 48 ++++++++++++++++++++- 1 file changed, 47 insertions(+), 1 deletion(-) diff --git a/ui/pages/token-allowance/token-allowance.js b/ui/pages/token-allowance/token-allowance.js index 68b1eece1593..473eedd3cc19 100644 --- a/ui/pages/token-allowance/token-allowance.js +++ b/ui/pages/token-allowance/token-allowance.js @@ -57,6 +57,9 @@ import { NUM_W_OPT_DECIMAL_COMMA_OR_DOT_REGEX, } from '../../../shared/constants/tokens'; import { ConfirmPageContainerNavigation } from '../../components/app/confirm-page-container'; +import { transactionMatchesNetwork } from '../../../shared/modules/transaction.utils'; +import { hexToDecimal } from '../../../shared/lib/metamask-controller-utils'; +import { CONFIRM_TRANSACTION_ROUTE } from '../../helpers/constants/routes'; export default function TokenAllowance({ origin, @@ -231,6 +234,38 @@ export default function TokenAllowance({ const isEmpty = customTokenAmount === ''; + const network = hexToDecimal(fullTxData.chainId); + + const currentNetworkUnapprovedTxs = Object.keys(unapprovedTxs) + .filter((key) => + transactionMatchesNetwork( + unapprovedTxs[key], + fullTxData.chainId, + network, + ), + ) + .reduce((acc, key) => ({ ...acc, [key]: unapprovedTxs[key] }), {}); + + const enumUnapprovedTxs = Object.keys(currentNetworkUnapprovedTxs); + const currentPosition = enumUnapprovedTxs.indexOf( + fullTxData.id ? fullTxData.id.toString() : '', + ); + + const totalTx = enumUnapprovedTxs.length; + const positionOfCurrentTx = currentPosition + 1; + const nextTxId = enumUnapprovedTxs[currentPosition + 1]; + const prevTxId = enumUnapprovedTxs[currentPosition - 1]; + const showNavigation = enumUnapprovedTxs.length > 1; + const firstTx = enumUnapprovedTxs[0]; + const lastTx = enumUnapprovedTxs[enumUnapprovedTxs.length - 1]; + + const handleNextTx = (txId) => { + if (txId) { + dispatch(clearConfirmTransaction()); + history.push(`${CONFIRM_TRANSACTION_ROUTE}/${txId}`); + } + }; + const renderContractTokenValues = ( - + handleNextTx(txId)} + firstTx={firstTx} + lastTx={lastTx} + ofText={t('ofTextNofM')} + requestsWaitingText={t('requestsAwaitingAcknowledgement')} + /> Date: Wed, 14 Dec 2022 14:16:47 +0100 Subject: [PATCH 02/12] Fixed tx details activity-log currency --- .../confirm-page-container-container.test.js | 104 ++++++++++++++++++ ui/pages/token-allowance/token-allowance.js | 48 +------- 2 files changed, 105 insertions(+), 47 deletions(-) diff --git a/ui/components/app/confirm-page-container/confirm-page-container-container.test.js b/ui/components/app/confirm-page-container/confirm-page-container-container.test.js index eda6801b9d62..111af336698b 100644 --- a/ui/components/app/confirm-page-container/confirm-page-container-container.test.js +++ b/ui/components/app/confirm-page-container/confirm-page-container-container.test.js @@ -23,6 +23,110 @@ jest.mock('../../../pages/swaps/swaps.util', () => { }; }); +jest.mock('../../../selectors', () => { + return { + ...jest.requireActual('../../../selectors/'), + getTxData: jest.fn(() => ({ + id: 1230035278491151, + time: 1671022500513, + status: 'unapproved', + metamaskNetworkId: '80001', + originalGasEstimate: '0xea60', + userEditedGasLimit: false, + chainId: '0x13881', + loadingDefaults: false, + dappSuggestedGasFees: { + gasPrice: '0x4a817c800', + gas: '0xea60', + }, + sendFlowHistory: [], + txParams: { + from: '0xdd34b35ca1de17dfcdc07f79ff1f8f94868c40a1', + to: '0x7a67ff4a59594a56d46e9308a5c6e197fa83a3cf', + value: '0x0', + data: '0x095ea7b30000000000000000000000009bc5baf874d2da8d216ae9f137804184ee5afef40000000000000000000000000000000000000000000000000000000000011170', + gas: '0xea60', + maxFeePerGas: '0x0', + maxPriorityFeePerGas: '0x0', + }, + origin: 'https://metamask.github.io', + type: 'simpleSend', + history: [ + { + id: 1230035278491151, + time: 1671022500513, + status: 'unapproved', + metamaskNetworkId: '80001', + originalGasEstimate: '0xea60', + userEditedGasLimit: false, + chainId: '0x13881', + loadingDefaults: true, + dappSuggestedGasFees: { + gasPrice: '0x4a817c800', + gas: '0xea60', + }, + sendFlowHistory: [], + txParams: { + from: '0xdd34b35ca1de17dfcdc07f79ff1f8f94868c40a1', + to: '0x7a67ff4a59594a56d46e9308a5c6e197fa83a3cf', + value: '0x0', + data: '0x095ea7b30000000000000000000000009bc5baf874d2da8d216ae9f137804184ee5afef40000000000000000000000000000000000000000000000000000000000011170', + gas: '0xea60', + gasPrice: '0x4a817c800', + }, + origin: 'https://metamask.github.io', + type: 'simpleSend', + }, + [ + { + op: 'remove', + path: '/txParams/gasPrice', + note: 'Added new unapproved transaction.', + timestamp: 1671022501288, + }, + { + op: 'add', + path: '/txParams/maxFeePerGas', + value: '0x0', + }, + { + op: 'add', + path: '/txParams/maxPriorityFeePerGas', + value: '0x0', + }, + { + op: 'replace', + path: '/loadingDefaults', + value: false, + }, + { + op: 'add', + path: '/userFeeLevel', + value: 'custom', + }, + { + op: 'add', + path: '/defaultGasEstimates', + value: { + estimateType: 'custom', + gas: '0xea60', + maxFeePerGas: '0', + maxPriorityFeePerGas: '0', + }, + }, + ], + ], + userFeeLevel: 'custom', + defaultGasEstimates: { + estimateType: 'custom', + gas: '0xea60', + maxFeePerGas: '0', + maxPriorityFeePerGas: '0', + }, + })), + }; +}); + describe('Confirm Page Container Container Test', () => { const props = { title: 'Title', diff --git a/ui/pages/token-allowance/token-allowance.js b/ui/pages/token-allowance/token-allowance.js index 473eedd3cc19..68b1eece1593 100644 --- a/ui/pages/token-allowance/token-allowance.js +++ b/ui/pages/token-allowance/token-allowance.js @@ -57,9 +57,6 @@ import { NUM_W_OPT_DECIMAL_COMMA_OR_DOT_REGEX, } from '../../../shared/constants/tokens'; import { ConfirmPageContainerNavigation } from '../../components/app/confirm-page-container'; -import { transactionMatchesNetwork } from '../../../shared/modules/transaction.utils'; -import { hexToDecimal } from '../../../shared/lib/metamask-controller-utils'; -import { CONFIRM_TRANSACTION_ROUTE } from '../../helpers/constants/routes'; export default function TokenAllowance({ origin, @@ -234,38 +231,6 @@ export default function TokenAllowance({ const isEmpty = customTokenAmount === ''; - const network = hexToDecimal(fullTxData.chainId); - - const currentNetworkUnapprovedTxs = Object.keys(unapprovedTxs) - .filter((key) => - transactionMatchesNetwork( - unapprovedTxs[key], - fullTxData.chainId, - network, - ), - ) - .reduce((acc, key) => ({ ...acc, [key]: unapprovedTxs[key] }), {}); - - const enumUnapprovedTxs = Object.keys(currentNetworkUnapprovedTxs); - const currentPosition = enumUnapprovedTxs.indexOf( - fullTxData.id ? fullTxData.id.toString() : '', - ); - - const totalTx = enumUnapprovedTxs.length; - const positionOfCurrentTx = currentPosition + 1; - const nextTxId = enumUnapprovedTxs[currentPosition + 1]; - const prevTxId = enumUnapprovedTxs[currentPosition - 1]; - const showNavigation = enumUnapprovedTxs.length > 1; - const firstTx = enumUnapprovedTxs[0]; - const lastTx = enumUnapprovedTxs[enumUnapprovedTxs.length - 1]; - - const handleNextTx = (txId) => { - if (txId) { - dispatch(clearConfirmTransaction()); - history.push(`${CONFIRM_TRANSACTION_ROUTE}/${txId}`); - } - }; - const renderContractTokenValues = ( - handleNextTx(txId)} - firstTx={firstTx} - lastTx={lastTx} - ofText={t('ofTextNofM')} - requestsWaitingText={t('requestsAwaitingAcknowledgement')} - /> + Date: Tue, 20 Dec 2022 12:30:07 +0100 Subject: [PATCH 03/12] Fixed e2e test failure --- .../confirm-page-container-container.test.js | 104 ------------------ ...irm-page-container-navigation.component.js | 7 +- ui/pages/token-allowance/token-allowance.js | 2 +- 3 files changed, 7 insertions(+), 106 deletions(-) diff --git a/ui/components/app/confirm-page-container/confirm-page-container-container.test.js b/ui/components/app/confirm-page-container/confirm-page-container-container.test.js index 111af336698b..eda6801b9d62 100644 --- a/ui/components/app/confirm-page-container/confirm-page-container-container.test.js +++ b/ui/components/app/confirm-page-container/confirm-page-container-container.test.js @@ -23,110 +23,6 @@ jest.mock('../../../pages/swaps/swaps.util', () => { }; }); -jest.mock('../../../selectors', () => { - return { - ...jest.requireActual('../../../selectors/'), - getTxData: jest.fn(() => ({ - id: 1230035278491151, - time: 1671022500513, - status: 'unapproved', - metamaskNetworkId: '80001', - originalGasEstimate: '0xea60', - userEditedGasLimit: false, - chainId: '0x13881', - loadingDefaults: false, - dappSuggestedGasFees: { - gasPrice: '0x4a817c800', - gas: '0xea60', - }, - sendFlowHistory: [], - txParams: { - from: '0xdd34b35ca1de17dfcdc07f79ff1f8f94868c40a1', - to: '0x7a67ff4a59594a56d46e9308a5c6e197fa83a3cf', - value: '0x0', - data: '0x095ea7b30000000000000000000000009bc5baf874d2da8d216ae9f137804184ee5afef40000000000000000000000000000000000000000000000000000000000011170', - gas: '0xea60', - maxFeePerGas: '0x0', - maxPriorityFeePerGas: '0x0', - }, - origin: 'https://metamask.github.io', - type: 'simpleSend', - history: [ - { - id: 1230035278491151, - time: 1671022500513, - status: 'unapproved', - metamaskNetworkId: '80001', - originalGasEstimate: '0xea60', - userEditedGasLimit: false, - chainId: '0x13881', - loadingDefaults: true, - dappSuggestedGasFees: { - gasPrice: '0x4a817c800', - gas: '0xea60', - }, - sendFlowHistory: [], - txParams: { - from: '0xdd34b35ca1de17dfcdc07f79ff1f8f94868c40a1', - to: '0x7a67ff4a59594a56d46e9308a5c6e197fa83a3cf', - value: '0x0', - data: '0x095ea7b30000000000000000000000009bc5baf874d2da8d216ae9f137804184ee5afef40000000000000000000000000000000000000000000000000000000000011170', - gas: '0xea60', - gasPrice: '0x4a817c800', - }, - origin: 'https://metamask.github.io', - type: 'simpleSend', - }, - [ - { - op: 'remove', - path: '/txParams/gasPrice', - note: 'Added new unapproved transaction.', - timestamp: 1671022501288, - }, - { - op: 'add', - path: '/txParams/maxFeePerGas', - value: '0x0', - }, - { - op: 'add', - path: '/txParams/maxPriorityFeePerGas', - value: '0x0', - }, - { - op: 'replace', - path: '/loadingDefaults', - value: false, - }, - { - op: 'add', - path: '/userFeeLevel', - value: 'custom', - }, - { - op: 'add', - path: '/defaultGasEstimates', - value: { - estimateType: 'custom', - gas: '0xea60', - maxFeePerGas: '0', - maxPriorityFeePerGas: '0', - }, - }, - ], - ], - userFeeLevel: 'custom', - defaultGasEstimates: { - estimateType: 'custom', - gas: '0xea60', - maxFeePerGas: '0', - maxPriorityFeePerGas: '0', - }, - })), - }; -}); - describe('Confirm Page Container Container Test', () => { const props = { title: 'Title', diff --git a/ui/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js b/ui/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js index 0f3c3de616bf..35ccf6d3ac6f 100755 --- a/ui/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js +++ b/ui/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js @@ -1,6 +1,7 @@ import React, { useContext } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { useHistory, useParams } from 'react-router-dom'; +import PropTypes from 'prop-types'; import { getCurrentChainId, getUnapprovedTransactions, @@ -11,7 +12,7 @@ import { CONFIRM_TRANSACTION_ROUTE } from '../../../../helpers/constants/routes' import { clearConfirmTransaction } from '../../../../ducks/confirm-transaction/confirm-transaction.duck'; import { hexToDecimal } from '../../../../../shared/modules/conversion.utils'; -const ConfirmPageContainerNavigation = () => { +const ConfirmPageContainerNavigation = ({ txData }) => { const t = useContext(I18nContext); const dispatch = useDispatch(); const history = useHistory(); @@ -108,4 +109,8 @@ const ConfirmPageContainerNavigation = () => { ); }; +ConfirmPageContainerNavigation.propTypes = { + txData: PropTypes.object, +}; + export default ConfirmPageContainerNavigation; diff --git a/ui/pages/token-allowance/token-allowance.js b/ui/pages/token-allowance/token-allowance.js index 68b1eece1593..9258c785ca89 100644 --- a/ui/pages/token-allowance/token-allowance.js +++ b/ui/pages/token-allowance/token-allowance.js @@ -245,7 +245,7 @@ export default function TokenAllowance({ return ( - + Date: Fri, 6 Jan 2023 13:39:49 +0100 Subject: [PATCH 04/12] Added navigation between multiple sign prompts and reject all sign prompts --- ...irm-page-container-navigation.component.js | 25 ++++--- .../signature-request-original.test.js.snap | 70 +++++++++++++++++++ .../app/signature-request-original/index.scss | 5 +- .../signature-request-original.component.js | 5 ++ .../signature-request-original.test.js | 6 ++ .../app/signature-request/index.scss | 7 +- .../signature-request.component.js | 44 +++++++++++- .../signature-request.container.js | 47 ++++++++++++- .../signature-request.container.test.js | 1 + .../confirm-transaction.container.js | 8 ++- 10 files changed, 201 insertions(+), 17 deletions(-) diff --git a/ui/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js b/ui/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js index 35ccf6d3ac6f..0f068964d97b 100755 --- a/ui/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js +++ b/ui/components/app/confirm-page-container/confirm-page-container-navigation/confirm-page-container-navigation.component.js @@ -1,26 +1,31 @@ import React, { useContext } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { useHistory, useParams } from 'react-router-dom'; -import PropTypes from 'prop-types'; import { getCurrentChainId, getUnapprovedTransactions, + unconfirmedMessagesHashSelector, } from '../../../../selectors'; import { transactionMatchesNetwork } from '../../../../../shared/modules/transaction.utils'; import { I18nContext } from '../../../../contexts/i18n'; -import { CONFIRM_TRANSACTION_ROUTE } from '../../../../helpers/constants/routes'; +import { + CONFIRM_TRANSACTION_ROUTE, + SIGNATURE_REQUEST_PATH, +} from '../../../../helpers/constants/routes'; import { clearConfirmTransaction } from '../../../../ducks/confirm-transaction/confirm-transaction.duck'; import { hexToDecimal } from '../../../../../shared/modules/conversion.utils'; -const ConfirmPageContainerNavigation = ({ txData }) => { +const ConfirmPageContainerNavigation = () => { const t = useContext(I18nContext); const dispatch = useDispatch(); const history = useHistory(); const { id } = useParams(); const unapprovedTxs = useSelector(getUnapprovedTransactions); + const unconfirmedMessages = useSelector(unconfirmedMessagesHashSelector); const currentChainId = useSelector(getCurrentChainId); const network = hexToDecimal(currentChainId); + const isUnapprovedTxsEmpty = Object.keys(unapprovedTxs).length === 0; const currentNetworkUnapprovedTxs = Object.keys(unapprovedTxs) .filter((key) => @@ -28,7 +33,9 @@ const ConfirmPageContainerNavigation = ({ txData }) => { ) .reduce((acc, key) => ({ ...acc, [key]: unapprovedTxs[key] }), {}); - const enumUnapprovedTxs = Object.keys(currentNetworkUnapprovedTxs); + const enumUnapprovedTxs = Object.keys( + isUnapprovedTxsEmpty ? unconfirmedMessages : currentNetworkUnapprovedTxs, + ); const currentPosition = enumUnapprovedTxs.indexOf(id); @@ -43,7 +50,11 @@ const ConfirmPageContainerNavigation = ({ txData }) => { const onNextTx = (txId) => { if (txId) { dispatch(clearConfirmTransaction()); - history.push(`${CONFIRM_TRANSACTION_ROUTE}/${txId}`); + history.push( + isUnapprovedTxsEmpty + ? `${CONFIRM_TRANSACTION_ROUTE}/${txId}${SIGNATURE_REQUEST_PATH}` + : `${CONFIRM_TRANSACTION_ROUTE}/${txId}`, + ); } }; @@ -109,8 +120,4 @@ const ConfirmPageContainerNavigation = ({ txData }) => { ); }; -ConfirmPageContainerNavigation.propTypes = { - txData: PropTypes.object, -}; - export default ConfirmPageContainerNavigation; diff --git a/ui/components/app/signature-request-original/__snapshots__/signature-request-original.test.js.snap b/ui/components/app/signature-request-original/__snapshots__/signature-request-original.test.js.snap index 74fc606276cc..a6f34832fcf0 100644 --- a/ui/components/app/signature-request-original/__snapshots__/signature-request-original.test.js.snap +++ b/ui/components/app/signature-request-original/__snapshots__/signature-request-original.test.js.snap @@ -5,6 +5,76 @@ exports[`SignatureRequestOriginal should match snapshot 1`] = `
+
+ +