move tipping into payment create flow tab (#84)
This commit is contained in:
parent
7936b418f4
commit
94dc22b879
|
@ -6,6 +6,7 @@ import { DONATION } from 'utils/constants';
|
|||
|
||||
interface State {
|
||||
payoutAddress: string;
|
||||
tipJarAddress: string;
|
||||
}
|
||||
|
||||
interface Props {
|
||||
|
@ -18,18 +19,24 @@ export default class CreateFlowPayment extends React.Component<Props, State> {
|
|||
super(props);
|
||||
this.state = {
|
||||
payoutAddress: '',
|
||||
tipJarAddress: '',
|
||||
...(props.initialState || {}),
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
const { payoutAddress } = this.state;
|
||||
const { payoutAddress, tipJarAddress } = this.state;
|
||||
const errors = getCreateErrors(this.state, true);
|
||||
const payoutHelp =
|
||||
errors.payoutAddress ||
|
||||
`
|
||||
This must be a Sapling Z address
|
||||
`;
|
||||
const tipJarHelp =
|
||||
errors.tipJarAddress ||
|
||||
`
|
||||
Allows your proposal to receive tips. Must be a Sapling Z address
|
||||
`;
|
||||
|
||||
return (
|
||||
<Form layout="vertical" style={{ maxWidth: 600, margin: '0 auto' }}>
|
||||
|
@ -45,14 +52,39 @@ export default class CreateFlowPayment extends React.Component<Props, State> {
|
|||
placeholder={DONATION.ZCASH_SAPLING}
|
||||
type="text"
|
||||
value={payoutAddress}
|
||||
onChange={this.handleInputChange}
|
||||
onChange={this.handlePaymentInputChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item
|
||||
label="Tip address (optional)"
|
||||
validateStatus={errors.tipJarAddress ? 'error' : undefined}
|
||||
help={tipJarHelp}
|
||||
style={{ marginBottom: '2rem' }}
|
||||
>
|
||||
<Input
|
||||
size="large"
|
||||
name="tipJarAddress"
|
||||
placeholder={DONATION.ZCASH_SAPLING}
|
||||
type="text"
|
||||
value={tipJarAddress}
|
||||
onChange={this.handleTippingInputChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
|
||||
private handleInputChange = (
|
||||
private handlePaymentInputChange = (
|
||||
event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
|
||||
) => {
|
||||
const { value, name } = event.currentTarget;
|
||||
this.setState({ [name]: value } as any, () => {
|
||||
this.props.updateForm(this.state);
|
||||
});
|
||||
};
|
||||
|
||||
private handleTippingInputChange = (
|
||||
event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
|
||||
) => {
|
||||
const { value, name } = event.currentTarget;
|
||||
|
|
|
@ -109,7 +109,7 @@ class CreateReview extends React.Component<Props> {
|
|||
],
|
||||
},
|
||||
{
|
||||
step: CREATE_STEP.TIPPING,
|
||||
step: CREATE_STEP.PAYMENT,
|
||||
name: 'Tipping',
|
||||
fields: [
|
||||
{
|
||||
|
|
|
@ -1,63 +0,0 @@
|
|||
import React from 'react';
|
||||
import { Input, Form } from 'antd';
|
||||
import { ProposalDraft } from 'types';
|
||||
import { getCreateErrors } from 'modules/create/utils';
|
||||
import { DONATION } from 'utils/constants';
|
||||
|
||||
interface State {
|
||||
tipJarAddress: string;
|
||||
}
|
||||
|
||||
interface Props {
|
||||
initialState?: Partial<State>;
|
||||
updateForm(form: Partial<ProposalDraft>): void;
|
||||
}
|
||||
|
||||
export default class CreateFlowPayment extends React.Component<Props, State> {
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
tipJarAddress: '',
|
||||
...(props.initialState || {}),
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
const { tipJarAddress } = this.state;
|
||||
const errors = getCreateErrors(this.state, true);
|
||||
const tipJarHelp =
|
||||
errors.payoutAddress ||
|
||||
`
|
||||
This must be a Sapling Z address
|
||||
`;
|
||||
|
||||
return (
|
||||
<Form layout="vertical" style={{ maxWidth: 600, margin: '0 auto' }}>
|
||||
<Form.Item
|
||||
label="Tip address"
|
||||
validateStatus={errors.tipJarAddress ? 'error' : undefined}
|
||||
help={tipJarHelp}
|
||||
style={{ marginBottom: '2rem' }}
|
||||
>
|
||||
<Input
|
||||
size="large"
|
||||
name="tipJarAddress"
|
||||
placeholder={DONATION.ZCASH_SAPLING}
|
||||
type="text"
|
||||
value={tipJarAddress}
|
||||
onChange={this.handleInputChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
|
||||
private handleInputChange = (
|
||||
event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
|
||||
) => {
|
||||
const { value, name } = event.currentTarget;
|
||||
this.setState({ [name]: value } as any, () => {
|
||||
this.props.updateForm(this.state);
|
||||
});
|
||||
};
|
||||
}
|
|
@ -11,7 +11,6 @@ import Team from './Team';
|
|||
import Details from './Details';
|
||||
import Milestones from './Milestones';
|
||||
import Payment from './Payment';
|
||||
import Tipping from './Tipping';
|
||||
import Review from './Review';
|
||||
import Preview from './Preview';
|
||||
import Final from './Final';
|
||||
|
@ -33,7 +32,6 @@ export enum CREATE_STEP {
|
|||
DETAILS = 'DETAILS',
|
||||
MILESTONES = 'MILESTONES',
|
||||
PAYMENT = 'PAYMENT',
|
||||
TIPPING = 'TIPPING',
|
||||
REVIEW = 'REVIEW',
|
||||
}
|
||||
|
||||
|
@ -43,7 +41,6 @@ const STEP_ORDER = [
|
|||
CREATE_STEP.DETAILS,
|
||||
CREATE_STEP.MILESTONES,
|
||||
CREATE_STEP.PAYMENT,
|
||||
CREATE_STEP.TIPPING,
|
||||
CREATE_STEP.REVIEW,
|
||||
];
|
||||
|
||||
|
@ -94,20 +91,12 @@ const STEP_INFO: { [key in CREATE_STEP]: StepInfo } = {
|
|||
},
|
||||
[CREATE_STEP.PAYMENT]: {
|
||||
short: 'Payment',
|
||||
title: 'Set your payout address',
|
||||
title: 'Set your payout and tip addresses',
|
||||
subtitle: '',
|
||||
help:
|
||||
'Double check your address, and make sure it’s secure. Once sent, payments are irreversible!',
|
||||
'Double check your addresses, and make sure they’re secure. Once sent, transactions are irreversible!',
|
||||
component: Payment,
|
||||
},
|
||||
[CREATE_STEP.TIPPING]: {
|
||||
short: 'Tipping',
|
||||
title: 'Set your proposal tip address (optional)',
|
||||
subtitle: 'Setting this address allows your team to receive tips for this proposal',
|
||||
help:
|
||||
'Double check your address, and make sure it’s secure. Once sent, tips are irreversible!',
|
||||
component: Tipping,
|
||||
},
|
||||
[CREATE_STEP.REVIEW]: {
|
||||
short: 'Review',
|
||||
title: 'Review your proposal',
|
||||
|
|
Loading…
Reference in New Issue