diff --git a/client/coral-admin/src/actions/install.js b/client/coral-admin/src/actions/install.js index 73e7aaa82..970c15141 100644 --- a/client/coral-admin/src/actions/install.js +++ b/client/coral-admin/src/actions/install.js @@ -20,13 +20,17 @@ const validation = (formData, dispatch, next) => { return dispatch(hasError()); } + const validKeys = Object.keys(formData) + .filter(name => name !== 'domains'); + // Required Validation - const empty = Object.keys(formData).filter(name => { + const empty = validKeys + .filter(name => { const cond = !formData[name].length; if (cond) { - // Adding Error + // Adding Error dispatch(addError(name, 'This field is required.')); } else { dispatch(addError(name, '')); @@ -40,18 +44,19 @@ const validation = (formData, dispatch, next) => { } // RegExp Validation - const validation = Object.keys(formData).filter(name => { - const cond = !validate[name](formData[name]); - if (cond) { + const validation = validKeys + .filter(name => { + const cond = !validate[name](formData[name]); + if (cond) { // Adding Error - dispatch(addError(name, errorMsj[name])); - } else { - dispatch(addError(name, '')); - } + dispatch(addError(name, errorMsj[name])); + } else { + dispatch(addError(name, '')); + } - return cond; - }); + return cond; + }); if (validation.length) { return dispatch(hasError()); @@ -75,16 +80,10 @@ export const submitUser = () => (dispatch, getState) => { }); }; -export const submitWhitelistDomains = () => (dispatch) => { - submitForm().then(() => { - dispatch(installSuccess()); - }); -}; - -const submitForm = () => (dispatch, getState) => { +export const finishInstall = () => (dispatch, getState) => { const data = getState().install.toJS().data; dispatch(installRequest()); - return coralApi('/setup', { method: 'POST', body: data }) + return coralApi('/setup', {method: 'POST', body: data}) .then(result => { console.log(result); dispatch(installSuccess()); @@ -98,6 +97,7 @@ const submitForm = () => (dispatch, getState) => { 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 updatePermittedDomains = (value) => ({type: actions.UPDATE_PERMITTED_DOMAINS_SETTINGS, value}); const checkInstallRequest = () => ({type: actions.CHECK_INSTALL_REQUEST}); const checkInstallSuccess = installed => ({type: actions.CHECK_INSTALL_SUCCESS, installed}); diff --git a/client/coral-admin/src/constants/install.js b/client/coral-admin/src/constants/install.js index b3fd7e0d0..743d68593 100644 --- a/client/coral-admin/src/constants/install.js +++ b/client/coral-admin/src/constants/install.js @@ -10,6 +10,7 @@ export const INSTALL_SUCCESS = 'INSTALL_SUCCESS'; export const INSTALL_FAILURE = 'INSTALL_FAILURE'; export const UPDATE_FORMDATA_USER = 'UPDATE_FORMDATA_USER'; export const UPDATE_FORMDATA_SETTINGS = 'UPDATE_FORMDATA_SETTINGS'; +export const UPDATE_PERMITTED_DOMAINS_SETTINGS = 'UPDATE_PERMITTED_DOMAINS_SETTINGS'; export const CHECK_INSTALL_REQUEST = 'CHECK_INSTALL_REQUEST'; export const CHECK_INSTALL_SUCCESS = 'CHECK_INSTALL_SUCCESS'; diff --git a/client/coral-admin/src/containers/Configure/Domainlist.js b/client/coral-admin/src/containers/Configure/Domainlist.js index f845dfeaa..6918c0471 100644 --- a/client/coral-admin/src/containers/Configure/Domainlist.js +++ b/client/coral-admin/src/containers/Configure/Domainlist.js @@ -1,26 +1,28 @@ import React from 'react'; +import {Card} from 'coral-ui'; +import styles from './Configure.css'; +import TagsInput from 'react-tagsinput'; + import I18n from 'coral-framework/modules/i18n/i18n'; import translations from '../../translations.json'; -import TagsInput from 'react-tagsinput'; -import styles from './Configure.css'; -import {Card} from 'coral-ui'; +const lang = new I18n(translations); -const Domainlist = ({domains, onChangeDomainlist}) => ( -
-

{lang.t('configure.domain-list-title')}

- -

{lang.t('configure.domain-list-text')}

