diff --git a/types/api/transaction.ts b/types/api/transaction.ts index c76f2f9a19..6e64834251 100644 --- a/types/api/transaction.ts +++ b/types/api/transaction.ts @@ -14,6 +14,12 @@ export type TransactionRevertReason = { type WrappedTransactionFields = 'decoded_input' | 'fee' | 'gas_limit' | 'gas_price' | 'hash' | 'max_fee_per_gas' | 'max_priority_fee_per_gas' | 'method' | 'nonce' | 'raw_input' | 'to' | 'type' | 'value'; +export interface OpWithdrawal { + l1_transaction_hash: string; + nonce: number; + status: L2WithdrawalStatus; +} + export type Transaction = { to: AddressParam | null; created_contract: AddressParam | null; @@ -54,8 +60,7 @@ export type Transaction = { l1_gas_used?: string; has_error_in_internal_txs: boolean | null; // optimism fields - op_withdrawal_status?: L2WithdrawalStatus; - op_l1_transaction_hash?: string; + op_withdrawals?: Array; // SUAVE fields execution_node?: AddressParam | null; allowed_peekers?: Array; diff --git a/ui/shared/verificationSteps/VerificationStep.tsx b/ui/shared/verificationSteps/VerificationStep.tsx index 38d78462fb..17a7c98632 100644 --- a/ui/shared/verificationSteps/VerificationStep.tsx +++ b/ui/shared/verificationSteps/VerificationStep.tsx @@ -1,4 +1,4 @@ -import { Text, HStack } from '@chakra-ui/react'; +import { HStack, Box } from '@chakra-ui/react'; import React from 'react'; import type { Step } from './types'; @@ -17,7 +17,7 @@ const VerificationStep = ({ step, isLast, isPassed }: Props) => { return ( - { typeof step === 'string' ? step : step.content } + { typeof step === 'string' ? step : step.content } { !isLast && } ); diff --git a/ui/shared/verificationSteps/VerificationSteps.tsx b/ui/shared/verificationSteps/VerificationSteps.tsx index 0c55e8fb06..a7a6c506d8 100644 --- a/ui/shared/verificationSteps/VerificationSteps.tsx +++ b/ui/shared/verificationSteps/VerificationSteps.tsx @@ -30,7 +30,7 @@ const VerificationSteps = ({ currentStep, steps, isLoading, rightSlot, className > { steps.map((step, index) => ( { ) } - + { config.features.optimisticRollup.isEnabled && data.op_withdrawals && data.op_withdrawals.length > 0 && ( + + + { data.op_withdrawals.map((withdrawal) => ( + + + Nonce: + { withdrawal.nonce } + + + + )) } + + + ) } { data.zkevm_status && ( { const component = await mount( - + + + , ); diff --git a/ui/tx/details/TxDetailsWithdrawalStatus.tsx b/ui/tx/details/TxDetailsWithdrawalStatus.tsx index 5bc99d8cbb..fd8564b871 100644 --- a/ui/tx/details/TxDetailsWithdrawalStatus.tsx +++ b/ui/tx/details/TxDetailsWithdrawalStatus.tsx @@ -4,8 +4,6 @@ import React from 'react'; import type { L2WithdrawalStatus } from 'types/api/l2Withdrawals'; import { WITHDRAWAL_STATUSES } from 'types/api/l2Withdrawals'; -import config from 'configs/app'; -import DetailsInfoItem from 'ui/shared/DetailsInfoItem'; import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1'; import VerificationSteps from 'ui/shared/verificationSteps/VerificationSteps'; @@ -15,10 +13,6 @@ interface Props { } const TxDetailsWithdrawalStatus = ({ status, l1TxHash }: Props) => { - if (!config.features.optimisticRollup.isEnabled) { - return null; - } - if (!status || !WITHDRAWAL_STATUSES.includes(status)) { return null; } @@ -55,23 +49,18 @@ const TxDetailsWithdrawalStatus = ({ status, l1TxHash }: Props) => { href="https://app.optimism.io/bridge/withdraw" target="_blank" > - Claim funds + Claim funds ) : null; return ( - - } - currentStep={ status } - rightSlot={ rightSlot } - my={ hasClaimButton ? '-6px' : 0 } - lineHeight={ hasClaimButton ? 8 : undefined } - /> - + } + currentStep={ status } + rightSlot={ rightSlot } + my={ hasClaimButton ? '-6px' : 0 } + lineHeight={ hasClaimButton ? 8 : undefined } + /> ); }; diff --git a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Ready-for-relay-1.png b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Ready-for-relay-1.png index 7f22f779ea..32b575c41d 100644 Binary files a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Ready-for-relay-1.png and b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Ready-for-relay-1.png differ diff --git a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Relayed-1.png b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Relayed-1.png index de0211aa9a..b18b962eed 100644 Binary files a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Relayed-1.png and b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Relayed-1.png differ diff --git a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Waiting-for-state-root-1.png b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Waiting-for-state-root-1.png index a2d70d6297..3e47297064 100644 Binary files a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Waiting-for-state-root-1.png and b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Waiting-for-state-root-1.png differ