composition errors validation

Issue-ID: SDC-1591
Change-Id: Ie46e1e4bb04c90d1324909d419e3cfe290e881eb
Signed-off-by: Stanislav Vishnevetskiy <shlomo-stanisla.vishnevetskiy@amdocs.com>

11 files changed, 95 insertions, 21 deletions

diff --git a/workflow-designer-ui/src/main/frontend/package.json b/workflow-designer-ui/src/main/frontend/package.json
index 6fdf4429..62b06cbe 100644
--- a/workflow-designer-ui/src/main/frontend/package.json
+++ b/workflow-designer-ui/src/main/frontend/package.json
@@ -27,6 +27,7 @@
 		"inherits": "^2.0.3",
 		"lodash.assign": "^4.2.0",
 		"lodash.isempty": "^4.4.0",
+		"lodash.isequal": "^4.5.0",
 		"lodash.map": "^4.6.0",
 		"lodash.merge": "^4.6.1",
 		"lodash.set": "^4.3.2",
diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/composition/Composition.js b/workflow-designer-ui/src/main/frontend/src/features/version/composition/Composition.js
index d898f717..c9fc4b55 100644
--- a/workflow-designer-ui/src/main/frontend/src/features/version/composition/Composition.js
+++ b/workflow-designer-ui/src/main/frontend/src/features/version/composition/Composition.js
@@ -15,10 +15,10 @@
 */
 import { connect } from 'react-redux';
 import { I18n } from 'react-redux-i18n';
-import { updateComposition } from './compositionActions';
+import { updateComposition, updateValidation } from './compositionActions';
 import CompositionView from './CompositionView';
 import { showErrorModalAction } from '../../../shared/modal/modalWrapperActions';
-import { getComposition } from './compositionSelectors';
+import { getComposition, getErrors } from './compositionSelectors';
 import { getWorkflowName } from '../../workflow/workflowSelectors';
 import { activitiesSelector } from 'features/activities/activitiesSelectors';
 import { getInputOutputForComposition } from 'features/version/inputOutput/inputOutputSelectors';
@@ -29,7 +29,8 @@ function mapStateToProps(state) {
         name: getWorkflowName(state),
         versionName: getVersionInfo(state).name,
         activities: activitiesSelector(state),
-        inputOutput: getInputOutputForComposition(state)
+        inputOutput: getInputOutputForComposition(state),
+        errors: getErrors(state)
     };
 }
 
@@ -45,7 +46,9 @@ function mapDispatchToProps(dispatch) {
                     withButtons: true,
                     closeButtonText: I18n.t('buttons.okBtn')
                 })
-            )
+            ),
+        validationUpdate: (element, isValid) =>
+            dispatch(updateValidation({ element, isValid }))
     };
 }
 
diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/composition/CompositionView.js b/workflow-designer-ui/src/main/frontend/src/features/version/composition/CompositionView.js
index c19ef94b..eac30837 100644
--- a/workflow-designer-ui/src/main/frontend/src/features/version/composition/CompositionView.js
+++ b/workflow-designer-ui/src/main/frontend/src/features/version/composition/CompositionView.js
@@ -15,6 +15,7 @@
 */
 import React, { Component } from 'react';
 import fileSaver from 'file-saver';
+import isEqual from 'lodash.isequal';
 import CustomModeler from './custom-modeler';
 import propertiesPanelModule from 'bpmn-js-properties-panel';
 import propertiesProviderModule from './custom-properties-provider/provider/camunda';
@@ -24,7 +25,12 @@ import PropTypes from 'prop-types';
 import CompositionButtons from './components/CompositionButtonsPanel';
 import { setElementInputsOutputs } from './bpmnUtils.js';
 import { I18n } from 'react-redux-i18n';
