diff --git a/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/ApproveTxModal/index.jsx b/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/ApproveTxModal/index.jsx index c6d6a159..777613bf 100644 --- a/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/ApproveTxModal/index.jsx +++ b/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/ApproveTxModal/index.jsx @@ -1,5 +1,5 @@ // @flow -import React from 'react' +import React, { useState } from 'react' import Close from '@material-ui/icons/Close' import IconButton from '@material-ui/core/IconButton' import { withStyles } from '@material-ui/core/styles' @@ -12,6 +12,7 @@ import Row from '~/components/layout/Row' import Bold from '~/components/layout/Bold' import Block from '~/components/layout/Block' import Paragraph from '~/components/layout/Paragraph' +import { type Transaction } from '~/routes/safe/store/models/transaction' import { styles } from './style' type Props = { @@ -19,62 +20,72 @@ type Props = { classes: Object, isOpen: boolean, createTransaction: Function, + tx: Transaction, nonce: string, } const ApproveTxModal = ({ - onClose, isOpen, classes, createTransaction, nonce, -}: Props) => ( - - - - Approve transaction - - - - - - - - - - This action will approve this transaction. A separate transaction will be performed to submit the approval. + onClose, isOpen, classes, createTransaction, tx, +}: Props) => { + const [shouldExecuteTx, setShouldExecuteTx] = useState(false) + + const handleExecuteCheckbox = () => setShouldExecuteTx(prevShouldExecute => !prevShouldExecute) + + return ( + + + + Approve transaction - - Transaction nonce: -
- {nonce} -
- - Approving transaction does not execute it immediately. If you want to approve and execute the transaction - right away, click on checkbox below. - - } label="Execute transaction" /> + + +
-
- - - - -
-) + + + + + This action will approve this transaction. A separate transaction will be performed to submit the approval. + + + Transaction nonce: +
+ {tx.nonce} +
+ + Approving transaction does not execute it immediately. If you want to approve and execute the transaction + right away, click on checkbox below. + + } + label="Execute transaction" + /> +
+
+ + + + + + ) +} export default withStyles(styles)(ApproveTxModal) diff --git a/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/CancelTxModal/index.jsx b/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/CancelTxModal/index.jsx index dc0fe004..6c6a787e 100644 --- a/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/CancelTxModal/index.jsx +++ b/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/CancelTxModal/index.jsx @@ -10,6 +10,7 @@ import Row from '~/components/layout/Row' import Bold from '~/components/layout/Bold' import Block from '~/components/layout/Block' import Paragraph from '~/components/layout/Paragraph' +import { type Transaction } from '~/routes/safe/store/models/transaction' import { styles } from './style' type Props = { @@ -17,11 +18,11 @@ type Props = { classes: Object, isOpen: boolean, createTransaction: Function, - nonce: string, + tx: Transaction, } const CancelTxModal = ({ - onClose, isOpen, classes, createTransaction, nonce, + onClose, isOpen, classes, createTransaction, tx, }: Props) => ( Transaction nonce:
- {nonce} + {tx.nonce} diff --git a/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/index.jsx b/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/index.jsx index 77c0310c..3e380080 100644 --- a/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/index.jsx +++ b/src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/index.jsx @@ -117,7 +117,7 @@ const ExpandedTx = ({ {' '} {tx.symbol} {' '} -to: + to:
@@ -141,8 +141,8 @@ to: - - + + ) }