add reset password flow
This commit is contained in:
parent
e56cd9cf80
commit
779e3ee978
3 changed files with 128 additions and 0 deletions
28
imports/startup/server/accounts.js
Normal file
28
imports/startup/server/accounts.js
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
import { Meteor } from 'meteor/meteor';
|
||||
import { Accounts } from 'meteor/accounts-base';
|
||||
|
||||
const name = 'Application Name';
|
||||
const email = '<support@application.com>';
|
||||
const from = `${name} ${email}`;
|
||||
const emailTemplates = Accounts.emailTemplates;
|
||||
|
||||
emailTemplates.siteName = name;
|
||||
emailTemplates.from = from;
|
||||
|
||||
emailTemplates.resetPassword = {
|
||||
subject() {
|
||||
return `[${name}] Reset Your Password`;
|
||||
},
|
||||
text(user, url) {
|
||||
const userEmail = user.emails[0].address;
|
||||
const urlWithoutHash = url.replace('#/', '');
|
||||
|
||||
if (Meteor.isDevelopment) console.info(`Reset Password Link: ${urlWithoutHash}`);
|
||||
|
||||
return `A password reset has been requested for the account related to this
|
||||
address (${userEmail}). To reset the password, visit the following link:
|
||||
\n\n${urlWithoutHash}\n\n If you did not request this reset, please ignore
|
||||
this email. If you feel something is wrong, please contact our support team:
|
||||
${email}.`;
|
||||
},
|
||||
};
|
||||
|
|
@ -1,2 +1,3 @@
|
|||
import './accounts';
|
||||
import './api';
|
||||
import './fixtures';
|
||||
|
|
|
|||
|
|
@ -0,0 +1,99 @@
|
|||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Row, Col, Alert, FormGroup, ControlLabel, Button } from 'react-bootstrap';
|
||||
import { Accounts } from 'meteor/accounts-base';
|
||||
import { Bert } from 'meteor/themeteorchef:bert';
|
||||
import validate from '../../../modules/validate';
|
||||
|
||||
class ResetPassword extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.handleSubmit = this.handleSubmit.bind(this);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
const component = this;
|
||||
|
||||
validate(component.form, {
|
||||
rules: {
|
||||
newPassword: {
|
||||
required: true,
|
||||
minlength: 6,
|
||||
},
|
||||
repeatNewPassword: {
|
||||
required: true,
|
||||
minlength: 6,
|
||||
equalTo: '[name="newPassword"]',
|
||||
},
|
||||
},
|
||||
messages: {
|
||||
newPassword: {
|
||||
required: 'Enter a new password, please.',
|
||||
minlength: 'Use at least six characters, please.',
|
||||
},
|
||||
repeatNewPassword: {
|
||||
required: 'Repeat your new password, please.',
|
||||
equalTo: 'Hmm, your passwords don\'t match. Try again?',
|
||||
},
|
||||
},
|
||||
submitHandler() { component.handleSubmit(); },
|
||||
});
|
||||
}
|
||||
|
||||
handleSubmit() {
|
||||
const { match, history } = this.props;
|
||||
const token = match.params.token;
|
||||
|
||||
Accounts.resetPassword(token, this.newPassword.value, (error) => {
|
||||
if (error) {
|
||||
Bert.alert(error.reason, 'danger');
|
||||
} else {
|
||||
history.push('/documents');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
return (<div className="ResetPassword">
|
||||
<Row>
|
||||
<Col xs={12} sm={6} md={4}>
|
||||
<h4 className="page-header">Reset Password</h4>
|
||||
<Alert bsStyle="info">
|
||||
To reset your password, enter a new one below. You will be logged in
|
||||
with your new password.
|
||||
</Alert>
|
||||
<form ref={form => (this.form = form)} onSubmit={event => event.preventDefault()}>
|
||||
<FormGroup>
|
||||
<ControlLabel>New Password</ControlLabel>
|
||||
<input
|
||||
type="password"
|
||||
className="form-control"
|
||||
ref={newPassword => (this.newPassword = newPassword)}
|
||||
name="newPassword"
|
||||
placeholder="New Password"
|
||||
/>
|
||||
</FormGroup>
|
||||
<FormGroup>
|
||||
<ControlLabel>Repeat New Password</ControlLabel>
|
||||
<input
|
||||
type="password"
|
||||
className="form-control"
|
||||
ref={repeatNewPassword => (this.repeatNewPassword = repeatNewPassword)}
|
||||
name="repeatNewPassword"
|
||||
placeholder="Repeat New Password"
|
||||
/>
|
||||
</FormGroup>
|
||||
<Button type="submit" bsStyle="success">Reset Password & Login</Button>
|
||||
</form>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>);
|
||||
}
|
||||
}
|
||||
|
||||
ResetPassword.propTypes = {
|
||||
match: PropTypes.object.isRequired,
|
||||
history: PropTypes.object.isRequired,
|
||||
};
|
||||
|
||||
export default ResetPassword;
|
||||
Loading…
Add table
Add a link
Reference in a new issue