82 lines
2.3 KiB
JavaScript
82 lines
2.3 KiB
JavaScript
import PropTypes from 'prop-types';
|
|
import React from 'react';
|
|
import { reduxForm } from 'redux-form';
|
|
import classNames from 'classnames';
|
|
import { bindActionCreators } from 'redux';
|
|
import { Helmet } from 'react-helmet';
|
|
import { withTranslation } from 'react-i18next';
|
|
import i18next from 'i18next';
|
|
import NewPasswordForm from '../components/NewPasswordForm';
|
|
import * as UserActions from '../actions';
|
|
import Nav from '../../../components/Nav';
|
|
|
|
function NewPasswordView(props) {
|
|
const newPasswordClass = classNames({
|
|
'new-password': true,
|
|
'new-password--invalid': props.user.resetPasswordInvalid,
|
|
'form-container': true,
|
|
'user': true
|
|
});
|
|
return (
|
|
<div className="new-password-container">
|
|
<Nav layout="dashboard" />
|
|
<div className={newPasswordClass}>
|
|
<Helmet>
|
|
<title>{props.t('NewPasswordView.Title')}</title>
|
|
</Helmet>
|
|
<div className="form-container__content">
|
|
<h2 className="form-container__title">{props.t('NewPasswordView.Description')}</h2>
|
|
<NewPasswordForm {...props} />
|
|
<p className="new-password__invalid">
|
|
{props.t('NewPasswordView.TokenInvalidOrExpired')}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
NewPasswordView.propTypes = {
|
|
params: PropTypes.shape({
|
|
reset_password_token: PropTypes.string,
|
|
}).isRequired,
|
|
validateResetPasswordToken: PropTypes.func.isRequired,
|
|
user: PropTypes.shape({
|
|
resetPasswordInvalid: PropTypes.bool
|
|
}).isRequired,
|
|
t: PropTypes.func.isRequired
|
|
};
|
|
|
|
function validate(formProps) {
|
|
const errors = {};
|
|
|
|
if (!formProps.password) {
|
|
errors.password = i18next.t('NewPasswordView.EmptyPassword');
|
|
}
|
|
if (!formProps.confirmPassword) {
|
|
errors.confirmPassword = i18next.t('NewPasswordView.PasswordConfirmation');
|
|
}
|
|
|
|
if (formProps.password !== formProps.confirmPassword) {
|
|
errors.password = i18next.t('NewPasswordView.PasswordMismatch');
|
|
}
|
|
|
|
return errors;
|
|
}
|
|
|
|
function mapStateToProps(state) {
|
|
return {
|
|
user: state.user
|
|
};
|
|
}
|
|
|
|
function mapDispatchToProps(dispatch) {
|
|
return bindActionCreators(UserActions, dispatch);
|
|
}
|
|
|
|
export default withTranslation()(reduxForm({
|
|
form: 'new-password',
|
|
fields: ['password', 'confirmPassword'],
|
|
validate
|
|
}, mapStateToProps, mapDispatchToProps)(NewPasswordView));
|