-import { PROCESS_DEFAULT_ID } from './compositionConstants';
+import {
+    PROCESS_DEFAULT_ID,
+    COMPOSITION_ERROR_COLOR,
+    COMPOSITION_VALID_COLOR
+} from './compositionConstants';
+
 class CompositionView extends Component {
     static propTypes = {
         compositionUpdate: PropTypes.func,
@@ -33,7 +39,9 @@ class CompositionView extends Component {
         name: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
         versionName: PropTypes.string,
         inputOutput: PropTypes.object,
-        activities: PropTypes.array
+        activities: PropTypes.array,
+        validationUpdate: PropTypes.func,
+        errors: PropTypes.array
     };
 
     constructor() {
@@ -46,9 +54,25 @@ class CompositionView extends Component {
             diagram: false
         };
     }
-
+    componentDidUpdate(prevProps) {
+        const { errors } = this.props;
+        if (!isEqual(prevProps.errors, errors)) {
+            errors.map(item => {
+                this.modeling.setColor([item.element], {
+                    fill: item.isValid
+                        ? COMPOSITION_VALID_COLOR
+                        : COMPOSITION_ERROR_COLOR
+                });
+            });
+        }
+    }
     componentDidMount() {
-        const { composition, activities, inputOutput } = this.props;
+        const {
+            composition,
+            activities,
+            inputOutput,
+            validationUpdate
+        } = this.props;
 
         this.modeler = new CustomModeler({
             propertiesPanel: {
@@ -64,7 +88,8 @@ class CompositionView extends Component {
             workflow: {
                 activities: activities,
                 getActivityInputsOutputs: this.getActivityInputsOutputs,
-                workflowInputOutput: inputOutput
+                workflowInputOutput: inputOutput,
+                validationUpdate: validationUpdate
             }
         });
 
@@ -72,6 +97,7 @@ class CompositionView extends Component {
         this.setDiagramToBPMN(composition ? composition : newDiagramXML);
         this.modeler.on('element.out', () => this.exportDiagramToStore());
         this.bpmnContainer.current.click();
+        this.modeling = this.modeler.get('modeling');
     }
 
     getActivityInputsOutputs = selectedValue => {
@@ -96,9 +122,9 @@ class CompositionView extends Component {
                     I18n.t('workflow.composition.importErrorMsg')
                 );
             }
-            let canvas = modeler.get('canvas');
+            const canvas = modeler.get('canvas');
             canvas.zoom('fit-viewport');
-            let { businessObject } = canvas._rootElement;
+            const { businessObject } = canvas._rootElement;
 
             this.setDefaultIdAndName(businessObject);
             setElementInputsOutputs(
@@ -109,7 +135,7 @@ class CompositionView extends Component {
         });
     };
     setDefaultIdAndName = businessObject => {
-        const { name } = this.props;
+        const { name = '' } = this.props;
         if (!businessObject.name) {
             businessObject.name = name;
         }
diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionActions.js b/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionActions.js
index 3f1755dd..b11c9567 100644
--- a/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionActions.js
+++ b/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionActions.js
@@ -13,9 +13,14 @@
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
-import { SET_COMPOSITION } from './compositionConstants';
+import { SET_COMPOSITION, UPDATE_ERRORS } from './compositionConstants';
 
 export const updateComposition = payload => ({
     type: SET_COMPOSITION,
     payload
 });
+
+export const updateValidation = payload => ({
+    type: UPDATE_ERRORS,
+    payload
+});
diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionConstants.js b/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionConstants.js
index 7f3537f6..79c7e8e6 100644
--- a/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionConstants.js
+++ b/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionConstants.js
@@ -14,6 +14,7 @@
 * limitations under the License.
 */
 export const SET_COMPOSITION = 'composition/SET_COMPOSITION';
+export const UPDATE_ERRORS = 'composition/UPDATE_ERRORS';
 
 export const bpmnElementsTypes = {
     EXTENSION_ElEMENTS: 'bpmn:ExtensionElements',
@@ -23,3 +24,6 @@ export const bpmnElementsTypes = {
 };
 
 export const PROCESS_DEFAULT_ID = 'Process_1';
+
+export const COMPOSITION_ERROR_COLOR = '#f0c2c2';
+export const COMPOSITION_VALID_COLOR = 'white';
diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionReducer.js b/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionReducer.js
index 9c707362..9ad0f671 100644
--- a/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionReducer.js
+++ b/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionReducer.js
@@ -14,13 +14,24 @@
 * limitations under the License.
 */
 import { SET_COMPOSITION } from './compositionConstants';
+import { UPDATE_ERRORS } from './compositionConstants';
 
-export default (state = {}, action) => {
+export default (state = { diagram: false, errors: [] }, action) => {
     switch (action.type) {
         case SET_COMPOSITION:
             return {
+                ...state,
                 diagram: action.payload
             };
+        case UPDATE_ERRORS: {
+            const filteredErrors = state.errors.filter(
+                el => el.id !== action.payload.id
+            );
+            return {
+                ...state,
+                errors: [...filteredErrors, action.payload]
+            };
+        }
         default:
             return state;
     }
diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionSelectors.js b/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionSelectors.js
index 7e28ca64..e6b51f1a 100644
--- a/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionSelectors.js
+++ b/workflow-designer-ui/src/main/frontend/src/features/version/composition/compositionSelectors.js
@@ -15,3 +15,18 @@
 */
 export const getComposition = state =>
     state && state.currentVersion && state.currentVersion.composition.diagram;
+
+export const getCompositionHasErrors = state =>
+    state &&
+    state.currentVersion &&
+    state.currentVersion.composition &&
+    state.currentVersion.composition.errors &&
+    Boolean(
+        state.currentVersion.composition.errors.find(item => !item.isValid)
+    );
+
+export const getErrors = state =>
+    state &&
+    state.currentVersion &&
+    state.currentVersion.composition &&
+    state.currentVersion.composition.errors;
diff --git a/workflow-designer-ui/src/main/frontend/src/features/version/composition/custom-properties-provider/provider/camunda/parts/implementation/WorkflowActivity.js b/workflow-designer-ui/src/main/frontend/src/features/version/composition/custom-properties-provider/provider/camunda/parts/implementation/WorkflowActivity.js
index 50d53b56..6616f6a4 100644
--- a/workflow-designer-ui/src/main/frontend/src/features/version/composition/custom-properties-provider/provider/camunda/parts/implementation/WorkflowActivity.js
+++ b/workflow-designer-ui/src/main/frontend/src/features/version/composition/custom-properties-provider/provider/camunda/parts/implementation/WorkflowActivity.js
@@ -69,7 +69,11 @@ const workflowActivity = (element, config, bpmnFactory, options, translate) => {
         },
 
         validate: function(element, values) {
-            return isWorkflowActivity(element) && !values.workflowActivity
+            const hasErrors =
+                isWorkflowActivity(element) && !values.workflowActivity;
+            config.validationUpdate(element, !hasErrors);
+
+            return hasErrors
                 ? { workflowActivity: 'Must provide a value' }
                 : {};
         },
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 3a4b71dd..5c334337 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
@@ -32,6 +32,7 @@ import {
 import { workflowVersionFetchRequestedAction } from '../versionConstants';
 import { getIsCertified } from 'features/version/general/generalSelectors';
 import { getIOErrors } from 'features/version/inputOutput/inputOutputSelectors';
+import { getCompositionHasErrors } from 'features/version/composition/compositionSelectors';
 
 function mapStateToProps(state) {
     return {
@@ -39,7 +40,7 @@ function mapStateToProps(state) {
         workflowId: getWorkflowId(state),
         versionsList: getSortedVersions(state),
         savedParams: getSavedObjParams(state),
-        getIOErrors: getIOErrors(state),
+        hasErrors: getIOErrors(state) || getCompositionHasErrors(state),
         isCertifyDisable: getIsCertified(state),
         currentWorkflowVersion: state.currentVersion.general
     };
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 3f47b44a..88157e99 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
@@ -36,8 +36,8 @@ export default class VersionControllerView extends Component {
         workflowId: PropTypes.string,
         certifyVersion: PropTypes.func,
         changeVersion: PropTypes.func,
-        getIOErrors: PropTypes.bool,
-        isCertifyDisable: PropTypes.bool
+        isCertifyDisable: PropTypes.bool,
+        hasErrors: PropTypes.bool
     };
 
     constructor(props) {
@@ -95,7 +95,7 @@ export default class VersionControllerView extends Component {
             currentWorkflowVersion,
             workflowName,
             versionsList,
-            getIOErrors,
+            hasErrors,
             isCertifyDisable
         } = this.props;
         return (
@@ -109,9 +109,9 @@ export default class VersionControllerView extends Component {
                         onVersionSelectChange={this.versionChangeCallback}
                     />
                     <ActionButtons
-                        saveDisabled={isCertifyDisable || getIOErrors}
+                        saveDisabled={isCertifyDisable || hasErrors}
                         onSaveClick={this.sendSaveParamsToServer}
-                        certifyDisabled={isCertifyDisable || getIOErrors}
+                        certifyDisabled={isCertifyDisable || hasErrors}
                         onCertifyClick={this.certifyVersion}
                         onUndoClick={this.undoClickCallback}
                     />
diff --git a/workflow-designer-ui/src/main/frontend/yarn.lock b/workflow-designer-ui/src/main/frontend/yarn.lock
index c9847904..4235c3d0 100644
--- a/workflow-designer-ui/src/main/frontend/yarn.lock
+++ b/workflow-designer-ui/src/main/frontend/yarn.lock
@@ -7032,6 +7032,10 @@ lodash.isempty@^4.4.0:
   version "4.4.0"
   resolved "https://registry.yarnpkg.com/lodash.isempty/-/lodash.isempty-4.4.0.tgz#6f86cbedd8be4ec987be9aaf33c9684db1b31e7e"
 
+lodash.isequal@^4.5.0:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
+
 lodash.isplainobject@^4.0.6:
   version "4.0.6"
   resolved "https://registry.yarnpkg.com/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz#7c526a52d89b45c45cc690b88163be0497f550cb"