status-im/liquid-funding
2
0
Fork 0
mirror of https://github.com/status-im/liquid-funding.git synced 2025-01-17 23:11:10 +00:00
Code Issues Projects Releases Wiki Activity

add form control to Transfer Dialog

Browse Source
This commit is contained in:
Barry Gitarts 2018-12-03 15:54:24 -05:00
parent 98faa04238
commit 0b12e39751
1 changed files with 75 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

125
app/components/TransferDialog.jsx
View File

@ -1,4 +1,5 @@
import React from 'react' import React from 'react'
import { Formik } from 'formik'
import Button from '@material-ui/core/Button' import Button from '@material-ui/core/Button'
import TextField from '@material-ui/core/TextField' import TextField from '@material-ui/core/TextField'
import Dialog from '@material-ui/core/Dialog' import Dialog from '@material-ui/core/Dialog'
@ -6,56 +7,80 @@ import DialogActions from '@material-ui/core/DialogActions'
import DialogContent from '@material-ui/core/DialogContent' import DialogContent from '@material-ui/core/DialogContent'
import DialogContentText from '@material-ui/core/DialogContentText' import DialogContentText from '@material-ui/core/DialogContentText'
import DialogTitle from '@material-ui/core/DialogTitle' import DialogTitle from '@material-ui/core/DialogTitle'
import { getTokenLabel } from '../utils/currencies'
const TransferDialog = ({ row, handleClose }) => { const TransferDialog = ({ row, handleClose }) => (
return ( <Formik
<div> initialValues={{}}
<Dialog onSubmit={async (values, { setSubmitting, resetForm, setStatus }) => {
open={!!row} //TODO add submit handling using transfer from LiquidPledgingMock
onClose={handleClose} }}
aria-labelledby="form-dialog-title" >
> {({
<DialogTitle id="form-dialog-title">{`Transfer Funds from Pledge ${row.id}`}</DialogTitle> values,
<DialogContent> errors,
<DialogContentText> touched,
Transfer funds between pledges handleChange,
</DialogContentText> handleBlur,
<TextField handleSubmit,
autoFocus setFieldValue,
margin="normal" setStatus,
id="amount" status
name="amount" }) => (
label="Amount to transfer" <form onSubmit={handleSubmit}>
placeholder="Amount to transfer" <Dialog
variant="outlined" open={!!row}
type="number" onClose={handleClose}
autoComplete="off" aria-labelledby="form-dialog-title"
fullWidth >
/> <DialogTitle id="form-dialog-title">Transfer Funds</DialogTitle>
<TextField <DialogContent>
autoFocus <DialogContentText>
margin="normal" {`Transfer ${values.amount || ''} ${values.amount ? getTokenLabel(row[6]) : ''} from Pledge ${row.id} ${values.idReceiver ? 'to' : ''} ${values.idReceiver || ''}`}
id="idReceiver" </DialogContentText>
name="idReceiver" <TextField
label="Receiver of funds" autoFocus
placeholder="Receiver of funds" margin="normal"
variant="outlined" id="amount"
helperText="Destination of the amount, can be a Giver/Project sending to a Giver, a Delegate or a Project; a Delegate sending to another Delegate, or a Delegate pre-commiting it to a Project" name="amount"
autoComplete="off" label="Amount to transfer"
fullWidth placeholder="Amount to transfer"
/> variant="outlined"
</DialogContent> type="number"
<DialogActions> autoComplete="off"
<Button onClick={handleClose} color="primary"> fullWidth
Cancel onChange={handleChange}
</Button> onBlur={handleBlur}
<Button onClick={handleClose} color="primary"> value={values.amount || ''}
Subscribe />
</Button> <TextField
</DialogActions> autoFocus
</Dialog> margin="normal"
</div> id="idReceiver"
) name="idReceiver"
} label="Receiver of funds"
placeholder="Receiver of funds"
variant="outlined"
helperText="Destination of the amount, can be a Giver/Project sending to a Giver, a Delegate or a Project; a Delegate sending to another Delegate, or a Delegate pre-commiting it to a Project"
autoComplete="off"
fullWidth
onChange={handleChange}
onBlur={handleBlur}
value={values.idReceiver || ''}
/>
</DialogContent>
<DialogActions>
<Button onClick={handleClose} color="primary">
Cancel
</Button>
<Button onClick={handleClose} color="primary" type="submit">
Subscribe
</Button>
</DialogActions>
</Dialog>
</form>
)}
</Formik>
)
export default TransferDialog export default TransferDialog