blob: 0910e5f816feb00982e1eed312c73db02de54320 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
|
import React, { Component } from 'react';
import { graphql, compose } from 'react-apollo';
import PropTypes from 'prop-types';
import { REQUEST_RESET_MUTATION } from '../queries';
import Form from './styles/Form';
class ResetRequest extends Component {
static propTypes = {
requestReset: PropTypes.func.isRequired,
};
state = {
email: '',
errors: [],
};
requestReset = async e => {
e.preventDefault();
const res = await this.props.requestReset({
variables: {
email: this.state.email,
},
});
if (res.errors) {
this.setState({ errors: res.errors });
}
};
saveToState = e => {
const { name, value } = e.target;
this.setState({ [name]: value });
};
render() {
return (
<Form onSubmit={this.requestReset}>
{this.state.errors ? this.state.errors.map((err, i) => <p key={i}>{err.message}</p>) : null}
<label htmlFor="email">
Email
<input value={this.state.email} onChange={this.saveToState} name="email" type="text" placeholder="email" />
</label>
<button type="submit">Request Reset!</button>
</Form>
);
}
}
const requestResetEnhancer = graphql(REQUEST_RESET_MUTATION, { name: 'requestReset' });
export default compose(requestResetEnhancer)(ResetRequest);
export { ResetRequest };
|