render() { | |
return ( | |
<Mutation | |
mutation={CREATE_DRAFT_MUTATION} | |
> | |
{(createDraft, { data, loading, error }) => { | |
return ( | |
<div className="pa4 flex justify-center bg-white"> | |
<form | |
onSubmit={async e => { | |
e.preventDefault() | |
const { title, text } = this.state | |
await createDraft({ | |
variables: { title, text }, | |
}) | |
this.props.history.replace('/drafts') | |
}} | |
> | |
<h1>Create Draft</h1> | |
<input | |
autoFocus | |
className="w-100 pa2 mv2 br2 b--black-20 bw1" | |
onChange={e => this.setState({ title: e.target.value })} | |
placeholder="Title" | |
type="text" | |
value={this.state.title} | |
/> | |
<textarea | |
className="db w-100 ba bw1 b--black-20 pa2 br2 mb2" | |
cols={50} | |
onChange={e => this.setState({ text: e.target.value })} | |
placeholder="Content" | |
rows={8} | |
value={this.state.text} | |
/> | |
<input | |
className={`pa3 bg-black-10 bn ${this.state.text && | |
this.state.title && | |
'dim pointer'}`} | |
disabled={!this.state.text || !this.state.title} | |
type="submit" | |
value="Create" | |
/> | |
<a className="f6 pointer" onClick={this.props.history.goBack}> | |
or cancel | |
</a> | |
</form> | |
</div> | |
) | |
}} | |
</Mutation> | |
) | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment