diff --git a/client/coral-embed-stream/src/actions/auth.js b/client/coral-embed-stream/src/actions/auth.js index b96d6f459..22d46a768 100644 --- a/client/coral-embed-stream/src/actions/auth.js +++ b/client/coral-embed-stream/src/actions/auth.js @@ -23,6 +23,10 @@ export const hideSignInDialog = () => (dispatch) => { dispatch({type: actions.HIDE_SIGNIN_DIALOG}); }; +export const resetSignInDialog = () => (dispatch) => { + dispatch({type: actions.HIDE_SIGNIN_DIALOG}); +}; + export const focusSignInDialog = () => ({ type: actions.FOCUS_SIGNIN_DIALOG, }); @@ -94,8 +98,9 @@ export const cleanState = () => ({ // Sign In Actions -const signInRequest = () => ({ - type: actions.FETCH_SIGNIN_REQUEST +const signInRequest = (email) => ({ + type: actions.FETCH_SIGNIN_REQUEST, + email, }); const signInFailure = (error) => ({ @@ -122,7 +127,7 @@ export const handleAuthToken = (token) => (dispatch, _, {storage}) => { export const fetchSignIn = (formData) => { return (dispatch, _, {rest}) => { - dispatch(signInRequest()); + dispatch(signInRequest(formData.email)); return rest('/auth/local', {method: 'POST', body: formData}) .then(({token}) => { @@ -144,8 +149,7 @@ export const fetchSignIn = (formData) => { // invalid credentials dispatch(signInFailure(t('error.email_password'), error.metadata)); } else { - const str = error.translation_key ? t(`error.${error.translation_key}`) : error.toString(); - dispatch(signInFailure(str)); + dispatch(signInFailure(error)); } }); }; @@ -349,8 +353,9 @@ const verifyEmailSuccess = () => ({ type: actions.VERIFY_EMAIL_SUCCESS }); -const verifyEmailFailure = () => ({ - type: actions.VERIFY_EMAIL_FAILURE +const verifyEmailFailure = (error) => ({ + type: actions.VERIFY_EMAIL_FAILURE, + error, }); export const requestConfirmEmail = (email) => (dispatch, getState, {rest}) => { @@ -366,8 +371,8 @@ export const requestConfirmEmail = (email) => (dispatch, getState, {rest}) => { }) .catch((error) => { console.error(error); - const errorMessage = error.translation_key ? t(`error.${error.translation_key}`) : error.toString(); - dispatch(verifyEmailFailure(errorMessage)); + dispatch(verifyEmailFailure(error)); + throw error; }); }; diff --git a/client/coral-embed-stream/src/constants/auth.js b/client/coral-embed-stream/src/constants/auth.js index 324f75f44..bb2ea6c15 100644 --- a/client/coral-embed-stream/src/constants/auth.js +++ b/client/coral-embed-stream/src/constants/auth.js @@ -53,3 +53,4 @@ export const UPDATE_USERNAME = 'UPDATE_USERNAME'; export const SET_REQUIRE_EMAIL_VERIFICATION = 'SET_REQUIRE_EMAIL_VERIFICATION'; export const SET_REDIRECT_URI = 'SET_REDIRECT_URI'; +export const RESET_SIGNIN_DIALOG = 'RESET_SIGNIN_DIALOG'; diff --git a/client/coral-embed-stream/src/reducers/auth.js b/client/coral-embed-stream/src/reducers/auth.js index 1e18ddffa..679e8d858 100644 --- a/client/coral-embed-stream/src/reducers/auth.js +++ b/client/coral-embed-stream/src/reducers/auth.js @@ -10,7 +10,7 @@ const initialState = { showCreateUsernameDialog: false, checkedInitialLogin: false, view: 'SIGNIN', - error: '', + error: null, passwordRequestSuccess: null, passwordRequestFailure: null, emailVerificationFailure: false, @@ -45,14 +45,15 @@ export default function auth (state = initialState, action) { showSignInDialog: true, signInDialogFocus: true, }; - case actions.HIDE_SIGNIN_DIALOG : + case actions.RESET_SIGNIN_DIALOG: + case actions.HIDE_SIGNIN_DIALOG: return { ...state, isLoading: false, showSignInDialog: false, signInDialogFocus: false, view: 'SIGNIN', - error: '', + error: null, passwordRequestFailure: null, passwordRequestSuccess: null, emailVerificationFailure: false, @@ -74,7 +75,7 @@ export default function auth (state = initialState, action) { return { ...state, showCreateUsernameDialog: false, - error: '', + error: null, }; case actions.CREATE_USERNAME_FAILURE: return { @@ -92,6 +93,7 @@ export default function auth (state = initialState, action) { case actions.FETCH_SIGNIN_REQUEST: return { ...state, + email: action.email, isLoading: true, }; case actions.CHECK_LOGIN_FAILURE: @@ -120,6 +122,7 @@ export default function auth (state = initialState, action) { isLoading: false, error: action.error, user: null, + view: action.error.translation_key === 'EMAIL_NOT_VERIFIED' ? 'RESEND_VERIFICATION' : state.view, }; case actions.FETCH_SIGNUP_FACEBOOK_REQUEST: return { @@ -175,7 +178,7 @@ export default function auth (state = initialState, action) { case actions.VALID_FORM: return { ...state, - error: '', + error: null, }; case actions.FETCH_FORGOT_PASSWORD_SUCCESS: return { @@ -200,7 +203,7 @@ export default function auth (state = initialState, action) { case actions.VERIFY_EMAIL_FAILURE: return { ...state, - emailVerificationFailure: true, + emailVerificationFailure: action.error, emailVerificationLoading: false, }; case actions.VERIFY_EMAIL_REQUEST: diff --git a/locales/en.yml b/locales/en.yml index 2d560fedc..76a434dfc 100644 --- a/locales/en.yml +++ b/locales/en.yml @@ -194,8 +194,10 @@ en: NO_SPECIAL_CHARACTERS: "Usernames can contain letters numbers and _ only" PASSWORD_LENGTH: "Password is too short" PROFANITY_ERROR: "Usernames must not contain profanity. Please contact the administrator if you believe this to be in error." + RATE_LIMIT_EXCEEDED: "Rate limit exceeded" USERNAME_IN_USE: "Username already in use" USERNAME_REQUIRED: "Must input a username" + EMAIL_NOT_VERIFIED: "E-mail address not verified" EDIT_WINDOW_ENDED: "You can no longer edit this comment. The time window to do so has expired." EDIT_USERNAME_NOT_AUTHORIZED: "You do not have permission to update your username." SAME_USERNAME_PROVIDED: "You must submit a different username." diff --git a/plugins/talk-plugin-auth/client/components/ResendVerification.css b/plugins/talk-plugin-auth/client/components/ResendVerification.css new file mode 100644 index 000000000..dc59a9ff1 --- /dev/null +++ b/plugins/talk-plugin-auth/client/components/ResendVerification.css @@ -0,0 +1,15 @@ +.header { + margin-bottom: 20px; + text-align: center; + font-size: 1.2em; +} + +.notVerified { + padding: 10px; + margin-bottom: 20px; + border-radius: 2px; + border: solid 1px #dddd00; + background: #FFFF9C; + color: #777700; +} + diff --git a/plugins/talk-plugin-auth/client/components/ResendVerification.js b/plugins/talk-plugin-auth/client/components/ResendVerification.js new file mode 100644 index 000000000..b345577a9 --- /dev/null +++ b/plugins/talk-plugin-auth/client/components/ResendVerification.js @@ -0,0 +1,43 @@ +import React from 'react'; +import {Button, Spinner, Success, Alert} from 'plugin-api/beta/client/components/ui'; +import PropTypes from 'prop-types'; +import styles from './ResendVerification.css'; +import t from 'coral-framework/services/i18n'; + +class ResendVerification extends React.Component { + render() { + const {resendVerification, error, loading, success, email} = this.props; + return ( +