diff options
Diffstat (limited to 'ui-react')
5 files changed, 79 insertions, 74 deletions
diff --git a/ui-react/src/api/LoopCache.js b/ui-react/src/api/LoopCache.js index c8ecca2f..5eaa79a6 100644 --- a/ui-react/src/api/LoopCache.js +++ b/ui-react/src/api/LoopCache.js @@ -126,12 +126,14 @@ export default class LoopCache { return null; } - getOperationalPolicySupportedPdpgroup(name) { + getOperationalPolicySupportedPdpGroup(name) { var opConfig=this.getOperationalPolicyForName(name); if (opConfig !== null) { - return opConfig["policyModel"]["policyPdpGroup"]["supportedPdpGroups"]; + if (opConfig["policyModel"]["policyPdpGroup"] !== undefined && opConfig["policyModel"]["policyPdpGroup"]["supportedPdpGroups"] !== undefined) { + return opConfig["policyModel"]["policyPdpGroup"]["supportedPdpGroups"]; + } } - return null; + return []; } getOperationalPolicyPdpGroup(name) { @@ -150,12 +152,14 @@ export default class LoopCache { return null; } - getMicroServiceSupportedPdpgroup(name) { + getMicroServiceSupportedPdpGroup(name) { var microService=this.getMicroServiceForName(name); if (microService !== null) { - return microService["policyModel"]["policyPdpGroup"]["supportedPdpGroups"]; + if (microService["policyModel"]["policyPdpGroup"] !== undefined && microService["policyModel"]["policyPdpGroup"]["supportedPdpGroups"] !== undefined) { + return microService["policyModel"]["policyPdpGroup"]["supportedPdpGroups"]; + } } - return null; + return []; } getMicroServicePdpGroup(name) { diff --git a/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.js b/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.js index 3fa0c0ca..da65ac9f 100644 --- a/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.js +++ b/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.js @@ -85,19 +85,20 @@ export default class ConfigurationPolicyModal extends React.Component { } var editorData = this.state.loopCache.getMicroServicePropertiesForName(this.state.policyName); - JSONEditor.defaults.options.theme = 'bootstrap4'; - //JSONEditor.defaults.options.iconlib = 'bootstrap2'; - JSONEditor.defaults.options.object_layout = 'grid'; - JSONEditor.defaults.options.disable_properties = true; - JSONEditor.defaults.options.disable_edit_json = false; - JSONEditor.defaults.options.disable_array_reorder = true; - JSONEditor.defaults.options.disable_array_delete_last_row = true; - JSONEditor.defaults.options.disable_array_delete_all_rows = false; - JSONEditor.defaults.options.show_errors = 'always'; - this.setState({ jsonEditor: new JSONEditor(document.getElementById("editor"), - { schema: toscaModel.schema, startval: editorData }) + { + schema: toscaModel, + startval: editorData, + theme: 'bootstrap4', + object_layout: 'grid', + disable_properties: true, + disable_edit_json: false, + disable_array_reorder: true, + disable_array_delete_last_row: true, + disable_array_delete_all_rows: false, + show_errors: 'always' + }) }) } diff --git a/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.test.js b/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.test.js index 4d527b71..a19c18c9 100644 --- a/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.test.js +++ b/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.test.js @@ -25,7 +25,6 @@ import { mount } from 'enzyme'; import ConfigurationPolicyModal from './ConfigurationPolicyModal'; import LoopCache from '../../../api/LoopCache'; - describe('Verify ConfigurationPolicyModal', () => { beforeEach(() => { fetch.resetMocks(); diff --git a/ui-react/src/components/dialogs/OperationalPolicy/OperationalPolicyModal.js b/ui-react/src/components/dialogs/OperationalPolicy/OperationalPolicyModal.js index dc7c0a48..7ed8ba6f 100644 --- a/ui-react/src/components/dialogs/OperationalPolicy/OperationalPolicyModal.js +++ b/ui-react/src/components/dialogs/OperationalPolicy/OperationalPolicyModal.js @@ -94,20 +94,8 @@ export default class OperationalPolicyModal extends React.Component { return liel; } }); - JSONEditor.defaults.options.theme = 'myBootstrap4'; - JSONEditor.defaults.options.object_layout = 'grid'; - JSONEditor.defaults.options.disable_properties = true; - JSONEditor.defaults.options.disable_edit_json = false; - JSONEditor.defaults.options.disable_array_reorder = true; - JSONEditor.defaults.options.disable_array_delete_last_row = true; - JSONEditor.defaults.options.disable_array_delete_all_rows = false; - JSONEditor.defaults.options.array_controls_top=true; - JSONEditor.defaults.options.show_errors = 'always'; - JSONEditor.defaults.options.keep_oneof_values=false; - JSONEditor.defaults.options.collapsed=true; - //JSONEditor.defaults.options.template = 'default'; } - + renderJsonEditor() { console.debug("Rendering OperationalPolicyModal"); var schema_json = this.state.loopCache.getOperationalPolicyJsonSchema(); @@ -120,7 +108,21 @@ export default class OperationalPolicyModal extends React.Component { this.setState({ jsonEditor: new JSONEditor(document.getElementById("editor"), - { schema: schema_json.schema, startval: operationalPoliciesData }) + { + schema: schema_json.schema, + startval: operationalPoliciesData, + theme: 'myBootstrap4', + object_layout: 'grid', + disable_properties: true, + disable_edit_json: false, + disable_array_reorder: true, + disable_array_delete_last_row: true, + disable_array_delete_all_rows: false, + array_controls_top: true, + show_errors: 'always', + keep_oneof_values: false, + collapsed:true + }) }) } diff --git a/ui-react/src/components/dialogs/Policy/PolicyModal.js b/ui-react/src/components/dialogs/Policy/PolicyModal.js index caae70ef..634c5ac5 100644 --- a/ui-react/src/components/dialogs/Policy/PolicyModal.js +++ b/ui-react/src/components/dialogs/Policy/PolicyModal.js @@ -59,6 +59,7 @@ export default class PolicyModal extends React.Component { this.renderJsonEditor = this.renderJsonEditor.bind(this); this.handlePdpGroupChange = this.handlePdpGroupChange.bind(this); this.handlePdpSubgroupChange = this.handlePdpSubgroupChange.bind(this); + this.createJsonEditor = this.createJsonEditor.bind(this); } handleSave() { @@ -67,13 +68,12 @@ export default class PolicyModal extends React.Component { if (errors.length !== 0) { console.error("Errors detected during policy data validation ", errors); - this.setState({ show: false }); - this.props.history.push('/'); + return; } else { console.info("NO validation errors found in policy data"); if (this.state.policyInstanceType === 'MICRO-SERVICE-POLICY') { - this.state.loopCache.updateMicroServiceProperties(this.state.policyName, editorData[0]); + this.state.loopCache.updateMicroServiceProperties(this.state.policyName, editorData); this.state.loopCache.updateMicroServicePdpGroup(this.state.policyName, this.state.chosenPdpGroup, this.state.chosenPdpSubgroup); LoopService.setMicroServiceProperties(this.state.loopCache.getLoopName(), this.state.loopCache.getMicroServiceForName(this.state.policyName)).then(resp => { this.setState({ show: false }); @@ -81,7 +81,7 @@ export default class PolicyModal extends React.Component { this.props.loadLoopFunction(this.state.loopCache.getLoopName()); }); } else if (this.state.policyInstanceType === 'OPERATIONAL-POLICY') { - this.state.loopCache.updateOperationalPolicyProperties(this.state.policyName, editorData[0]); + this.state.loopCache.updateOperationalPolicyProperties(this.state.policyName, editorData); this.state.loopCache.updateOperationalPolicyPdpGroup(this.state.policyName, this.state.chosenPdpGroup, this.state.chosenPdpSubgroup); LoopService.setOperationalPolicyProperties(this.state.loopCache.getLoopName(), this.state.loopCache.getOperationalPolicies()).then(resp => { this.setState({ show: false }); @@ -101,6 +101,26 @@ export default class PolicyModal extends React.Component { this.renderJsonEditor(); } + createJsonEditor(toscaModel, editorData) { + return new JSONEditor(document.getElementById("editor"), + { schema: toscaModel, + startval: editorData, + theme: 'bootstrap4', + object_layout: 'grid', + disable_properties: true, + disable_edit_json: false, + disable_array_reorder: true, + disable_array_delete_last_row: true, + disable_array_delete_all_rows: false, + no_additional_properties: true, + show_errors: 'always', + display_required_only: false, + show_opt_in: true, + prompt_before_delete: true, + required_by_default: true + }) + } + renderJsonEditor() { console.debug("Rendering PolicyModal ", this.state.policyName); var toscaModel = {}; @@ -110,13 +130,13 @@ export default class PolicyModal extends React.Component { if (this.state.policyInstanceType === 'MICRO-SERVICE-POLICY') { toscaModel = this.state.loopCache.getMicroServiceJsonRepresentationForName(this.state.policyName); editorData = this.state.loopCache.getMicroServicePropertiesForName(this.state.policyName); - pdpGroupValues = this.state.loopCache.getMicroServiceSupportedPdpgroup(this.state.policyName); + pdpGroupValues = this.state.loopCache.getMicroServiceSupportedPdpGroup(this.state.policyName); chosenPdpGroupValue = this.state.loopCache.getMicroServicePdpGroup(this.state.policyName); chosenPdpSubgroupValue = this.state.loopCache.getMicroServicePdpSubgroup(this.state.policyName); } else if (this.state.policyInstanceType === 'OPERATIONAL-POLICY') { toscaModel = this.state.loopCache.getOperationalPolicyJsonRepresentationForName(this.state.policyName); editorData = this.state.loopCache.getOperationalPolicyPropertiesForName(this.state.policyName); - pdpGroupValues = this.state.loopCache.getOperationalPolicySupportedPdpgroup(this.state.policyName); + pdpGroupValues = this.state.loopCache.getOperationalPolicySupportedPdpGroup(this.state.policyName); chosenPdpGroupValue = this.state.loopCache.getOperationalPolicyPdpGroup(this.state.policyName); chosenPdpSubgroupValue = this.state.loopCache.getOperationalPolicyPdpSubgroup(this.state.policyName); } @@ -125,49 +145,28 @@ export default class PolicyModal extends React.Component { return; } - JSONEditor.defaults.options.theme = 'bootstrap4'; - //JSONEditor.defaults.options.iconlib = 'bootstrap2'; - JSONEditor.defaults.options.object_layout = 'grid'; - JSONEditor.defaults.options.disable_properties = true; - JSONEditor.defaults.options.disable_edit_json = false; - JSONEditor.defaults.options.disable_array_reorder = true; - JSONEditor.defaults.options.disable_array_delete_last_row = true; - JSONEditor.defaults.options.disable_array_delete_all_rows = false; - JSONEditor.defaults.options.show_errors = 'always'; - - var pdpGroupListValues = pdpGroupValues.map(entry => { - return { label: Object.keys(entry)[0], value: Object.keys(entry)[0] }; - }); - - if (typeof(chosenPdpGroupValue) === "undefined") { - this.setState({ - jsonEditor: new JSONEditor(document.getElementById("editor"), - { schema: toscaModel.schema, startval: editorData }), - pdpGroup: pdpGroupValues, - pdpGroupList: pdpGroupListValues, - chosenPdpGroup: chosenPdpGroupValue, - chosenPdpSubgroup: chosenPdpSubgroupValue - }) - } else { + var pdpSubgroupValues = []; + if (typeof(chosenPdpGroupValue) !== "undefined") { var selectedPdpGroup = pdpGroupValues.filter(entry => (Object.keys(entry)[0] === chosenPdpGroupValue)); - const pdpSubgroupValues = selectedPdpGroup[0][chosenPdpGroupValue].map((pdpSubgroup) => { return { label: pdpSubgroup, value: pdpSubgroup } }); - this.setState({ - jsonEditor: new JSONEditor(document.getElementById("editor"), - { schema: toscaModel.schema, startval: editorData }), - pdpGroup: pdpGroupValues, - pdpGroupList: pdpGroupListValues, - pdpSubgroupList: pdpSubgroupValues, - chosenPdpGroup: chosenPdpGroupValue, - chosenPdpSubgroup: chosenPdpSubgroupValue - }) + pdpSubgroupValues = selectedPdpGroup[0][chosenPdpGroupValue].map((pdpSubgroup) => { return { label: pdpSubgroup, value: pdpSubgroup } }); } + this.setState({ + jsonEditor: this.createJsonEditor(toscaModel,editorData), + pdpGroup: pdpGroupValues, + pdpGroupList: pdpGroupValues.map(entry => { + return { label: Object.keys(entry)[0], value: Object.keys(entry)[0] }; + }), + pdpSubgroupList: pdpSubgroupValues, + chosenPdpGroup: chosenPdpGroupValue, + chosenPdpSubgroup: chosenPdpSubgroupValue + }) } handlePdpGroupChange(e) { var selectedPdpGroup = this.state.pdpGroup.filter(entry => (Object.keys(entry)[0] === e.value)); const pdpSubgroupValues = selectedPdpGroup[0][e.value].map((pdpSubgroup) => { return { label: pdpSubgroup, value: pdpSubgroup } }); if (this.state.chosenPdpGroup !== e.value) { - this.setState({ + this.setState({ chosenPdpGroup: e.value, chosenPdpSubgroup: '', pdpSubgroupList: pdpSubgroupValues @@ -183,7 +182,7 @@ export default class PolicyModal extends React.Component { return ( <ModalStyled size="xl" show={this.state.show} onHide={this.handleClose}> <Modal.Header closeButton> - <Modal.Title>Configuration policies</Modal.Title> + <Modal.Title>Edit the policy</Modal.Title> </Modal.Header> <Modal.Body> <div id="editor" /> |