diff --git a/src/components/tx-flow/common/TxLayout/index.tsx b/src/components/tx-flow/common/TxLayout/index.tsx index a7bf19f0dd..49835873f4 100644 --- a/src/components/tx-flow/common/TxLayout/index.tsx +++ b/src/components/tx-flow/common/TxLayout/index.tsx @@ -24,6 +24,7 @@ type TxLayoutProps = { txSummary?: TransactionSummary onBack?: () => void hideNonce?: boolean + isBatch?: boolean isReplacement?: boolean } @@ -36,6 +37,7 @@ const TxLayout = ({ txSummary, onBack, hideNonce = false, + isBatch = false, isReplacement = false, }: TxLayoutProps): ReactElement => { const [statusVisible, setStatusVisible] = useState(true) @@ -122,6 +124,7 @@ const TxLayout = ({ txSummary={txSummary} handleClose={() => setStatusVisible(false)} isReplacement={isReplacement} + isBatch={isBatch} /> )} diff --git a/src/components/tx-flow/common/TxStatusWidget/index.tsx b/src/components/tx-flow/common/TxStatusWidget/index.tsx index 0b1a183967..60579490c9 100644 --- a/src/components/tx-flow/common/TxStatusWidget/index.tsx +++ b/src/components/tx-flow/common/TxStatusWidget/index.tsx @@ -24,11 +24,13 @@ const TxStatusWidget = ({ txSummary, handleClose, isReplacement = false, + isBatch = false, }: { step: number txSummary?: TransactionSummary handleClose: () => void isReplacement?: boolean + isBatch?: boolean }) => { const isDarkMode = useDarkMode() const wallet = useWallet() @@ -62,28 +64,34 @@ const TxStatusWidget = ({ - {isReplacement ? 'Create replacement transaction' : 'Create'} + {isReplacement ? 'Create replacement transaction' : isBatch ? 'Queue transactions' : 'Create'} - + - {confirmedMessage(threshold, confirmationsSubmitted)} - {canSign && ( - ({ - bgcolor: isDarkMode ? `${palette.primary.main}` : `${palette.secondary.main}`, - color: isDarkMode ? `${palette.text.secondary}` : `${palette.text.primary}`, - })} - > - +1 - + {isBatch ? ( + 'Create batch' + ) : ( + <> + {confirmedMessage(threshold, confirmationsSubmitted)} + {canSign && ( + ({ + bgcolor: isDarkMode ? `${palette.primary.main}` : `${palette.secondary.main}`, + color: isDarkMode ? `${palette.text.secondary}` : `${palette.text.primary}`, + })} + > + +1 + + )} + )} diff --git a/src/components/tx-flow/flows/ExecuteBatch/DecodedTxs.tsx b/src/components/tx-flow/flows/ExecuteBatch/DecodedTxs.tsx index 6afab097dc..94c9b92193 100644 --- a/src/components/tx-flow/flows/ExecuteBatch/DecodedTxs.tsx +++ b/src/components/tx-flow/flows/ExecuteBatch/DecodedTxs.tsx @@ -43,7 +43,7 @@ const DecodedTxs = ({ txs }: { txs: TransactionDetails[] | undefined }) => { operation: 0, }} txData={transaction.txData} - actionTitle={`Action ${idx + 1}`} + actionTitle={`${idx + 1}`} showDelegateCallWarning={false} /> ) diff --git a/src/components/tx-flow/flows/ExecuteBatch/ReviewBatch.tsx b/src/components/tx-flow/flows/ExecuteBatch/ReviewBatch.tsx index c4c3018596..84c3de4ceb 100644 --- a/src/components/tx-flow/flows/ExecuteBatch/ReviewBatch.tsx +++ b/src/components/tx-flow/flows/ExecuteBatch/ReviewBatch.tsx @@ -1,6 +1,6 @@ -import { Typography, Button, CardActions, Divider } from '@mui/material' +import { Typography, Button, CardActions, Divider, Alert } from '@mui/material' import { encodeMultiSendData } from '@safe-global/safe-core-sdk/dist/src/utils/transactions/utils' -import { useState, useMemo } from 'react' +import { useState, useMemo, useContext } from 'react' import type { SyntheticEvent } from 'react' import type { TransactionDetails } from '@safe-global/safe-gateway-typescript-sdk' @@ -28,6 +28,7 @@ import { asError } from '@/services/exceptions/utils' import SendToBlock from '@/components/tx-flow/flows/TokenTransfer/SendToBlock' import ConfirmationTitle, { ConfirmationTitleTypes } from '@/components/tx/SignOrExecuteForm/ConfirmationTitle' import commonCss from '@/components/tx-flow/common/styles.module.css' +import { TxModalContext } from '@/components/tx-flow' export const ReviewBatch = ({ params }: { params: ExecuteBatchFlowProps }) => { const [isSubmittable, setIsSubmittable] = useState(true) @@ -36,6 +37,7 @@ export const ReviewBatch = ({ params }: { params: ExecuteBatchFlowProps }) => { const chain = useCurrentChain() const { safe } = useSafeInfo() const [relays] = useRelaysBySafe() + const { setTxFlow } = useContext(TxModalContext) // Chain has relaying feature and available relays const canRelay = hasRemainingRelays(relays) @@ -95,6 +97,7 @@ export const ReviewBatch = ({ params }: { params: ExecuteBatchFlowProps }) => { try { await (willRelay ? onRelay() : onExecute()) + setTxFlow(undefined) } catch (_err) { const err = asError(_err) logError(Errors._804, err) @@ -159,10 +162,10 @@ export const ReviewBatch = ({ params }: { params: ExecuteBatchFlowProps }) => { ) : null} - + Be aware that if any of the included transactions revert, none of them will be executed. This will result in the loss of the allocated transaction fees. - + {error && ( diff --git a/src/components/tx-flow/flows/ExecuteBatch/index.tsx b/src/components/tx-flow/flows/ExecuteBatch/index.tsx index a27326189f..a2b9143adb 100644 --- a/src/components/tx-flow/flows/ExecuteBatch/index.tsx +++ b/src/components/tx-flow/flows/ExecuteBatch/index.tsx @@ -10,7 +10,7 @@ export type ExecuteBatchFlowProps = { const ExecuteBatchFlow = (props: ExecuteBatchFlowProps) => { return ( - + )