- data.split(',').map(d => d.trim())} - onChange={tags => onChangeDomainlist('whitelist', tags)} - /> -
-
-); +const Domainlist = ({domains, onChangeDomainlist}) => { + return ( +
+

{lang.t('configure.domain-list-title')}

+ +

{lang.t('configure.domain-list-text')}

+ data.split(',').map(d => d.trim())} + onChange={tags => onChangeDomainlist('whitelist', tags)} + /> +
+
+ ); +}; export default Domainlist; - -const lang = new I18n(translations); diff --git a/client/coral-admin/src/containers/Install/InstallContainer.js b/client/coral-admin/src/containers/Install/InstallContainer.js index fe41e12e4..b70d3b8c9 100644 --- a/client/coral-admin/src/containers/Install/InstallContainer.js +++ b/client/coral-admin/src/containers/Install/InstallContainer.js @@ -5,14 +5,16 @@ import {Wizard, WizardNav} from 'coral-ui'; import {Layout} from '../../components/ui/Layout'; import { - nextStep, - previousStep, goToStep, + nextStep, + submitUser, + checkInstall, + previousStep, + finishInstall, + submitSettings, updateUserFormData, updateSettingsFormData, - submitSettings, - submitUser, - checkInstall + updatePermittedDomains } from '../../actions/install'; import InitialStep from './components/Steps/InitialStep'; @@ -41,6 +43,9 @@ class InstallContainer extends Component {

Welcome to the Coral Project

{ install.step !== 0 ? : null } + + + @@ -64,10 +69,14 @@ const mapStateToProps = state => ({ }); const mapDispatchToProps = dispatch => ({ - checkInstall: next => dispatch(checkInstall(next)), nextStep: () => dispatch(nextStep()), - previousStep: () => dispatch(previousStep()), goToStep: step => dispatch(goToStep(step)), + previousStep: () => dispatch(previousStep()), + finishInstall: () => dispatch(finishInstall()), + checkInstall: next => dispatch(checkInstall(next)), + handleDomainsChange: value => { + dispatch(updatePermittedDomains(value)); + }, handleSettingsChange: e => { const {name, value} = e.currentTarget; dispatch(updateSettingsFormData(name, value)); diff --git a/client/coral-admin/src/containers/Install/components/Steps/PermittedDomainsStep.js b/client/coral-admin/src/containers/Install/components/Steps/PermittedDomainsStep.js index c5fae148e..f2c1546f6 100644 --- a/client/coral-admin/src/containers/Install/components/Steps/PermittedDomainsStep.js +++ b/client/coral-admin/src/containers/Install/components/Steps/PermittedDomainsStep.js @@ -8,22 +8,22 @@ import translations from '../../translations.json'; import I18n from 'coral-framework/modules/i18n/i18n'; const PermittedDomainsStep = props => { - const {nextStep, onChangeDomainlist} = props; - const domains = []; + const {finishInstall, install, handleDomainsChange} = props; + const domains = install.data.settings.domains.whitelist; return (

{lang.t('PERMITTED_DOMAINS.TITLE')}

- +

{lang.t('PERMITTED_DOMAINS.DESCRIPTION')}

data.split(',').map(d => d.trim())} - onChange={tags => onChangeDomainlist(tags)} + onChange={tags => handleDomainsChange(tags)} />
- +
); }; 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 a5867e960..dea752298 100644 --- a/client/coral-admin/src/containers/Install/components/Steps/style.css +++ b/client/coral-admin/src/containers/Install/components/Steps/style.css @@ -59,6 +59,12 @@ } } } + + .card { + max-width: 500px; + margin: 20px auto; + text-align: left; + } } .finalStep { diff --git a/client/coral-admin/src/reducers/install.js b/client/coral-admin/src/reducers/install.js index 8d3ea0f76..1f0f079ff 100644 --- a/client/coral-admin/src/reducers/install.js +++ b/client/coral-admin/src/reducers/install.js @@ -6,7 +6,10 @@ const initialState = Map({ isLoading: false, data: Map({ settings: Map({ - organizationName: '' + organizationName: '', + domains: Map({ + whitelist: List() + }) }), user: Map({ username: '', @@ -54,6 +57,9 @@ export default function install (state = initialState, action) { case actions.GO_TO_STEP: return state .set('step', action.step); + case actions.UPDATE_PERMITTED_DOMAINS_SETTINGS: + return state + .setIn(['data', 'settings', 'domains', 'whitelist'], action.value); case actions.UPDATE_FORMDATA_SETTINGS: return state .setIn(['data', 'settings', action.name], action.value);