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

simplify pledging table state

This commit is contained in:
Barry Gitarts 2019-02-08 22:23:54 -05:00 committed by Barry G
parent afbe538949
commit 7e813610f4
4 changed files with 48 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
app/components/PledgesTable.jsx
View File

@ -68,15 +68,13 @@ class PledgesTable extends Component {
} }
handleClose = () => { handleClose = () => {
this.setState({ row: false }) this.setState({ rowData: null })
} }
clearRowData = () => this.setState({ rowData: null })
render() { render() {
const { data, row, rowData } = this.state const { data, rowData } = this.state
return ( return (
<Fragment> <div>
<MaterialTable <MaterialTable
columns={[ columns={[
{ title: 'Pledge Id', field: 'pledgeId', type: 'numeric' }, { title: 'Pledge Id', field: 'pledgeId', type: 'numeric' },
@ -96,7 +94,10 @@ class PledgesTable extends Component {
icon: 'compare_arrows', icon: 'compare_arrows',
tooltip: 'Transfer funds', tooltip: 'Transfer funds',
onClick: (event, rowData) => { onClick: (event, rowData) => {
this.handleClickOpen(rowData) const { timeStamp } = event
this.setState({
rowData: { ...rowData, timeStamp, type: 'transfer' }
})
} }
}, },
{ {
@ -106,16 +107,16 @@ class PledgesTable extends Component {
const { timeStamp } = event const { timeStamp } = event
console.log({rowData}) console.log({rowData})
this.setState({ this.setState({
rowData: { ...rowData, timeStamp } rowData: { ...rowData, timeStamp, type: 'withdraw' }
}) })
} }
} }
]} ]}
/> />
{!rowData && <div/>} {!rowData && <div/>}
{rowData && <WithdrawCard rowData={rowData} clearRowData={this.clearRowData} />} {rowData && rowData.type === 'withdraw' && <WithdrawCard rowData={rowData} handleClose={this.handleClose} />}
{row && <TransferCard row={row} handleClose={this.handleClose} />} {rowData && rowData.type === 'transfer' && <TransferCard row={rowData} handleClose={this.handleClose} />}
</Fragment> </div>
) )
} }
} }

3
app/components/table/CardStyles.js
View File

@ -8,9 +8,6 @@ const styles = {
borderBottom: '1px solid lightgray', borderBottom: '1px solid lightgray',
backgroundColor: indigo[50] backgroundColor: indigo[50]
}, },
container: {
height: '35%'
},
bullet: { bullet: {
display: 'inline-block', display: 'inline-block',
margin: '0 2px', margin: '0 2px',

44
app/components/table/TransferCard.jsx
View File

@ -38,27 +38,27 @@ function TransferCard({ row, handleClose, classes }) {
const estimatedGas = await toSend.estimateGas() const estimatedGas = await toSend.estimateGas()
toSend toSend
.send({gas: estimatedGas + 1000}) .send({gas: estimatedGas + 1000})
.then(async res => { .then(async res => {
console.log({res}) console.log({res})
const { events: { Transfer } } = res const { events: { Transfer } } = res
if (Array.isArray(Transfer)) { if (Array.isArray(Transfer)) {
Transfer.forEach(async t => { Transfer.forEach(async t => {
const { to, amount } = t.returnValues const { to, amount } = t.returnValues
await pledge.transferTo(to, amount) await pledge.transferTo(to, amount)
}) })
} else { } else {
const { to, amount } = Transfer.returnValues const { to, amount } = Transfer.returnValues
await pledge.transferTo(to, amount) await pledge.transferTo(to, amount)
} }
}) })
.catch(e => { .catch(e => {
console.log({e}) console.log({e})
}) })
.finally(() => { .finally(() => {
close() close()
resetForm() resetForm()
}) })
}} }}
> >
{({ {({
@ -73,7 +73,7 @@ function TransferCard({ row, handleClose, classes }) {
setStatus, setStatus,
status status
}) => ( }) => (
<Collapse in={show} classes={{ wrapper: classes.container }}> <Collapse in={show} >
<form onSubmit={handleSubmit} autoComplete="off"> <form onSubmit={handleSubmit} autoComplete="off">
<Card className={classes.card} elevation={0}> <Card className={classes.card} elevation={0}>
<CardContent> <CardContent>

27
app/components/table/WithdrawCard.jsx
View File

@ -21,7 +21,7 @@ import styles from './CardStyles'
const { withdraw } = LiquidPledging.methods const { withdraw } = LiquidPledging.methods
const { confirmPayment } = LPVault.methods const { confirmPayment } = LPVault.methods
function Withdraw({ clearRowData, classes, rowData, authorizedPayment }) { function Withdraw({ handleClose, classes, rowData, authorizedPayment }) {
const [show, setShow] = useState(null) const [show, setShow] = useState(null)
const [rowId, setRowId] = useState(rowData.pledgeId) const [rowId, setRowId] = useState(rowData.pledgeId)
@ -38,7 +38,7 @@ function Withdraw({ clearRowData, classes, rowData, authorizedPayment }) {
const close = () => { const close = () => {
setShow(false) setShow(false)
setTimeout(() => { clearRowData() }, 500) setTimeout(() => { handleClose() }, 500)
} }
const isPaying = rowData.pledgeState === 'Paying' const isPaying = rowData.pledgeState === 'Paying'
@ -53,16 +53,17 @@ function Withdraw({ clearRowData, classes, rowData, authorizedPayment }) {
try { try {
const toSend = sendFn(...args) const toSend = sendFn(...args)
const estimateGas = await toSend.estimateGas() const estimateGas = await toSend.estimateGas()
toSend.send({ gas: estimateGas + 1000 }) toSend
.then(res => { .send({ gas: estimateGas + 1000 })
console.log({res}) .then(res => {
}) console.log({res})
.catch(e => { })
console.log({e}) .catch(e => {
}) console.log({e})
.finally(() => { })
close() .finally(() => {
}) close()
})
} catch (error) { } catch (error) {
console.log(error) console.log(error)
} }
@ -114,7 +115,7 @@ function Withdraw({ clearRowData, classes, rowData, authorizedPayment }) {
Withdraw.propTypes = { Withdraw.propTypes = {
classes: PropTypes.object.isRequired, classes: PropTypes.object.isRequired,
rowData: PropTypes.object.isRequired, rowData: PropTypes.object.isRequired,
clearRowData: PropTypes.func.isRequired, handleClose: PropTypes.func.isRequired,
authorizedPayment: PropTypes.array.isRequired authorizedPayment: PropTypes.array.isRequired
} }