From 5650b7cf3af0a3fbb8d6d59a013fc375c0f35112 Mon Sep 17 00:00:00 2001 From: okbel Date: Wed, 28 Mar 2018 09:34:06 -0300 Subject: [PATCH 01/16] Adding proptypes --- .../src/routes/Install/components/Install.js | 20 +++++++++++++++++-- 1 file changed, 18 insertions(+), 2 deletions(-) diff --git a/client/coral-admin/src/routes/Install/components/Install.js b/client/coral-admin/src/routes/Install/components/Install.js index 14afc12f5..823b32968 100644 --- a/client/coral-admin/src/routes/Install/components/Install.js +++ b/client/coral-admin/src/routes/Install/components/Install.js @@ -1,7 +1,8 @@ -import React, { Component } from 'react'; +import React from 'react'; import styles from './Install.css'; import { Wizard, WizardNav } from 'coral-ui'; import Layout from 'coral-admin/src/components/Layout'; +import PropTypes from 'prop-types'; import InitialStep from './Steps/InitialStep'; import AddOrganizationName from './Steps/AddOrganizationName'; @@ -9,7 +10,7 @@ import CreateYourAccount from './Steps/CreateYourAccount'; import PermittedDomainsStep from './Steps/PermittedDomainsStep'; import FinalStep from './Steps/FinalStep'; -export default class Install extends Component { +class Install extends React.Component { handleDomainsChange = value => { this.props.updatePermittedDomains(value); }; @@ -81,3 +82,18 @@ export default class Install extends Component { ); } } + +Install.propTypes = { + updatePermittedDomains: PropTypes.func.isRequired, + updateSettingsFormData: PropTypes.func.isRequired, + updateUserFormData: PropTypes.func.isRequired, + submitSettings: PropTypes.func.isRequired, + submitUser: PropTypes.func.isRequired, + install: PropTypes.object.isRequired, + nextStep: PropTypes.func.isRequired, + previousStep: PropTypes.func.isRequired, + goToStep: PropTypes.func.isRequired, + finishInstall: PropTypes.func.isRequired, +}; + +export default Install; From 480428b4a2fe1e19dd61bccf745827f79f4c54e9 Mon Sep 17 00:00:00 2001 From: okbel Date: Wed, 28 Mar 2018 09:44:02 -0300 Subject: [PATCH 02/16] PropTypes and adding field --- .../components/Steps/CreateYourAccount.js | 10 +++++ .../src/routes/Install/containers/Install.js | 37 +++++++++++++++---- locales/ar.yml | 1 + locales/da.yml | 1 + locales/de.yml | 1 + locales/en.yml | 1 + locales/es.yml | 1 + locales/fr.yml | 1 + locales/pt_BR.yml | 1 + 9 files changed, 47 insertions(+), 7 deletions(-) diff --git a/client/coral-admin/src/routes/Install/components/Steps/CreateYourAccount.js b/client/coral-admin/src/routes/Install/components/Steps/CreateYourAccount.js index 37387c446..723c4fb78 100644 --- a/client/coral-admin/src/routes/Install/components/Steps/CreateYourAccount.js +++ b/client/coral-admin/src/routes/Install/components/Steps/CreateYourAccount.js @@ -52,6 +52,16 @@ const InitialStep = props => { errorMsg={install.errors.confirmPassword} /> + + {!props.install.isLoading ? ( + ) : ( +
+ + Cancel +
+ )} + + {console.log(this.props.slotPassthrough)} + +
    +
  • +
    • -
- - -
    -
  • -
  • + - -
diff --git a/client/coral-framework/components/ConfigureCard.js b/client/coral-framework/components/ConfigureCard.js index 703733a7d..7a2872318 100644 --- a/client/coral-framework/components/ConfigureCard.js +++ b/client/coral-framework/components/ConfigureCard.js @@ -43,7 +43,7 @@ const ConfigureCard = ({ ); ConfigureCard.propTypes = { - title: PropTypes.string.isRequired, + title: PropTypes.string, className: PropTypes.string, onCheckbox: PropTypes.func, checked: PropTypes.bool, From 1ceb1b4014bc16f2cee8d44495b0bf68948b8236 Mon Sep 17 00:00:00 2001 From: okbel Date: Tue, 10 Apr 2018 11:46:32 -0300 Subject: [PATCH 09/16] Save, and edit changes --- .../routes/Configure/components/Configure.js | 13 +++- .../components/OrganizationSettings.css | 27 +++++--- .../components/OrganizationSettings.js | 63 ++++++++++++++----- .../routes/Configure/containers/Configure.js | 5 +- locales/en.yml | 2 + locales/es.yml | 2 + 6 files changed, 88 insertions(+), 24 deletions(-) diff --git a/client/coral-admin/src/routes/Configure/components/Configure.js b/client/coral-admin/src/routes/Configure/components/Configure.js index 69ab4f06c..bcd48c21c 100644 --- a/client/coral-admin/src/routes/Configure/components/Configure.js +++ b/client/coral-admin/src/routes/Configure/components/Configure.js @@ -8,7 +8,14 @@ import SaveChangesDialog from './SaveChangesDialog'; class Configure extends React.Component { render() { - const { canSave, currentUser, root, savePending, settings } = this.props; + const { + canSave, + currentUser, + root, + savePending, + settings, + clearPending, + } = this.props; if (!can(currentUser, 'UPDATE_CONFIG')) { return

{t('configure.access_message')}

; @@ -17,6 +24,9 @@ class Configure extends React.Component { const passProps = { root, settings, + savePending, + clearPending, + canSave, }; return ( @@ -84,6 +94,7 @@ Configure.propTypes = { children: PropTypes.node.isRequired, saveDialog: PropTypes.bool, hideSaveDialog: PropTypes.func.isRequired, + clearPending: PropTypes.func.isRequired, }; export default Configure; diff --git a/client/coral-admin/src/routes/Configure/components/OrganizationSettings.css b/client/coral-admin/src/routes/Configure/components/OrganizationSettings.css index 06ada55c4..d28fced83 100644 --- a/client/coral-admin/src/routes/Configure/components/OrganizationSettings.css +++ b/client/coral-admin/src/routes/Configure/components/OrganizationSettings.css @@ -16,7 +16,7 @@ } .detailValue { - padding: 6px 10px; + padding: 6px 0; border: solid 1px transparent; display: block; font-size: 1em; @@ -24,6 +24,8 @@ } .editable { + padding-left: 10px; + padding-right: 10px; border-color: grey; } @@ -32,20 +34,31 @@ list-style: none; } -.editButton { - position: absolute; - right: 10px; - top: 10px; +.button, .button:disabled { + background: white; + border: solid 1px grey; } .actionBox { position: absolute; - right: 10px; - top: 10px; + right: 20px; + top: 20px; text-align: center; + width: 100px; } .cancelButton { padding: 10px; display: block; + color: #4f5c67; + font-weight: 500; + + &:hover { + cursor: pointer; + } +} + +.changedSave { + background-color: #00796B; + color: white; } \ No newline at end of file diff --git a/client/coral-admin/src/routes/Configure/components/OrganizationSettings.js b/client/coral-admin/src/routes/Configure/components/OrganizationSettings.js index 18fe653e1..06c91926c 100644 --- a/client/coral-admin/src/routes/Configure/components/OrganizationSettings.js +++ b/client/coral-admin/src/routes/Configure/components/OrganizationSettings.js @@ -17,6 +17,12 @@ class OrganizationSettings extends React.Component { })); }; + disableEditing = () => { + this.setState(() => ({ + editing: false, + })); + }; + updateName = event => { const updater = { organizationName: { $set: event.target.value } }; this.props.updatePending({ updater }); @@ -27,32 +33,56 @@ class OrganizationSettings extends React.Component { this.props.updatePending({ updater }); }; + cancelEditing = () => { + this.disableEditing(); + this.props.clearPending(); + }; + + save = async () => { + await this.props.savePending(); + this.disableEditing(); + }; + render() { - const { settings, slotPassthrough } = this.props; + const { settings, slotPassthrough, canSave } = this.props; return (

{t('configure.organization_info_copy')}

{t('configure.organization_info_copy_2')}

{!this.state.editing ? ( - +
+ +
) : (
- - Cancel + {canSave ? ( + + ) : ( + + )} + + {t('cancel')} +
)} - - {console.log(this.props.slotPassthrough)} -