2018-03-26 23:32:43 +02:00
|
|
|
// @flow
|
2017-12-21 22:08:54 +01:00
|
|
|
import React from 'react';
|
2018-10-29 18:23:53 +01:00
|
|
|
import * as MODALS from 'constants/modal_types';
|
2018-03-26 23:32:43 +02:00
|
|
|
import Button from 'component/button';
|
|
|
|
import { Form, FormRow, FormField } from 'component/common/form';
|
|
|
|
import { Formik } from 'formik';
|
|
|
|
import { validateSendTx } from 'util/form-validation';
|
2017-05-11 02:59:47 +02:00
|
|
|
|
2018-03-26 23:32:43 +02:00
|
|
|
type DraftTransaction = {
|
|
|
|
address: string,
|
2018-04-25 23:40:56 +02:00
|
|
|
amount: ?number, // So we can use a placeholder in the input
|
2018-03-26 23:32:43 +02:00
|
|
|
};
|
2017-05-11 02:59:47 +02:00
|
|
|
|
2018-03-26 23:32:43 +02:00
|
|
|
type Props = {
|
2018-05-28 21:53:15 +02:00
|
|
|
openModal: ({ id: string }, { address: string, amount: number }) => void,
|
2018-03-26 23:32:43 +02:00
|
|
|
balance: number,
|
|
|
|
};
|
|
|
|
|
|
|
|
class WalletSend extends React.PureComponent<Props> {
|
|
|
|
constructor() {
|
|
|
|
super();
|
|
|
|
|
|
|
|
(this: any).handleSubmit = this.handleSubmit.bind(this);
|
|
|
|
}
|
|
|
|
|
|
|
|
handleSubmit(values: DraftTransaction) {
|
2018-05-28 21:53:15 +02:00
|
|
|
const { openModal } = this.props;
|
2018-04-25 23:40:56 +02:00
|
|
|
const { address, amount } = values;
|
|
|
|
if (amount && address) {
|
2018-05-28 21:53:15 +02:00
|
|
|
const modalProps = { address, amount };
|
2018-10-29 18:23:53 +01:00
|
|
|
openModal(MODALS.CONFIRM_TRANSACTION, modalProps);
|
2018-04-25 23:40:56 +02:00
|
|
|
}
|
2017-09-11 03:25:24 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
render() {
|
2018-03-26 23:32:43 +02:00
|
|
|
const { balance } = this.props;
|
2017-09-11 03:25:24 +02:00
|
|
|
|
|
|
|
return (
|
2018-03-26 23:32:43 +02:00
|
|
|
<section className="card card--section">
|
|
|
|
<div className="card__title">{__('Send Credits')}</div>
|
|
|
|
<div className="card__content">
|
|
|
|
<Formik
|
|
|
|
initialValues={{
|
|
|
|
address: '',
|
|
|
|
amount: '',
|
|
|
|
}}
|
|
|
|
onSubmit={this.handleSubmit}
|
|
|
|
validate={validateSendTx}
|
|
|
|
render={({ values, errors, touched, handleChange, handleBlur, handleSubmit }) => (
|
|
|
|
<Form onSubmit={handleSubmit}>
|
|
|
|
<FormRow>
|
|
|
|
<FormField
|
|
|
|
type="number"
|
|
|
|
name="amount"
|
|
|
|
label={__('Amount')}
|
|
|
|
postfix={__('LBC')}
|
|
|
|
className="input--price-amount"
|
2018-06-14 22:10:50 +02:00
|
|
|
affixClass="form-field--fix-no-height"
|
2018-03-26 23:32:43 +02:00
|
|
|
min="0"
|
2018-04-06 03:59:14 +02:00
|
|
|
step="any"
|
2018-06-14 22:10:50 +02:00
|
|
|
placeholder="12.34"
|
2018-03-26 23:32:43 +02:00
|
|
|
onChange={handleChange}
|
|
|
|
onBlur={handleBlur}
|
|
|
|
value={values.amount}
|
|
|
|
error={
|
|
|
|
(!!values.amount && touched.amount && errors.amount) ||
|
2018-06-18 08:34:59 +02:00
|
|
|
(values.amount === balance &&
|
|
|
|
__('Decrease amount to account for transaction fee')) ||
|
|
|
|
(values.amount > balance && __('Not enough credits'))
|
2018-03-26 23:32:43 +02:00
|
|
|
}
|
|
|
|
/>
|
2018-06-18 08:34:59 +02:00
|
|
|
</FormRow>
|
|
|
|
<FormRow padded>
|
2018-03-26 23:32:43 +02:00
|
|
|
<FormField
|
|
|
|
type="text"
|
|
|
|
name="address"
|
|
|
|
placeholder="bbFxRyXXXXXXXXXXXZD8nE7XTLUxYnddTs"
|
|
|
|
className="input--address"
|
|
|
|
label={__('Recipient address')}
|
|
|
|
error={!!values.address && touched.address && errors.address}
|
|
|
|
onChange={handleChange}
|
|
|
|
onBlur={handleBlur}
|
|
|
|
value={values.address}
|
|
|
|
/>
|
|
|
|
</FormRow>
|
|
|
|
<div className="card__actions">
|
|
|
|
<Button
|
|
|
|
button="primary"
|
|
|
|
type="submit"
|
|
|
|
label={__('Send')}
|
|
|
|
disabled={
|
|
|
|
!values.address ||
|
|
|
|
!!Object.keys(errors).length ||
|
2018-06-18 08:34:59 +02:00
|
|
|
!(parseFloat(values.amount) > 0.0) ||
|
|
|
|
parseFloat(values.amount) === balance
|
2018-03-26 23:32:43 +02:00
|
|
|
}
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</Form>
|
|
|
|
)}
|
|
|
|
/>
|
|
|
|
</div>
|
2017-09-11 03:25:24 +02:00
|
|
|
</section>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
2017-05-11 02:59:47 +02:00
|
|
|
|
2017-06-06 06:21:55 +02:00
|
|
|
export default WalletSend;
|