From 119b0d4c1b59309fcf60f1c6f4134c1f6573eb62 Mon Sep 17 00:00:00 2001 From: Jyoti Puri Date: Thu, 22 Aug 2024 18:44:06 +0530 Subject: [PATCH 01/17] Adding context to get current confirmation --- test/data/confirmations/helper.ts | 91 +++++++++++++++++++ test/lib/confirmations/render-helpers.tsx | 31 +++++++ ui/pages/confirmations/confirm/confirm.tsx | 55 +++++------ .../confirmations/context/confirm/index.tsx | 34 +++++++ 4 files changed, 185 insertions(+), 26 deletions(-) create mode 100644 test/data/confirmations/helper.ts create mode 100644 test/lib/confirmations/render-helpers.tsx create mode 100644 ui/pages/confirmations/context/confirm/index.tsx diff --git a/test/data/confirmations/helper.ts b/test/data/confirmations/helper.ts new file mode 100644 index 000000000000..8596060bf53e --- /dev/null +++ b/test/data/confirmations/helper.ts @@ -0,0 +1,91 @@ +import { ApprovalType } from '@metamask/controller-utils'; +import { + TransactionStatus, + TransactionType, +} from '@metamask/transaction-controller'; + +import mockState from '../mock-state.json'; + +type RootState = { metamask: Record } & Record< + string, + unknown +>; + +export const getExampleMockSignatureConfirmState = ( + args: RootState = { metamask: {} }, +) => ({ + ...mockState, + ...args, + metamask: { + ...mockState.metamask, + preferences: { + redesignedTransactionsEnabled: true, + redesignedConfirmationsEnabled: true, + isRedesignedConfirmationsDeveloperEnabled: true, + }, + pendingApprovals: { + '123': { + id: '123', + type: ApprovalType.EthSignTypedData, + }, + }, + unapprovedTypedMessages: { + '123': { + id: '123', + chainId: mockState.metamask.providerConfig.chainId, + type: TransactionType.signTypedData, + status: TransactionStatus.unapproved, + txParams: { from: Object.keys(mockState.metamask.identities)[0] }, + msgParams: { + signatureMethod: 'eth_signTypedData_v4' + } + }, + }, + ...args.metamask, + }, +}); + +export const getExampleMockContractInteractionConfirmState = ( + args: RootState = { metamask: {} }, +) => ({ + ...mockState, + ...args, + metamask: { + ...mockState.metamask, + preferences: { + redesignedTransactionsEnabled: true, + redesignedConfirmationsEnabled: true, + isRedesignedConfirmationsDeveloperEnabled: true, + }, + pendingApprovals: { + '123': { + id: '123', + type: ApprovalType.Transaction, + }, + }, + transactions: [ + { + id: '123', + type: TransactionType.contractInteraction, + chainId: mockState.metamask.providerConfig.chainId, + status: TransactionStatus.unapproved, + txParams: { from: Object.keys(mockState.metamask.identities)[0] }, + }, + ], + ...args.metamask, + }, +}); + +export const getMockConfirmState = (args: RootState = { metamask: {} }) => ({ + ...mockState, + ...args, + metamask: { + ...mockState.metamask, + preferences: { + redesignedTransactionsEnabled: true, + redesignedConfirmationsEnabled: true, + isRedesignedConfirmationsDeveloperEnabled: true, + }, + ...args.metamask, + }, +}); diff --git a/test/lib/confirmations/render-helpers.tsx b/test/lib/confirmations/render-helpers.tsx new file mode 100644 index 000000000000..c123b3117ff8 --- /dev/null +++ b/test/lib/confirmations/render-helpers.tsx @@ -0,0 +1,31 @@ +import React, { ReactElement } from 'react'; + +import { ConfirmContextProvider } from '../../../ui/pages/confirmations/context/confirm'; +import { renderHookWithProvider, renderWithProvider } from '../render-helpers'; + +export function renderWithConfirmContextProvider( + component: ReactElement, + store: unknown, + pathname = '/', +) { + return renderWithProvider( + {component}, + store, + pathname, + ); +} + +export function renderHookWithConfirmContextProvider( + hook: () => unknown, + state: Record, + pathname = '/', + Container?: ReactElement, +) { + const contextContainer = Container ? ( + {Container} + ) : ( + ConfirmContextProvider + ); + + return renderHookWithProvider(hook, state, pathname, contextContainer); +} diff --git a/ui/pages/confirmations/confirm/confirm.tsx b/ui/pages/confirmations/confirm/confirm.tsx index 10907aeaa88c..8f98cef1e9a7 100644 --- a/ui/pages/confirmations/confirm/confirm.tsx +++ b/ui/pages/confirmations/confirm/confirm.tsx @@ -20,6 +20,7 @@ import EditGasFeePopover from '../components/edit-gas-fee-popover'; import { NetworkChangeToast } from '../components/confirm/network-change-toast'; import setCurrentConfirmation from '../hooks/setCurrentConfirmation'; import syncConfirmPath from '../hooks/syncConfirmPath'; +import { ConfirmContextProvider } from '../context/confirm'; const EIP1559TransactionGasModal = () => { return ( @@ -35,32 +36,34 @@ const Confirm = () => { syncConfirmPath(); return ( - - {/* This context should be removed once we implement the new edit gas fees popovers */} - - - - -