From 2e9ae128ca601171cb511d410ac9f3996a9b0513 Mon Sep 17 00:00:00 2001 From: sebdet Date: Fri, 15 Nov 2019 16:28:55 +0100 Subject: Fix naming convention Fix naming convention in UI-react so that it's clearer Issue-ID: CLAMP-552 Change-Id: I758e0695f5b299514758c35aa699454b0c010974 Signed-off-by: sebdet --- ui-react/src/LoopUI.js | 4 +- .../ConfigurationPolicyModal.test.js | 2 +- ui-react/src/components/dialogs/DeployLoop.js | 127 --------------------- ui-react/src/components/dialogs/DeployLoop.test.js | 110 ------------------ .../src/components/dialogs/Loop/DeployLoopModal.js | 127 +++++++++++++++++++++ .../dialogs/Loop/DeployLoopModal.test.js | 110 ++++++++++++++++++ .../__snapshots__/DeployLoopModal.test.js.snap | 66 +++++++++++ .../dialogs/__snapshots__/DeployLoop.test.js.snap | 66 ----------- 8 files changed, 306 insertions(+), 306 deletions(-) delete mode 100644 ui-react/src/components/dialogs/DeployLoop.js delete mode 100644 ui-react/src/components/dialogs/DeployLoop.test.js create mode 100644 ui-react/src/components/dialogs/Loop/DeployLoopModal.js create mode 100644 ui-react/src/components/dialogs/Loop/DeployLoopModal.test.js create mode 100644 ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap delete mode 100644 ui-react/src/components/dialogs/__snapshots__/DeployLoop.test.js.snap diff --git a/ui-react/src/LoopUI.js b/ui-react/src/LoopUI.js index 05f466bc6..bcdc4ffee 100644 --- a/ui-react/src/LoopUI.js +++ b/ui-react/src/LoopUI.js @@ -45,7 +45,7 @@ import LoopService from './api/LoopService'; import ViewToscaModal from './components/dialogs/ViewToscaModal/ViewToscaModal'; import PerformAction from './components/dialogs/PerformActions'; import RefreshStatus from './components/dialogs/RefreshStatus'; -import DeployLoop from './components/dialogs/DeployLoop'; +import DeployLoopModal from './components/dialogs/Loop/DeployLoopModal'; import Alert from 'react-bootstrap/Alert'; import { Link } from 'react-router-dom'; @@ -261,7 +261,7 @@ export default class LoopUI extends React.Component { ()} /> ()} /> ()} /> - ()} /> + ()} /> ()} /> diff --git a/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.test.js b/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.test.js index e0aa8c6b0..4fa08e680 100644 --- a/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.test.js +++ b/ui-react/src/components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal.test.js @@ -26,7 +26,7 @@ import ConfigurationPolicyModal from './ConfigurationPolicyModal'; import LoopCache from '../../../api/LoopCache'; -describe('Verify DeployLoop', () => { +describe('Verify ConfigurationPolicyModal', () => { beforeEach(() => { fetch.resetMocks(); fetch.mockImplementation(() => { diff --git a/ui-react/src/components/dialogs/DeployLoop.js b/ui-react/src/components/dialogs/DeployLoop.js deleted file mode 100644 index d71af9240..000000000 --- a/ui-react/src/components/dialogs/DeployLoop.js +++ /dev/null @@ -1,127 +0,0 @@ -/*- - * ============LICENSE_START======================================================= - * ONAP CLAMP - * ================================================================================ - * Copyright (C) 2019 AT&T Intellectual Property. All rights - * reserved. - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END============================================ - * =================================================================== - * - */ -import React from 'react'; -import LoopActionService from '../../api/LoopActionService'; -import LoopService from '../../api/LoopService'; -import Button from 'react-bootstrap/Button'; -import Modal from 'react-bootstrap/Modal'; -import Form from 'react-bootstrap/Form'; -import styled from 'styled-components'; - -const ModalStyled = styled(Modal)` - background-color: transparent; -` -const FormStyled = styled(Form.Group)` - padding: .25rem 1.5rem; -` -export default class DeployLoop extends React.Component { - state = { - loopCache: this.props.loopCache, - temporaryPropertiesJson: JSON.parse(JSON.stringify(this.props.loopCache.getGlobalProperties())), - show: true - }; - constructor(props, context) { - super(props, context); - - this.handleSave = this.handleSave.bind(this); - this.handleClose = this.handleClose.bind(this); - this.handleChange = this.handleChange.bind(this); - this.refreshStatus = this.refreshStatus.bind(this); - this.renderDeployParam = this.renderDeployParam.bind(this); - } - componentWillReceiveProps(newProps) { - this.setState({ - loopName: newProps.loopCache.getLoopName(), - show: true - }); - } - handleClose(){ - this.props.history.push('/'); - } - handleSave() { - const loopName = this.props.loopCache.getLoopName(); - // save the global propserties - LoopService.updateGlobalProperties(loopName, this.state.temporaryPropertiesJson).then(resp => { - this.setState({ show: false }); - - LoopActionService.performAction(loopName, "deploy").then(pars => { - this.props.showAlert("Action deploy successfully performed"); - // refresh status and update loop logs - this.refreshStatus(loopName); - }) - .catch(error => { - this.props.showAlert("Action deploy failed"); - // refresh status and update loop logs - this.refreshStatus(loopName); - }); - }); - } - - refreshStatus(loopName) { - LoopActionService.refreshStatus(loopName).then(data => { - this.props.updateLoopFunction(data); - this.props.history.push('/'); - }) - .catch(error => { - this.props.showAlert("Refresh status failed"); - this.props.history.push('/'); - }); - } - handleChange(event) { - let deploymentParam = this.state.temporaryPropertiesJson["dcaeDeployParameters"]; - deploymentParam[event.target.name] = event.target.value; - - this.setState({temporaryPropertiesJson:{dcaeDeployParameters: deploymentParam}}); - } - renderDeployParam() { - if (typeof (this.state.temporaryPropertiesJson) === "undefined") { - return ""; - } - - const deployJson = this.state.temporaryPropertiesJson["dcaeDeployParameters"]; - var indents = []; - Object.keys(deployJson).map((item,key) => - indents.push( - {item} - - )); - - return indents; - } - - - render() { - return ( - - - Deployment parameters - - {this.renderDeployParam()} - - - - - - ); - } -} diff --git a/ui-react/src/components/dialogs/DeployLoop.test.js b/ui-react/src/components/dialogs/DeployLoop.test.js deleted file mode 100644 index 44bc78379..000000000 --- a/ui-react/src/components/dialogs/DeployLoop.test.js +++ /dev/null @@ -1,110 +0,0 @@ -/*- - * ============LICENSE_START======================================================= - * ONAP CLAMP - * ================================================================================ - * Copyright (C) 2019 AT&T Intellectual Property. All rights - * reserved. - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END============================================ - * =================================================================== - * - */ -import React from 'react'; -import { shallow } from 'enzyme'; -import DeployLoop from './DeployLoop'; -import LoopCache from '../../api/LoopCache'; -import LoopActionService from '../../api/LoopActionService'; -import LoopService from '../../api/LoopService'; - -describe('Verify DeployLoop', () => { - const loopCache = new LoopCache({ - "name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca", - "globalPropertiesJson": { - "dcaeDeployParameters": { - "location_id": "", - "policy_id": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca" - } - } - }); - - it('Test the render method', () => { - const component = shallow( - - ) - - expect(component).toMatchSnapshot(); - }); - - it('Test handleClose', () => { - const historyMock = { push: jest.fn() }; - const handleClose = jest.spyOn(DeployLoop.prototype,'handleClose'); - const component = shallow() - - component.find('[variant="secondary"]').prop('onClick')(); - - expect(handleClose).toHaveBeenCalledTimes(1); - expect(historyMock.push.mock.calls[0]).toEqual([ '/']); - }); - - it('Test handleSave successful', async () => { - const flushPromises = () => new Promise(setImmediate); - const historyMock = { push: jest.fn() }; - const updateLoopFunction = jest.fn(); - const showAlert = jest.fn(); - const handleSave = jest.spyOn(DeployLoop.prototype,'handleSave'); - LoopService.updateGlobalProperties = jest.fn().mockImplementation(() => { - return Promise.resolve({ - ok: true, - status: 200, - text: () => "OK" - }); - }); - LoopActionService.performAction = jest.fn().mockImplementation(() => { - return Promise.resolve({ - ok: true, - status: 200, - json: () => {} - }); - }); - LoopActionService.refreshStatus = jest.fn().mockImplementation(() => { - return Promise.resolve({ - ok: true, - status: 200, - json: () => {} - }); - }); - - const component = shallow() - - component.find('[variant="primary"]').prop('onClick')(); - await flushPromises(); - component.update(); - - expect(handleSave).toHaveBeenCalledTimes(1); - expect(component.state('show')).toEqual(false); - expect(historyMock.push.mock.calls[0]).toEqual([ '/']); - handleSave.mockClear(); - }); - - it('Onchange event', () => { - const event = { target: { name: "location_id", value: "testLocation"} }; - const component = shallow(); - const forms = component.find('StateManager'); - - component.find('[name="location_id"]').simulate('change', event); - component.update(); - expect(component.state('temporaryPropertiesJson').dcaeDeployParameters.location_id).toEqual("testLocation"); - }); -}); \ No newline at end of file diff --git a/ui-react/src/components/dialogs/Loop/DeployLoopModal.js b/ui-react/src/components/dialogs/Loop/DeployLoopModal.js new file mode 100644 index 000000000..34304d611 --- /dev/null +++ b/ui-react/src/components/dialogs/Loop/DeployLoopModal.js @@ -0,0 +1,127 @@ +/*- + * ============LICENSE_START======================================================= + * ONAP CLAMP + * ================================================================================ + * Copyright (C) 2019 AT&T Intellectual Property. All rights + * reserved. + * ================================================================================ + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ============LICENSE_END============================================ + * =================================================================== + * + */ +import React from 'react'; +import LoopActionService from '../../../api/LoopActionService'; +import LoopService from '../../../api/LoopService'; +import Button from 'react-bootstrap/Button'; +import Modal from 'react-bootstrap/Modal'; +import Form from 'react-bootstrap/Form'; +import styled from 'styled-components'; + +const ModalStyled = styled(Modal)` + background-color: transparent; +` +const FormStyled = styled(Form.Group)` + padding: .25rem 1.5rem; +` +export default class DeployLoopModal extends React.Component { + state = { + loopCache: this.props.loopCache, + temporaryPropertiesJson: JSON.parse(JSON.stringify(this.props.loopCache.getGlobalProperties())), + show: true + }; + constructor(props, context) { + super(props, context); + + this.handleSave = this.handleSave.bind(this); + this.handleClose = this.handleClose.bind(this); + this.handleChange = this.handleChange.bind(this); + this.refreshStatus = this.refreshStatus.bind(this); + this.renderDeployParam = this.renderDeployParam.bind(this); + } + componentWillReceiveProps(newProps) { + this.setState({ + loopName: newProps.loopCache.getLoopName(), + show: true + }); + } + handleClose(){ + this.props.history.push('/'); + } + handleSave() { + const loopName = this.props.loopCache.getLoopName(); + // save the global propserties + LoopService.updateGlobalProperties(loopName, this.state.temporaryPropertiesJson).then(resp => { + this.setState({ show: false }); + + LoopActionService.performAction(loopName, "deploy").then(pars => { + this.props.showAlert("Action deploy successfully performed"); + // refresh status and update loop logs + this.refreshStatus(loopName); + }) + .catch(error => { + this.props.showAlert("Action deploy failed"); + // refresh status and update loop logs + this.refreshStatus(loopName); + }); + }); + } + + refreshStatus(loopName) { + LoopActionService.refreshStatus(loopName).then(data => { + this.props.updateLoopFunction(data); + this.props.history.push('/'); + }) + .catch(error => { + this.props.showAlert("Refresh status failed"); + this.props.history.push('/'); + }); + } + handleChange(event) { + let deploymentParam = this.state.temporaryPropertiesJson["dcaeDeployParameters"]; + deploymentParam[event.target.name] = event.target.value; + + this.setState({temporaryPropertiesJson:{dcaeDeployParameters: deploymentParam}}); + } + renderDeployParam() { + if (typeof (this.state.temporaryPropertiesJson) === "undefined") { + return ""; + } + + const deployJson = this.state.temporaryPropertiesJson["dcaeDeployParameters"]; + var indents = []; + Object.keys(deployJson).map((item,key) => + indents.push( + {item} + + )); + + return indents; + } + + + render() { + return ( + + + Deployment parameters + + {this.renderDeployParam()} + + + + + + ); + } +} diff --git a/ui-react/src/components/dialogs/Loop/DeployLoopModal.test.js b/ui-react/src/components/dialogs/Loop/DeployLoopModal.test.js new file mode 100644 index 000000000..2ebb8c067 --- /dev/null +++ b/ui-react/src/components/dialogs/Loop/DeployLoopModal.test.js @@ -0,0 +1,110 @@ +/*- + * ============LICENSE_START======================================================= + * ONAP CLAMP + * ================================================================================ + * Copyright (C) 2019 AT&T Intellectual Property. All rights + * reserved. + * ================================================================================ + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ============LICENSE_END============================================ + * =================================================================== + * + */ +import React from 'react'; +import { shallow } from 'enzyme'; +import DeployLoopModal from './DeployLoopModal'; +import LoopCache from '../../../api/LoopCache'; +import LoopActionService from '../../../api/LoopActionService'; +import LoopService from '../../../api/LoopService'; + +describe('Verify DeployLoopModal', () => { + const loopCache = new LoopCache({ + "name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca", + "globalPropertiesJson": { + "dcaeDeployParameters": { + "location_id": "", + "policy_id": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca" + } + } + }); + + it('Test the render method', () => { + const component = shallow( + + ) + + expect(component).toMatchSnapshot(); + }); + + it('Test handleClose', () => { + const historyMock = { push: jest.fn() }; + const handleClose = jest.spyOn(DeployLoopModal.prototype,'handleClose'); + const component = shallow() + + component.find('[variant="secondary"]').prop('onClick')(); + + expect(handleClose).toHaveBeenCalledTimes(1); + expect(historyMock.push.mock.calls[0]).toEqual([ '/']); + }); + + it('Test handleSave successful', async () => { + const flushPromises = () => new Promise(setImmediate); + const historyMock = { push: jest.fn() }; + const updateLoopFunction = jest.fn(); + const showAlert = jest.fn(); + const handleSave = jest.spyOn(DeployLoopModal.prototype,'handleSave'); + LoopService.updateGlobalProperties = jest.fn().mockImplementation(() => { + return Promise.resolve({ + ok: true, + status: 200, + text: () => "OK" + }); + }); + LoopActionService.performAction = jest.fn().mockImplementation(() => { + return Promise.resolve({ + ok: true, + status: 200, + json: () => {} + }); + }); + LoopActionService.refreshStatus = jest.fn().mockImplementation(() => { + return Promise.resolve({ + ok: true, + status: 200, + json: () => {} + }); + }); + + const component = shallow() + + component.find('[variant="primary"]').prop('onClick')(); + await flushPromises(); + component.update(); + + expect(handleSave).toHaveBeenCalledTimes(1); + expect(component.state('show')).toEqual(false); + expect(historyMock.push.mock.calls[0]).toEqual([ '/']); + handleSave.mockClear(); + }); + + it('Onchange event', () => { + const event = { target: { name: "location_id", value: "testLocation"} }; + const component = shallow(); + const forms = component.find('StateManager'); + + component.find('[name="location_id"]').simulate('change', event); + component.update(); + expect(component.state('temporaryPropertiesJson').dcaeDeployParameters.location_id).toEqual("testLocation"); + }); +}); \ No newline at end of file diff --git a/ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap b/ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap new file mode 100644 index 000000000..bf06965be --- /dev/null +++ b/ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap @@ -0,0 +1,66 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Verify DeployLoopModal Test the render method 1`] = ` + + + + Deployment parameters + + + + + location_id + + + + + + policy_id + + + + + + + + +`; diff --git a/ui-react/src/components/dialogs/__snapshots__/DeployLoop.test.js.snap b/ui-react/src/components/dialogs/__snapshots__/DeployLoop.test.js.snap deleted file mode 100644 index 1fd4b1047..000000000 --- a/ui-react/src/components/dialogs/__snapshots__/DeployLoop.test.js.snap +++ /dev/null @@ -1,66 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Verify DeployLoop Test the render method 1`] = ` - - - - Deployment parameters - - - - - location_id - - - - - - policy_id - - - - - - - - -`; -- cgit 1.2.3-korg