1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 01:39:44 +01:00

Improve transaction confirmation page performance (#16205)

* Reduce the amount of calls to insight snaps

* Add dep

* Update LavaMoat policies

* Fix selectors and revert changes to hook

* Remove dep

* Revert "Update LavaMoat policies"

This reverts commit 7469c94e0e7c52eb877766a96005cc559c9d8d20.
This commit is contained in:
Frederik Bolding 2022-10-28 10:37:33 +02:00 committed by GitHub
parent d452613f71
commit 012e9fab9d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 56 additions and 23 deletions

View File

@ -18,7 +18,7 @@ export function useTransactionInsightSnap({ transaction, chainId, snapId }) {
async function fetchInsight() {
const d = await handleSnapRequest({
snapId,
origin: 'test',
origin: '',
handler: 'onTransaction',
request: {
jsonrpc: '2.0',

View File

@ -35,6 +35,8 @@ import {
getEIP1559V2Enabled,
getIsBuyableChain,
getEnsResolutionByAddress,
getUnapprovedTransaction,
getFullTxData,
///: BEGIN:ONLY_INCLUDE_IN(flask)
getInsightSnaps,
///: END:ONLY_INCLUDE_IN
@ -98,10 +100,8 @@ const mapStateToProps = (state, ownProps) => {
} = metamask;
const { tokenData, txData, tokenProps, nonce } = confirmTransaction;
const { txParams = {}, id: transactionId, type } = txData;
const transaction =
Object.values(unapprovedTxs).find(
({ id }) => id === (transactionId || Number(paramsTransactionId)),
) || {};
const txId = transactionId || Number(paramsTransactionId);
const transaction = getUnapprovedTransaction(state, txId);
const {
from: fromAddress,
to: txParamsToAddress,
@ -148,10 +148,6 @@ const mapStateToProps = (state, ownProps) => {
gasEstimationObject,
} = transactionFeeSelector(state, transaction);
if (transaction && transaction.simulationFails) {
txData.simulationFails = transaction.simulationFails;
}
const currentNetworkUnapprovedTxs = Object.keys(unapprovedTxs)
.filter((key) =>
transactionMatchesNetwork(unapprovedTxs[key], chainId, network),
@ -168,16 +164,7 @@ const mapStateToProps = (state, ownProps) => {
const methodData = getKnownMethodData(state, data) || {};
let fullTxData = { ...txData, ...transaction };
if (customTxParamsData) {
fullTxData = {
...fullTxData,
txParams: {
...fullTxData.txParams,
data: customTxParamsData,
},
};
}
const fullTxData = getFullTxData(state, txId, customTxParamsData);
const isCollectibleTransfer = Boolean(
allCollectibleContracts?.[selectedAddress]?.[chainId]?.find((contract) => {

View File

@ -1,7 +1,14 @@
import { createSelector } from 'reselect';
///: BEGIN:ONLY_INCLUDE_IN(flask)
import { memoize } from 'lodash';
///: END:ONLY_INCLUDE_IN
import {
createSelector,
createSelectorCreator,
defaultMemoize,
} from 'reselect';
import {
///: BEGIN:ONLY_INCLUDE_IN(flask)
memoize,
///: END:ONLY_INCLUDE_IN
isEqual,
} from 'lodash';
import { addHexPrefix } from '../../app/scripts/lib/util';
import {
TEST_CHAINS,
@ -779,6 +786,45 @@ export function getShowWhatsNewPopup(state) {
return state.appState.showWhatsNewPopup;
}
const createDeepEqualSelector = createSelectorCreator(defaultMemoize, isEqual);
export const getUnapprovedTransactions = (state) =>
state.metamask.unapprovedTxs;
export const getTxData = (state) => state.confirmTransaction.txData;
export const getUnapprovedTransaction = createDeepEqualSelector(
getUnapprovedTransactions,
(_, transactionId) => transactionId,
(unapprovedTxs, transactionId) => {
return (
Object.values(unapprovedTxs).find(({ id }) => id === transactionId) || {}
);
},
);
export const getFullTxData = createDeepEqualSelector(
getTxData,
(state, transactionId) => getUnapprovedTransaction(state, transactionId),
(_state, _transactionId, customTxParamsData) => customTxParamsData,
(txData, transaction, customTxParamsData) => {
let fullTxData = { ...txData, ...transaction };
if (transaction && transaction.simulationFails) {
txData.simulationFails = transaction.simulationFails;
}
if (customTxParamsData) {
fullTxData = {
...fullTxData,
txParams: {
...fullTxData.txParams,
data: customTxParamsData,
},
};
}
return fullTxData;
},
);
///: BEGIN:ONLY_INCLUDE_IN(flask)
export function getSnaps(state) {
return state.metamask.snaps;