From e2399268669c194660f2cc6fbd319812cc8b25cb Mon Sep 17 00:00:00 2001 From: Belen Curcio Date: Tue, 7 Feb 2017 00:07:53 -0300 Subject: [PATCH] Failure check --- client/coral-admin/src/actions/install.js | 61 ++++++++++--------- .../containers/Install/InstallContainer.js | 8 ++- .../components/Steps/AddOrganizationName.js | 4 +- .../components/Steps/CreateYourAccount.js | 33 +++++++--- .../Install/components/Steps/FinalStep.js | 7 +-- .../Install/components/Steps/style.css | 8 +++ client/coral-admin/src/reducers/install.js | 30 ++++++++- routes/api/index.js | 1 + 8 files changed, 104 insertions(+), 48 deletions(-) diff --git a/client/coral-admin/src/actions/install.js b/client/coral-admin/src/actions/install.js index bc0c86ce1..c7c673105 100644 --- a/client/coral-admin/src/actions/install.js +++ b/client/coral-admin/src/actions/install.js @@ -24,28 +24,37 @@ const validation = (formData, dispatch, next) => { const empty = Object.keys(formData).filter(name => { const cond = !formData[name].length; - // Adding Error - dispatch(addError(name, 'Please, fill this field ')); + if (cond) { + + // Adding Error + dispatch(addError(name, 'Please, fill this field ')); + } else { + dispatch(addError(name, '')); + } + return cond; }); if (empty.length) { - return dispatch(hasError('Please fill the form')); + return dispatch(hasError()); } // RegExp Validation const validation = Object.keys(formData).filter(name => { const cond = !validate[name](formData[name]); if (cond) { + // Adding Error dispatch(addError(name, errorMsj[name])); + } else { + dispatch(addError(name, '')); } return cond; }); if (validation.length) { - return dispatch(hasError('Please check the form')); + return dispatch(hasError()); } dispatch(clearErrors()); @@ -53,33 +62,29 @@ const validation = (formData, dispatch, next) => { }; export const submitSettings = () => (dispatch, getState) => { - const formData = getState().install.toJS().data.settings; - validation(formData, dispatch, function() { + const settingsFormData = getState().install.toJS().data.settings; + validation(settingsFormData, dispatch, function() { dispatch(nextStep()); }); }; -export const install = () => dispatch => { - dispatch(installRequest()); - coralApi('/setup') - .then(result => { - console.log(result); - dispatch(installSuccess()); - }) - .catch(error => { - console.error(error); - dispatch(installFailure(`${error.message}`)); - }); +export const submitUser = () => (dispatch, getState) => { + const userFormData = getState().install.toJS().data.user; + validation(userFormData, dispatch, function() { + const data = getState().install.toJS().data; + dispatch(installRequest()); + coralApi('/setup', {method: 'POST', body: data}) + .then(result => { + console.log(result); + dispatch(installSuccess()); + dispatch(nextStep()); + }) + .catch(error => { + console.error(error); + dispatch(installFailure(`${error.message}`)); + }); + }); }; -export const updateSettingsFormData = (name, value) => ({ - type: actions.UPDATE_FORMDATA_SETTINGS, - name, - value -}); - -export const updateUserFormData = (name, value) => ({ - type: actions.UPDATE_FORMDATA_USER, - name, - value -}); +export const updateSettingsFormData = (name, value) => ({type: actions.UPDATE_FORMDATA_SETTINGS, name, value}); +export const updateUserFormData = (name, value) => ({type: actions.UPDATE_FORMDATA_USER, name, value}); diff --git a/client/coral-admin/src/containers/Install/InstallContainer.js b/client/coral-admin/src/containers/Install/InstallContainer.js index ca6ac722c..063e36578 100644 --- a/client/coral-admin/src/containers/Install/InstallContainer.js +++ b/client/coral-admin/src/containers/Install/InstallContainer.js @@ -3,7 +3,7 @@ import {connect} from 'react-redux'; import styles from './style.css'; import {Wizard, WizardNav} from 'coral-ui'; import {Layout} from '../../components/ui/Layout'; -import {nextStep, previousStep, goToStep, updateUserFormData, updateSettingsFormData, submitSettings} from '../../actions/install'; +import {nextStep, previousStep, goToStep, updateUserFormData, updateSettingsFormData, submitSettings, submitUser} from '../../actions/install'; import InitialStep from './components/Steps/InitialStep'; import AddOrganizationName from './components/Steps/AddOrganizationName'; @@ -45,9 +45,13 @@ const mapDispatchToProps = dispatch => ({ const {name, value} = e.currentTarget; dispatch(updateUserFormData(name, value)); }, - handleSubmit: e => { + handleSettingsSubmit: e => { e.preventDefault(); dispatch(submitSettings()); + }, + handleUserSubmit: e => { + e.preventDefault(); + dispatch(submitUser()); } }); diff --git a/client/coral-admin/src/containers/Install/components/Steps/AddOrganizationName.js b/client/coral-admin/src/containers/Install/components/Steps/AddOrganizationName.js index c7edce628..0f85bbad4 100644 --- a/client/coral-admin/src/containers/Install/components/Steps/AddOrganizationName.js +++ b/client/coral-admin/src/containers/Install/components/Steps/AddOrganizationName.js @@ -3,7 +3,7 @@ import styles from './style.css'; import {FormField, Button} from 'coral-ui'; const AddOrganizationName = props => { - const {handleSettingsChange, handleSubmit, install} = props; + const {handleSettingsChange, handleSettingsSubmit, install} = props; return (

@@ -11,7 +11,7 @@ const AddOrganizationName = props => { inviting new team members

-
+ { - const {handleSubmit, handleUserChange} = props; + const {handleUserChange, handleUserSubmit, install} = props; return (
- + + showErrors={install.showErrors} + errorMsg={install.errors.displayName} + /> { type="password" label='Password' onChange={handleUserChange} - /> + showErrors={install.showErrors} + errorMsg={install.errors.password} + /> { type="password" label='Confirm Password' onChange={handleUserChange} - /> + showErrors={install.showErrors} + errorMsg={install.errors.confirmPassword} + /> - + { + !props.install.isLoading ? + + : + + } + {props.install.installRequest === 'FAILURE' &&
Error: {props.install.installRequestError}
}
diff --git a/client/coral-admin/src/containers/Install/components/Steps/FinalStep.js b/client/coral-admin/src/containers/Install/components/Steps/FinalStep.js index 0b58508a0..5e1e4c77c 100644 --- a/client/coral-admin/src/containers/Install/components/Steps/FinalStep.js +++ b/client/coral-admin/src/containers/Install/components/Steps/FinalStep.js @@ -2,16 +2,15 @@ import React from 'react'; import styles from './style.css'; import {Button} from 'coral-ui'; -const InitialStep = props => { - const {nextStep} = props; +const InitialStep = () => { return (

Thanks for installing Talk! We sent an email to your team member. While they finish setting up their account, start engaging with your readers now.

- - + +
); }; diff --git a/client/coral-admin/src/containers/Install/components/Steps/style.css b/client/coral-admin/src/containers/Install/components/Steps/style.css index 42ea84efb..555ebcc4d 100644 --- a/client/coral-admin/src/containers/Install/components/Steps/style.css +++ b/client/coral-admin/src/containers/Install/components/Steps/style.css @@ -56,3 +56,11 @@ } } } + +.error { + background: #FFEBEE; + color: #B71C1C; + padding: 10px; + margin-bottom: 20px; + border-radius: 2px; +} diff --git a/client/coral-admin/src/reducers/install.js b/client/coral-admin/src/reducers/install.js index e64cdff2a..8396beead 100644 --- a/client/coral-admin/src/reducers/install.js +++ b/client/coral-admin/src/reducers/install.js @@ -3,16 +3,24 @@ import {Map} from 'immutable'; import * as actions from '../constants/install'; const initialState = Map({ + isLoading: false, data: Map({ settings: Map({ organizationName: '' }), user: Map({ - displayName: '' + displayName: '', + email: '', + password: '', + confirmPassword: '' }) }), errors: Map({ - organizationName: '' + organizationName: '', + displayName: '', + email: '', + password: '', + confirmPassword: '' }), showErrors: false, hasError: false, @@ -25,7 +33,9 @@ const initialState = Map({ { text: '2. Create your account', step: 2 - }] + }], + installRequest: null, + installRequestError: null }); export default function install (state = initialState, action) { @@ -57,6 +67,20 @@ export default function install (state = initialState, action) { case actions.CLEAR_ERRORS: return state .set('errors', Map()); + case actions.INSTALL_REQUEST: + return state + .set('isLoading', true); + case actions.INSTALL_SUCCESS: + return state + .set('isLoading', false) + .set('installRequest', 'SUCCESS'); + case actions.INSTALL_FAILURE: + return state + .merge({ + isLoading: false, + installRequest: 'FAILURE', + installRequestError: action.error + }); default : return state; } diff --git a/routes/api/index.js b/routes/api/index.js index c40c428b4..9913d8ad2 100644 --- a/routes/api/index.js +++ b/routes/api/index.js @@ -13,6 +13,7 @@ router.use('/actions', authorization.needed(), require('./actions')); router.use('/auth', require('./auth')); router.use('/users', require('./users')); router.use('/account', require('./account')); +router.use('/setup', require('./setup')); // Bind the kue handler to the /kue path. router.use('/kue', authorization.needed('ADMIN'), require('../../services/kue').kue.app);