diff --git a/client/constants.js b/client/constants.js
index e9d79ac1..1e50f5b7 100644
--- a/client/constants.js
+++ b/client/constants.js
@@ -95,6 +95,6 @@ export const RESET_INFINITE_LOOPS = 'RESET_INFINITE_LOOPS';
export const RESET_PASSWORD_INITIATE = 'RESET_PASSWORD_INITIATE';
export const RESET_PASSWORD_RESET = 'RESET_PASSWORD_RESET';
-
+export const INVALID_RESET_PASSWORD_TOKEN = 'INVALID_RESET_PASSWORD_TOKEN';
// eventually, handle errors more specifically and better
export const ERROR = 'ERROR';
diff --git a/client/modules/IDE/components/NewPasswordView.js b/client/modules/IDE/components/NewPasswordView.js
index a76f8a30..2a0a83b2 100644
--- a/client/modules/IDE/components/NewPasswordView.js
+++ b/client/modules/IDE/components/NewPasswordView.js
@@ -3,6 +3,8 @@ import { reduxForm } from 'redux-form';
import NewPasswordForm from './NewPasswordForm';
import * as UserActions from '../../User/actions';
import { bindActionCreators } from 'redux';
+import classNames from 'classnames';
+import { Link } from 'react-router';
class NewPasswordView extends React.Component {
componentDidMount() {
@@ -12,10 +14,20 @@ class NewPasswordView extends React.Component {
}
render() {
+ const newPasswordClass = classNames({
+ 'new-password': true,
+ 'new-password--invalid': this.props.user.resetPasswordInvalid
+ });
+ console.log(this.props.user);
+ console.log('rerendering!!');
return (
-
+
Set a New Password
+
+ The password reset token is invalid or has expired.
+
+
Close
);
}
@@ -23,7 +35,10 @@ class NewPasswordView extends React.Component {
NewPasswordView.propTypes = {
token: PropTypes.string.isRequired,
- validateResetPasswordToken: PropTypes.func.isRequired
+ validateResetPasswordToken: PropTypes.func.isRequired,
+ user: PropTypes.shape({
+ resetPasswordInvalid: PropTypes.bool
+ })
};
function validate(formProps) {
diff --git a/client/modules/IDE/pages/IDEView.js b/client/modules/IDE/pages/IDEView.js
index 93f99351..a31b3558 100644
--- a/client/modules/IDE/pages/IDEView.js
+++ b/client/modules/IDE/pages/IDEView.js
@@ -422,7 +422,7 @@ class IDEView extends React.Component {
}
})()}
{(() => { // eslint-disable-line
- if (this.props.location.pathname.match(/\/reset-password\/[a-fA-F0-9]{40}/)) {
+ if (this.props.location.pathname.match(/\/reset-password\/[a-fA-F0-9]+/)) {
return (
diff --git a/client/modules/User/actions.js b/client/modules/User/actions.js
index 8c3f9d14..bd67e0c3 100644
--- a/client/modules/User/actions.js
+++ b/client/modules/User/actions.js
@@ -131,7 +131,6 @@ export function validateResetPasswordToken(token) {
axios.get(`${ROOT_URL}/reset-password/${token}`)
.then(() => {
// do nothing if the token is valid
- // add the token to the state?
})
.catch(() => dispatch({
type: ActionTypes.INVALID_RESET_PASSWORD_TOKEN
diff --git a/client/modules/User/reducers.js b/client/modules/User/reducers.js
index e75087e1..9e3b5b9c 100644
--- a/client/modules/User/reducers.js
+++ b/client/modules/User/reducers.js
@@ -14,9 +14,11 @@ const user = (state = { authenticated: false }, action) => {
authenticated: false
};
case ActionTypes.RESET_PASSWORD_INITIATE:
- return Object.assign(state, {}, { resetPasswordInitiate: true });
+ return Object.assign({}, state, { resetPasswordInitiate: true });
case ActionTypes.RESET_PASSWORD_RESET:
- return Object.assign(state, {}, { resetPasswordInitiate: false });
+ return Object.assign({}, state, { resetPasswordInitiate: false });
+ case ActionTypes.INVALID_RESET_PASSWORD_TOKEN:
+ return Object.assign({}, state, { resetPasswordInvalid: true });
default:
return state;
}
diff --git a/client/styles/components/_new-password.scss b/client/styles/components/_new-password.scss
index d03e78df..a559c5c1 100644
--- a/client/styles/components/_new-password.scss
+++ b/client/styles/components/_new-password.scss
@@ -6,4 +6,26 @@
justify-content: center;
padding: #{20 / $base-font-size}rem;
align-items: center;
+}
+
+.new-password-form__password-input,
+.new-password-form__confirm-password-input {
+ width: #{300 / $base-font-size}rem;
+}
+
+.new-password-form__field {
+ margin: #{20 / $base-font-size}rem 0;
+}
+
+.new-password-form {
+ .new-password--invalid & {
+ display: none;
+ }
+}
+
+.new-password__invalid {
+ display: none;
+ .new-password--invalid & {
+ display: block;
+ }
}
\ No newline at end of file