diff options
author | 2018-08-05 08:03:40 +0000 | |
---|---|---|
committer | 2018-08-05 08:03:40 +0000 | |
commit | 8372b56a5c36293dc06f2dda6bb9389467d3eba7 (patch) | |
tree | c8dc03a18de7cf4b54b44f73fdf6af5b67d5b1dd /workflow-designer-ui/src/main | |
parent | d7d290e97e8403e0feffaef20fa7de4fa0e84b91 (diff) | |
parent | 2210e984704b0913b655c4627cd2168a61ffbf8b (diff) |
Merge "add errors and align style"
Diffstat (limited to 'workflow-designer-ui/src/main')
16 files changed, 178 insertions, 121 deletions
diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_customModal.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_customModal.scss index 2ee87387..fe8bd0cf 100644 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_customModal.scss +++ b/workflow-designer-ui/src/main/frontend/resources/scss/components/_customModal.scss @@ -1,18 +1,21 @@ .sdc-modal { .custom-modal-wrapper { - padding: 35px 60px 20px 60px; width: auto; } + .form-custom-modal { + padding: 30px 35px 20px 35px; + + .sdc-input { + margin-bottom: 15px; + } + } + } .modal-action-bar { display: flex; justify-content: flex-end; - - button:first-child { - margin-right: 2em; - } } textarea.field-section.sdc-input__input { diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/components/_layout.scss b/workflow-designer-ui/src/main/frontend/resources/scss/components/_layout.scss index bcd07ebe..fc51e812 100644 --- a/workflow-designer-ui/src/main/frontend/resources/scss/components/_layout.scss +++ b/workflow-designer-ui/src/main/frontend/resources/scss/components/_layout.scss @@ -9,8 +9,12 @@ display: flex; flex-direction: column; } + + .custom-textarea { + resize: none; + } } #root { height: 100%; -}
\ No newline at end of file +} diff --git a/workflow-designer-ui/src/main/frontend/resources/scss/features/_overview.scss b/workflow-designer-ui/src/main/frontend/resources/scss/features/_overview.scss index 8cb6be74..67883fbb 100644 --- a/workflow-designer-ui/src/main/frontend/resources/scss/features/_overview.scss +++ b/workflow-designer-ui/src/main/frontend/resources/scss/features/_overview.scss @@ -1,5 +1,5 @@ .overview-page { - @include body-1-semibold; + @include body-1; padding: 25px; .overview-content { diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/create/CreateVersionView.jsx b/workflow-designer-ui/src/main/frontend/src/features/version/create/CreateVersionView.jsx index 080329e9..f3a2cccf 100644 --- a/workflow-designer-ui/src/main/frontend/src/features/version/create/CreateVersionView.jsx +++ b/workflow-designer-ui/src/main/frontend/src/features/version/create/CreateVersionView.jsx @@ -61,20 +61,22 @@ class CreateVersionView extends Component { const { closeCreateVersionModal } = this.props; return ( <form onSubmit={this.handleSubmitForm}> - <div className="new-version-page custom-modal-wrapper "> - <Select - dataObj={VERSION_LEVEL_LIST} - selectedItem={VERSION_LEVEL_LIST[0].value} - label={I18n.t('version.category')} - disabled - /> - <Description - name="version-description" - description={this.state.newVersion.description} - dataTestId="new-version-description" - onDataChange={this.versionDetailsChanged} - /> - <div className="modal-action-bar"> + <div className="new-version-page custom-modal-wrapper"> + <div className="form-custom-modal"> + <Select + dataObj={VERSION_LEVEL_LIST} + selectedItem={VERSION_LEVEL_LIST[0].value} + label={I18n.t('version.category')} + disabled + /> + <Description + name="version-description" + description={this.state.newVersion.description} + dataTestId="new-version-description" + onDataChange={this.versionDetailsChanged} + /> + </div> + <div className="modal-action-bar sdc-modal__footer"> <Button btnType="primary"> {I18n.t('buttons.createBtn')} </Button> diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/create/__tests__/__snapshots__/CreateVersionView_snapshot-test.js.snap b/workflow-designer-ui/src/main/frontend/src/features/version/create/__tests__/__snapshots__/CreateVersionView_snapshot-test.js.snap index 25c7b932..08389c6e 100644 --- a/workflow-designer-ui/src/main/frontend/src/features/version/create/__tests__/__snapshots__/CreateVersionView_snapshot-test.js.snap +++ b/workflow-designer-ui/src/main/frontend/src/features/version/create/__tests__/__snapshots__/CreateVersionView_snapshot-test.js.snap @@ -5,55 +5,59 @@ exports[`Create new version snapshot renders correctly 1`] = ` onSubmit={[Function]} > <div - className="new-version-page custom-modal-wrapper " + className="new-version-page custom-modal-wrapper" > <div - className="select-wrapper version-selector sdc-input" + className="form-custom-modal" > - <label> - category - </label> - <select - className="inputinput-selector" - data-test-id="vc-select-box" - disabled={true} - value={undefined} + <div + className="select-wrapper version-selector sdc-input" > - <option - data-test-id="vc-option" - value="2" - > - Major - </option> - <option - data-test-id="vc-option" - value="1" + <label> + category + </label> + <select + className="inputinput-selector" + data-test-id="vc-select-box" + disabled={true} + value={undefined} > - Minor - </option> - </select> - </div> - <div - className="description-part" - > + <option + data-test-id="vc-option" + value="2" + > + Major + </option> + <option + data-test-id="vc-option" + value="1" + > + Minor + </option> + </select> + </div> <div - className="sdc-input" + className="description-part" > <div - className="sdc-input__label" + className="sdc-input" > - description + <div + className="sdc-input__label" + > + description + </div> + <textarea + className="custom-textarea field-section sdc-input__input" + data-test-id="new-version-description" + onChange={[Function]} + value={undefined} + /> </div> - <textarea - className="field-section sdc-input__input" - data-test-id="new-version-description" - onChange={[Function]} - value={undefined} - /> </div> </div> <div - className="modal-action-bar" + className="modal-action-bar sdc-modal__footer" > <button className="sdc-button sdc-button__primary " diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/inputOutput/inputOutputSelectors.js b/workflow-designer-ui/src/main/frontend/src/features/version/inputOutput/inputOutputSelectors.js index c37c9dbc..09dcc261 100644 --- a/workflow-designer-ui/src/main/frontend/src/features/version/inputOutput/inputOutputSelectors.js +++ b/workflow-designer-ui/src/main/frontend/src/features/version/inputOutput/inputOutputSelectors.js @@ -15,6 +15,7 @@ */ import { createSelector } from 'reselect'; +import { isEmpty } from 'lodash'; import { INPUTS } from 'features/version/inputOutput/inputOutputConstants'; @@ -60,3 +61,30 @@ export const getError = createSelector( [getInputOutput, getCurrent], (inputOutput, current) => inputOutput.error[current] ); + +export const getErrorsInputOutput = createSelector( + getInputOutput, + ({ error }) => error +); + +export const getInputErrors = createSelector( + getErrorsInputOutput, + ({ inputs }) => + !isEmpty(inputs) && + Boolean(inputs.alreadyExists.length || inputs.invalidCharacters.length) +); + +export const getOutputErrors = createSelector( + getErrorsInputOutput, + ({ outputs }) => + !isEmpty(outputs) && + Boolean( + outputs.alreadyExists.length || outputs.invalidCharacters.length + ) +); + +export const getIOErrors = createSelector( + getInputErrors, + getOutputErrors, + (inputsErrors, outputsErrors) => inputsErrors || outputsErrors +); diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/versionController/VersionController.js b/workflow-designer-ui/src/main/frontend/src/features/version/versionController/VersionController.js index 0c5b5b1f..2fc71957 100644 --- a/workflow-designer-ui/src/main/frontend/src/features/version/versionController/VersionController.js +++ b/workflow-designer-ui/src/main/frontend/src/features/version/versionController/VersionController.js @@ -30,6 +30,7 @@ import { certifyVersionAction } from 'features/version/versionController/versionControllerConstants'; import { workflowVersionFetchRequestedAction } from '../versionConstants'; +import { getIOErrors } from 'features/version/inputOutput/inputOutputSelectors'; function mapStateToProps(state) { return { @@ -38,7 +39,8 @@ function mapStateToProps(state) { versionsList: getSortedVersions(state), savedParams: getSavedObjParams(state), currentWorkflowVersion: state.currentVersion.general, - versionState: state.currentVersion.general.state + versionState: state.currentVersion.general.state, + getIOErrors: getIOErrors(state) }; } diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/versionController/VersionControllerView.jsx b/workflow-designer-ui/src/main/frontend/src/features/version/versionController/VersionControllerView.jsx index 88a2a7b8..20d5d73b 100644 --- a/workflow-designer-ui/src/main/frontend/src/features/version/versionController/VersionControllerView.jsx +++ b/workflow-designer-ui/src/main/frontend/src/features/version/versionController/VersionControllerView.jsx @@ -37,7 +37,8 @@ export default class VersionControllerView extends Component { workflowId: PropTypes.string, versionState: PropTypes.string, certifyVersion: PropTypes.func, - changeVersion: PropTypes.func + changeVersion: PropTypes.func, + getIOErrors: PropTypes.bool }; constructor(props) { @@ -83,7 +84,8 @@ export default class VersionControllerView extends Component { currentWorkflowVersion, workflowName, versionsList, - versionState + versionState, + getIOErrors } = this.props; let isCertifyDisable = versionState && @@ -99,6 +101,7 @@ export default class VersionControllerView extends Component { onVersionSelectChange={this.versionChangeCallback} /> <ActionButtons + saveDisabled={isCertifyDisable || getIOErrors} onSaveClick={this.sendSaveParamsToServer} certifyDisabled={isCertifyDisable} onCertifyClick={this.certifyVersion} diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/versionController/__tests__/__snapshots__/VersionControllerView_snapshot-test.js.snap b/workflow-designer-ui/src/main/frontend/src/features/version/versionController/__tests__/__snapshots__/VersionControllerView_snapshot-test.js.snap index 14da3e44..26043fcb 100644 --- a/workflow-designer-ui/src/main/frontend/src/features/version/versionController/__tests__/__snapshots__/VersionControllerView_snapshot-test.js.snap +++ b/workflow-designer-ui/src/main/frontend/src/features/version/versionController/__tests__/__snapshots__/VersionControllerView_snapshot-test.js.snap @@ -63,7 +63,7 @@ exports[`Version Controller View Snapshot renders correctly 1`] = ` <div className="svg-icon-wrapper bottom" data-test-id="vc-save-btn" - disabled={false} + disabled={undefined} onClick={undefined} > <test-file-stub diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/versionController/versionControllerSelectors.js b/workflow-designer-ui/src/main/frontend/src/features/version/versionController/versionControllerSelectors.js index a3ead31f..19c8bdc2 100644 --- a/workflow-designer-ui/src/main/frontend/src/features/version/versionController/versionControllerSelectors.js +++ b/workflow-designer-ui/src/main/frontend/src/features/version/versionController/versionControllerSelectors.js @@ -22,7 +22,6 @@ import { import { getVersionInfo } from 'features/version/general/generalSelectors'; import { getComposition } from 'features/version/composition/compositionSelectors'; -export const getVersionsList = state => state && state.workflow.versions; export const getSavedObjParams = createSelector( getOutputs, getInputs, diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/versionController/views/ActionButtons.js b/workflow-designer-ui/src/main/frontend/src/features/version/versionController/views/ActionButtons.js index b4a08915..a2f03380 100644 --- a/workflow-designer-ui/src/main/frontend/src/features/version/versionController/views/ActionButtons.js +++ b/workflow-designer-ui/src/main/frontend/src/features/version/versionController/views/ActionButtons.js @@ -22,7 +22,13 @@ import SvgButton from 'features/version/versionController/views/SvgButton'; const Separator = () => <div className="vc-separator" />; const ActionButtons = props => { - const { onSaveClick, certifyDisabled, onCertifyClick, onUndoClick } = props; + const { + onSaveClick, + certifyDisabled, + onCertifyClick, + onUndoClick, + saveDisabled + } = props; return ( <div className="save-submit-cancel-container"> <div className="action-buttons"> @@ -32,7 +38,7 @@ const ActionButtons = props => { dataTestId="vc-save-btn" name="version-controller-save" tooltipText={I18n.t('buttons.saveBtn')} - disabled={false} + disabled={saveDisabled} onClick={onSaveClick} /> <Separator /> @@ -61,7 +67,8 @@ ActionButtons.propTypes = { onSaveClick: PropTypes.func, certifyDisabled: PropTypes.bool, onCertifyClick: PropTypes.func, - onUndoClick: PropTypes.func + onUndoClick: PropTypes.func, + saveDisabled: PropTypes.bool }; export default ActionButtons; diff --git a/workflow-designer-ui/src/main/frontend/src/features/workflow/create/CreateWorkflowView.jsx b/workflow-designer-ui/src/main/frontend/src/features/workflow/create/CreateWorkflowView.jsx index 5f6f1805..de6089d4 100644 --- a/workflow-designer-ui/src/main/frontend/src/features/workflow/create/CreateWorkflowView.jsx +++ b/workflow-designer-ui/src/main/frontend/src/features/workflow/create/CreateWorkflowView.jsx @@ -38,24 +38,26 @@ const CreateWorkflowView = props => { return ( <form onSubmit={handleSubmitForm}> <div className="new-workflow-page custom-modal-wrapper"> - <Input - name="workflowName" - value={workflowName || ''} - type="text" - label={I18n.t('workflow.general.name')} - onChange={val => - workflowInputChange({ - name: val - }) - } - isRequired - /> - <Description - value={workflowDescription || ''} - label={I18n.t('workflow.general.description')} - onDataChange={workflowInputChange} - /> - <div className="modal-action-bar"> + <div className="form-custom-modal"> + <Input + name="workflowName" + value={workflowName || ''} + type="text" + label={I18n.t('workflow.general.name')} + onChange={val => + workflowInputChange({ + name: val + }) + } + isRequired + /> + <Description + value={workflowDescription || ''} + label={I18n.t('workflow.general.description')} + onDataChange={workflowInputChange} + /> + </div> + <div className="modal-action-bar sdc-modal__footer"> <Button btnType="primary"> {I18n.t('buttons.createBtn')} </Button> diff --git a/workflow-designer-ui/src/main/frontend/src/features/workflow/create/__tests__/__snapshots__/CreateWorkflowView_snapshot-test.js.snap b/workflow-designer-ui/src/main/frontend/src/features/workflow/create/__tests__/__snapshots__/CreateWorkflowView_snapshot-test.js.snap index 8a2790a9..de14dc3e 100644 --- a/workflow-designer-ui/src/main/frontend/src/features/workflow/create/__tests__/__snapshots__/CreateWorkflowView_snapshot-test.js.snap +++ b/workflow-designer-ui/src/main/frontend/src/features/workflow/create/__tests__/__snapshots__/CreateWorkflowView_snapshot-test.js.snap @@ -8,50 +8,54 @@ exports[`New Workflow View Snapshot renders correctly 1`] = ` className="new-workflow-page custom-modal-wrapper" > <div - className="sdc-input " + className="form-custom-modal" > - <label - className="sdc-input__label required" - htmlFor="workflowName" + <div + className="sdc-input " > - name - </label> - <input - className="sdc-input__input " - data-test-id={undefined} - disabled={false} - id="workflowName" - name="workflowName" - onBlur={[Function]} - onChange={[Function]} - onKeyDown={[Function]} - placeholder={undefined} - readOnly={false} - type="text" - value="" - /> - </div> - <div - className="description-part" - > + <label + className="sdc-input__label required" + htmlFor="workflowName" + > + name + </label> + <input + className="sdc-input__input " + data-test-id={undefined} + disabled={false} + id="workflowName" + name="workflowName" + onBlur={[Function]} + onChange={[Function]} + onKeyDown={[Function]} + placeholder={undefined} + readOnly={false} + type="text" + value="" + /> + </div> <div - className="sdc-input" + className="description-part" > <div - className="sdc-input__label" + className="sdc-input" > - description + <div + className="sdc-input__label" + > + description + </div> + <textarea + className="custom-textarea field-section sdc-input__input" + data-test-id="description" + onChange={[Function]} + value={undefined} + /> </div> - <textarea - className="field-section sdc-input__input" - data-test-id="description" - onChange={[Function]} - value={undefined} - /> </div> </div> <div - className="modal-action-bar" + className="modal-action-bar sdc-modal__footer" > <button className="sdc-button sdc-button__primary " diff --git a/workflow-designer-ui/src/main/frontend/src/features/workflow/overview/__tests__/__snapshots__/OverviewView_snapshot-test.js.snap b/workflow-designer-ui/src/main/frontend/src/features/workflow/overview/__tests__/__snapshots__/OverviewView_snapshot-test.js.snap index c2f541b2..7b3326e5 100644 --- a/workflow-designer-ui/src/main/frontend/src/features/workflow/overview/__tests__/__snapshots__/OverviewView_snapshot-test.js.snap +++ b/workflow-designer-ui/src/main/frontend/src/features/workflow/overview/__tests__/__snapshots__/OverviewView_snapshot-test.js.snap @@ -57,7 +57,7 @@ exports[`OverviewView Snapshot renders correctly 1`] = ` description </div> <textarea - className="field-section sdc-input__input" + className="custom-textarea field-section sdc-input__input" data-test-id="description" onChange={[Function]} value="desc 1" diff --git a/workflow-designer-ui/src/main/frontend/src/shared/components/Description/index.js b/workflow-designer-ui/src/main/frontend/src/shared/components/Description/index.js index 39400fd9..15a88341 100644 --- a/workflow-designer-ui/src/main/frontend/src/shared/components/Description/index.js +++ b/workflow-designer-ui/src/main/frontend/src/shared/components/Description/index.js @@ -29,7 +29,7 @@ const Description = ({ description, onDataChange, dataTestId }) => ( onChange={event => { onDataChange({ description: event.target.value }); }} - className="field-section sdc-input__input" + className="custom-textarea field-section sdc-input__input" /> </div> </div> diff --git a/workflow-designer-ui/src/main/frontend/src/shared/errorResponseHandler/errorResponseHandler.js b/workflow-designer-ui/src/main/frontend/src/shared/errorResponseHandler/errorResponseHandler.js index 960e255d..948f9f2f 100644 --- a/workflow-designer-ui/src/main/frontend/src/shared/errorResponseHandler/errorResponseHandler.js +++ b/workflow-designer-ui/src/main/frontend/src/shared/errorResponseHandler/errorResponseHandler.js @@ -13,14 +13,13 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -//import React from 'react'; import store from 'wfapp/store'; import { showErrorModalAction } from 'shared/modal/modalWrapperActions'; export default error => { const errorData = { title: error.statusText, - body: error.responseText ? error.responseText : 'GENERIC ERROR' + body: error.data ? error.data : 'GENERIC ERROR' }; store.dispatch( showErrorModalAction({ |