lbry-desktop/ui/js/component/userEmailVerify/view.jsx

57 lines
1.4 KiB
React
Raw Normal View History

2017-06-08 23:15:34 +02:00
import React from "react";
import Link from "component/link";
import { Form, FormRow, Submit } from "component/form.js";
2017-06-03 01:09:52 +02:00
class UserEmailVerify extends React.PureComponent {
2017-06-03 01:09:52 +02:00
constructor(props) {
super(props);
this.state = {
2017-06-08 23:15:34 +02:00
code: "",
2017-06-03 01:09:52 +02:00
};
}
handleCodeChanged(event) {
this.setState({
2017-07-19 01:00:13 +02:00
code: String(event.target.value).trim(),
2017-06-03 01:09:52 +02:00
});
}
handleSubmit() {
const { code } = this.state;
this.props.verifyUserEmail(code);
2017-06-03 01:09:52 +02:00
}
render() {
2017-06-08 23:15:34 +02:00
const { errorMessage, isPending } = this.props;
return (
<Form onSubmit={this.handleSubmit.bind(this)}>
2017-07-19 01:00:13 +02:00
<p>{__("Please enter the verification code emailed to you.")}</p>
2017-06-08 23:15:34 +02:00
<FormRow
type="text"
2017-06-19 14:42:24 +02:00
label={__("Verification Code")}
2017-06-08 23:15:34 +02:00
name="code"
value={this.state.code}
onChange={event => {
this.handleCodeChanged(event);
}}
errorMessage={errorMessage}
/>
{/* render help separately so it always shows */}
<div className="form-field__helper">
<p>
2017-07-28 03:13:12 +02:00
{__("Email")}{" "}
2017-06-20 14:08:52 +02:00
<Link href="mailto:help@lbry.io" label="help@lbry.io" />{" "}
2017-07-28 03:13:12 +02:00
{__("if you encounter any trouble with your code.")}
2017-06-08 23:15:34 +02:00
</p>
</div>
<div className="form-row-submit form-row-submit--with-footer">
<Submit label={__("Verify")} disabled={this.state.submitting} />
2017-06-08 23:15:34 +02:00
</div>
</Form>
2017-06-08 23:15:34 +02:00
);
2017-06-03 01:09:52 +02:00
}
}
2017-06-08 23:15:34 +02:00
export default UserEmailVerify;