status-im/safe-react
2
0
Fork 0
mirror of https://github.com/status-im/safe-react.git synced 2025-02-26 00:15:23 +00:00
Code Issues Projects Releases Wiki Activity

add approving transactions

Browse Source
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 { withStyles } from '@material-ui/core/styles'
import FormControlLabel from '@material-ui/core/FormControlLabel' import FormControlLabel from '@material-ui/core/FormControlLabel'
import Checkbox from '@material-ui/core/Checkbox' import Checkbox from '@material-ui/core/Checkbox'
import { SharedSnackbarConsumer } from '~/components/SharedSnackBar'
import Modal from '~/components/Modal' import Modal from '~/components/Modal'
import Hairline from '~/components/layout/Hairline' import Hairline from '~/components/layout/Hairline'
import Button from '~/components/layout/Button' import Button from '~/components/layout/Button'
@ -22,69 +23,81 @@ type Props = {
createTransaction: Function, createTransaction: Function,
tx: Transaction, tx: Transaction,
nonce: string, nonce: string,
safeAddress: string,
} }
const ApproveTxModal = ({ const ApproveTxModal = ({
onClose, isOpen, classes, createTransaction, tx, onClose, isOpen, classes, createTransaction, tx, safeAddress,
}: Props) => { }: Props) => {
const [shouldExecuteTx, setShouldExecuteTx] = useState<boolean>(false) const [shouldExecuteTx, setShouldExecuteTx] = useState<boolean>(false)
const handleExecuteCheckbox = () => setShouldExecuteTx(prevShouldExecute => !prevShouldExecute) const handleExecuteCheckbox = () => setShouldExecuteTx(prevShouldExecute => !prevShouldExecute)
return ( return (
<Modal <SharedSnackbarConsumer>
title="Approve Transaction" {({ openSnackbar }) => {
description="Approve Transaction" const approveTx = () => {
handleClose={onClose} createTransaction(safeAddress, tx.recipient, tx.value, tx.data, openSnackbar)
open={isOpen} onClose()
// paperClassName={cn(smallerModalSize && classes.smallerModalWindow)} }
>
<Row align="center" grow className={classes.heading}> return (
<Paragraph weight="bolder" className={classes.headingText} noMargin> <Modal
Approve transaction title="Approve Transaction"
</Paragraph> description="Approve Transaction"
<IconButton onClick={onClose} disableRipple> handleClose={onClose}
<Close className={classes.closeIcon} /> open={isOpen}
</IconButton> >
</Row> <Row align="center" grow className={classes.heading}>
<Hairline /> <Paragraph weight="bolder" className={classes.headingText} noMargin>
<Block className={classes.container}> Approve transaction
<Row> </Paragraph>
<Paragraph> <IconButton onClick={onClose} disableRipple>
This action will approve this transaction. A separate transaction will be performed to submit the approval. <Close className={classes.closeIcon} />
</Paragraph> </IconButton>
<Paragraph size="sm" color="medium"> </Row>
Transaction nonce: <Hairline />
<br /> <Block className={classes.container}>
<Bold className={classes.nonceNumber}>{tx.nonce}</Bold> <Row>
</Paragraph> <Paragraph>
<Paragraph color="error"> This action will approve this transaction. A separate transaction will be performed to submit the
Approving transaction does not execute it immediately. If you want to approve and execute the transaction approval.
right away, click on checkbox below. </Paragraph>
</Paragraph> <Paragraph size="sm" color="medium">
<FormControlLabel Transaction nonce:
control={<Checkbox onChange={handleExecuteCheckbox} checked={shouldExecuteTx} color="primary" />} <br />
label="Execute transaction" <Bold className={classes.nonceNumber}>{tx.nonce}</Bold>
/> </Paragraph>
</Row> <Paragraph color="error">
</Block> Approving transaction does not execute it immediately. If you want to approve and execute the
<Row align="center" className={classes.buttonRow}> transaction right away, click on checkbox below.
<Button className={classes.button} minWidth={140} minHeight={42} onClick={onClose}> </Paragraph>
Exit <FormControlLabel
</Button> control={<Checkbox onChange={handleExecuteCheckbox} checked={shouldExecuteTx} color="primary" />}
<Button label="Execute transaction"
type="submit" />
className={classes.button} </Row>
variant="contained" </Block>
minWidth={214} <Row align="center" className={classes.buttonRow}>
minHeight={42} <Button className={classes.button} minWidth={140} minHeight={42} onClick={onClose}>
color="primary" Exit
data-testid="review-tx-btn" </Button>
> <Button
Approve Transaction type="submit"
</Button> className={classes.button}
</Row> variant="contained"
</Modal> 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 type { Dispatch as ReduxDispatch, GetState } from 'redux'
import { EMPTY_DATA } from '~/logic/wallets/ethTransactions' import { EMPTY_DATA } from '~/logic/wallets/ethTransactions'
import { userAccountSelector } from '~/logic/wallets/store/selectors' import { userAccountSelector } from '~/logic/wallets/store/selectors'
import fetchTransactions from '~/routes/safe/store/actions/fetchTransactions'
import { type GlobalState } from '~/store' import { type GlobalState } from '~/store'
import { getGnosisSafeInstanceAt } from '~/logic/contracts/safeContracts' import { getGnosisSafeInstanceAt } from '~/logic/contracts/safeContracts'
import { approveTransaction, executeTransaction, CALL } from '~/logic/safe/transactions' import { approveTransaction, executeTransaction, CALL } from '~/logic/safe/transactions'
@ -27,9 +28,11 @@ const createTransaction = (
txHash = await executeTransaction(safeInstance, to, valueInWei, txData, CALL, nonce, from) txHash = await executeTransaction(safeInstance, to, valueInWei, txData, CALL, nonce, from)
openSnackbar('Transaction has been confirmed', 'success') openSnackbar('Transaction has been confirmed', 'success')
} else { } else {
openSnackbar('Approval transaction has been submitted', 'success')
txHash = await approveTransaction(safeInstance, to, valueInWei, txData, CALL, nonce, from) 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 return txHash
} }