status-im
/
safe-react
mirror of https://github.com/status-im/safe-react.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

add approving transactions

This commit is contained in:
Mikhail Mikheev 2019-07-04 17:39:16 +04:00
parent ea8a108bb0
commit 44f3a45158
2 changed files with 71 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

121
src/routes/safe/components/TransactionsNew/TxsTable/ExpandedTx/ApproveTxModal/index.jsx
View File

@ -5,6 +5,7 @@ import IconButton from '@material-ui/core/IconButton'
import { withStyles } from '@material-ui/core/styles'
import FormControlLabel from '@material-ui/core/FormControlLabel'
import Checkbox from '@material-ui/core/Checkbox'
import { SharedSnackbarConsumer } from '~/components/SharedSnackBar'
import Modal from '~/components/Modal'
import Hairline from '~/components/layout/Hairline'
import Button from '~/components/layout/Button'
@ -22,69 +23,81 @@ type Props = {
createTransaction: Function,
tx: Transaction,
nonce: string,
safeAddress: string,
}
const ApproveTxModal = ({
onClose, isOpen, classes, createTransaction, tx,
onClose, isOpen, classes, createTransaction, tx, safeAddress,
}: Props) => {
const [shouldExecuteTx, setShouldExecuteTx] = useState<boolean>(false)
const handleExecuteCheckbox = () => setShouldExecuteTx(prevShouldExecute => !prevShouldExecute)
return (
<Modal
title="Approve Transaction"
description="Approve Transaction"
handleClose={onClose}
open={isOpen}
// paperClassName={cn(smallerModalSize && classes.smallerModalWindow)}
>
<Row align="center" grow className={classes.heading}>
<Paragraph weight="bolder" className={classes.headingText} noMargin>
Approve transaction
</Paragraph>
<IconButton onClick={onClose} disableRipple>
<Close className={classes.closeIcon} />
</IconButton>
</Row>
<Hairline />
<Block className={classes.container}>
<Row>
<Paragraph>
This action will approve this transaction. A separate transaction will be performed to submit the approval.
</Paragraph>
<Paragraph size="sm" color="medium">
Transaction nonce:
<br />
<Bold className={classes.nonceNumber}>{tx.nonce}</Bold>
</Paragraph>
<Paragraph color="error">
Approving transaction does not execute it immediately. If you want to approve and execute the transaction
right away, click on checkbox below.
</Paragraph>
<FormControlLabel
control={<Checkbox onChange={handleExecuteCheckbox} checked={shouldExecuteTx} color="primary" />}
label="Execute transaction"
/>
</Row>
</Block>
<Row align="center" className={classes.buttonRow}>
<Button className={classes.button} minWidth={140} minHeight={42} onClick={onClose}>
Exit
</Button>
<Button
type="submit"
className={classes.button}
variant="contained"
minWidth={214}
minHeight={42}
color="primary"
data-testid="review-tx-btn"
>
Approve Transaction
</Button>
</Row>
</Modal>
<SharedSnackbarConsumer>
{({ openSnackbar }) => {
const approveTx = () => {
createTransaction(safeAddress, tx.recipient, tx.value, tx.data, openSnackbar)
onClose()
}
return (
<Modal
title="Approve Transaction"
description="Approve Transaction"
handleClose={onClose}
open={isOpen}
>
<Row align="center" grow className={classes.heading}>
<Paragraph weight="bolder" className={classes.headingText} noMargin>
Approve transaction
</Paragraph>
<IconButton onClick={onClose} disableRipple>
<Close className={classes.closeIcon} />
</IconButton>
</Row>
<Hairline />
<Block className={classes.container}>
<Row>
<Paragraph>
This action will approve this transaction. A separate transaction will be performed to submit the
approval.
</Paragraph>
<Paragraph size="sm" color="medium">
Transaction nonce:
<br />
<Bold className={classes.nonceNumber}>{tx.nonce}</Bold>
</Paragraph>
<Paragraph color="error">
Approving transaction does not execute it immediately. If you want to approve and execute the
transaction right away, click on checkbox below.
</Paragraph>
<FormControlLabel
control={<Checkbox onChange={handleExecuteCheckbox} checked={shouldExecuteTx} color="primary" />}
label="Execute transaction"
/>
</Row>
</Block>
<Row align="center" className={classes.buttonRow}>
<Button className={classes.button} minWidth={140} minHeight={42} onClick={onClose}>
Exit
</Button>
<Button
type="submit"
className={classes.button}
variant="contained"
minWidth={214}
minHeight={42}
color="primary"
onClick={approveTx}
>
Approve Transaction
</Button>
</Row>
</Modal>
)
}}
</SharedSnackbarConsumer>
)
}

5
src/routes/safe/store/actions/createTransaction.js
View File

@ -2,6 +2,7 @@
import type { Dispatch as ReduxDispatch, GetState } from 'redux'
import { EMPTY_DATA } from '~/logic/wallets/ethTransactions'
import { userAccountSelector } from '~/logic/wallets/store/selectors'
import fetchTransactions from '~/routes/safe/store/actions/fetchTransactions'
import { type GlobalState } from '~/store'
import { getGnosisSafeInstanceAt } from '~/logic/contracts/safeContracts'
import { approveTransaction, executeTransaction, CALL } from '~/logic/safe/transactions'
@ -27,9 +28,11 @@ const createTransaction = (
txHash = await executeTransaction(safeInstance, to, valueInWei, txData, CALL, nonce, from)
openSnackbar('Transaction has been confirmed', 'success')
} else {
openSnackbar('Approval transaction has been submitted', 'success')
txHash = await approveTransaction(safeInstance, to, valueInWei, txData, CALL, nonce, from)
openSnackbar('Approval transaction has been confirmed', 'success')
}
// dispatch(addTransactions(txHash))
dispatch(fetchTransactions(safeAddress))
return txHash
}