aboutsummaryrefslogtreecommitdiffstats
path: root/ui-react/src/components/dialogs/Loop
diff options
context:
space:
mode:
Diffstat (limited to 'ui-react/src/components/dialogs/Loop')
-rw-r--r--ui-react/src/components/dialogs/Loop/CreateLoopModal.js190
-rw-r--r--ui-react/src/components/dialogs/Loop/CreateLoopModal.test.js143
-rw-r--r--ui-react/src/components/dialogs/Loop/DeployLoopModal.js173
-rw-r--r--ui-react/src/components/dialogs/Loop/DeployLoopModal.test.js112
-rw-r--r--ui-react/src/components/dialogs/Loop/LoopPropertiesModal.js118
-rw-r--r--ui-react/src/components/dialogs/Loop/LoopPropertiesModal.test.js108
-rw-r--r--ui-react/src/components/dialogs/Loop/ModifyLoopModal.js247
-rw-r--r--ui-react/src/components/dialogs/Loop/ModifyLoopModal.test.js109
-rw-r--r--ui-react/src/components/dialogs/Loop/OpenLoopModal.js137
-rw-r--r--ui-react/src/components/dialogs/Loop/OpenLoopModal.test.js92
-rw-r--r--ui-react/src/components/dialogs/Loop/__snapshots__/CreateLoopModal.test.js.snap167
-rw-r--r--ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap88
-rw-r--r--ui-react/src/components/dialogs/Loop/__snapshots__/LoopPropertiesModal.test.js.snap61
-rw-r--r--ui-react/src/components/dialogs/Loop/__snapshots__/OpenLoopModal.test.js.snap137
14 files changed, 0 insertions, 1882 deletions
diff --git a/ui-react/src/components/dialogs/Loop/CreateLoopModal.js b/ui-react/src/components/dialogs/Loop/CreateLoopModal.js
deleted file mode 100644
index 5663360a0..000000000
--- a/ui-react/src/components/dialogs/Loop/CreateLoopModal.js
+++ /dev/null
@@ -1,190 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP CLAMP
- * ================================================================================
- * Copyright (C) 2020 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 Select from 'react-select';
-import Button from 'react-bootstrap/Button';
-import Modal from 'react-bootstrap/Modal';
-import Form from 'react-bootstrap/Form';
-import Row from 'react-bootstrap/Row';
-import Col from 'react-bootstrap/Col';
-import styled from 'styled-components';
-import LoopService from '../../../api/LoopService';
-import TemplateService from '../../../api/TemplateService';
-import LoopCache from '../../../api/LoopCache';
-import SvgGenerator from '../../loop_viewer/svg/SvgGenerator';
-
-const ModalStyled = styled(Modal)`
- background-color: transparent;
-`
-
-const ErrMsgStyled = styled.div`
- color: red;
-`
-
-export default class CreateLoopModal extends React.Component {
- constructor(props, context) {
- super(props, context);
-
- this.getAllLoopTemplates = this.getAllLoopTemplates.bind(this);
- this.handleCreate = this.handleCreate.bind(this);
- this.handleModelName = this.handleModelName.bind(this);
- this.handleClose = this.handleClose.bind(this);
- this.handleDropDownListChange = this.handleDropDownListChange.bind(this);
- this.renderSvg = this.renderSvg.bind(this);
- this.state = {
- show: true,
- chosenTemplateName: '',
- modelInputErrMsg: '',
- modelName: '',
- templateNames: [],
- fakeLoopCacheWithTemplate: new LoopCache({})
- };
- }
-
- async componentDidMount() {
- await this.getAllLoopTemplates();
- await this.getModelNames();
- }
-
- handleClose() {
- this.setState({ show: false });
- this.props.history.push('/');
- }
-
- handleDropDownListChange(e) {
- if (typeof e.value !== "undefined") {
- this.setState({
- fakeLoopCacheWithTemplate:
- new LoopCache({
- "loopTemplate":e.templateObject,
- "name": "fakeLoop"
- }),
- chosenTemplateName: e.value
- })
- } else {
- this.setState({ fakeLoopCacheWithTemplate: new LoopCache({}) })
- }
- }
-
- getAllLoopTemplates() {
- TemplateService.getAllLoopTemplates().then(templatesData => {
- const templateOptions = templatesData.map((templateData) => { return { label: templateData.name, value: templateData.name, templateObject: templateData } });
- this.setState({
- templateNames: templateOptions })
- });
- }
-
- getModelNames() {
- TemplateService.getLoopNames().then(loopNames => {
- if (!loopNames) {
- loopNames = [];
- }
- // Remove LOOP_ prefix
- let trimmedLoopNames = loopNames.map(str => str.replace('LOOP_', ''));
- this.setState({ modelNames: trimmedLoopNames });
- });
- }
-
- handleCreate() {
- if (!this.state.modelName) {
- alert("A model name is required");
- return;
- }
- console.debug("Create Model " + this.state.modelName + ", Template " + this.state.chosenTemplateName + " is chosen");
- this.setState({ show: false });
- LoopService.createLoop("LOOP_" + this.state.modelName, this.state.chosenTemplateName).then(text => {
- console.debug("CreateLoop response received: ", text);
- try {
- this.props.history.push('/');
- this.props.loadLoopFunction("LOOP_" + this.state.modelName);
- } catch(err) {
- alert(text);
- this.props.history.push('/');
- }
- })
- .catch(error => {
- console.debug("Create Loop failed");
- });
- }
-
- handleModelName(event) {
- if (this.state.modelNames.includes(event.target.value)) {
- this.setState({
- modelInputErrMsg: 'A model named "' + event.target.value + '" already exists. Please pick another name.',
- modelName: event.target.value
- });
- return;
- } else {
- this.setState({
- modelInputErrMsg: '',
- modelName: event.target.value
- });
- }
- }
-
- renderSvg() {
- return (
- <SvgGenerator loopCache={this.state.fakeLoopCacheWithTemplate} clickable={false} generatedFrom={SvgGenerator.GENERATED_FROM_TEMPLATE}/>
- );
- }
-
- render() {
- return (
- <ModalStyled size="xl" show={this.state.show} onHide={this.handleClose} backdrop="static" keyboard={false} >
- <Modal.Header closeButton>
- <Modal.Title>Create Model</Modal.Title>
- </Modal.Header>
- <Modal.Body>
- <Form.Group as={Row} controlId="formPlaintextEmail">
- <Form.Label column sm="2">Template Name:</Form.Label>
- <Col sm="10">
- <Select onChange={this.handleDropDownListChange} options={this.state.templateNames} />
- </Col>
- </Form.Group>
- <Form.Group as={Row} style={{alignItems: 'center'}} controlId="formSvgPreview">
- <Form.Label column sm="2">Model Preview:</Form.Label>
- <Col sm="10">
- {this.renderSvg()}
- </Col>
- </Form.Group>
- <Form.Group as={Row} controlId="formPlaintextEmail">
- <Form.Label column sm="2">Model Name:</Form.Label>
- <input sm="5" type="text" style={{width: '50%', marginLeft: '1em' }}
- value={this.state.modelName}
- onChange={this.handleModelName}
- />
- <span sm="5"/>
- </Form.Group>
- <Form.Group as={Row} controlId="formPlaintextEmail">
- <Form.Label column sm="2"> </Form.Label>
- <ErrMsgStyled>{this.state.modelInputErrMsg}</ErrMsgStyled>
- </Form.Group>
- </Modal.Body>
- <Modal.Footer>
- <Button variant="secondary" type="null" onClick={this.handleClose}>Cancel</Button>
- <Button variant="primary" type="submit" onClick={this.handleCreate}>Create</Button>
- </Modal.Footer>
- </ModalStyled>
- );
- }
-}
diff --git a/ui-react/src/components/dialogs/Loop/CreateLoopModal.test.js b/ui-react/src/components/dialogs/Loop/CreateLoopModal.test.js
deleted file mode 100644
index 8ef53b412..000000000
--- a/ui-react/src/components/dialogs/Loop/CreateLoopModal.test.js
+++ /dev/null
@@ -1,143 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP CLAMP
- * ================================================================================
- * Copyright (C) 2020 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 CreateLoopModal from './CreateLoopModal';
-import LoopService from '../../../api/LoopService';
-import TemplateService from '../../../api/TemplateService';
-
-let errorMessage = '';
-window.alert = jest.fn().mockImplementation((mesg) => { errorMessage = mesg ; return });
-
-
-describe('Verify CreateLoopModal', () => {
-
- it('Test the render method', async () => {
- const flushPromises = () => new Promise(setImmediate);
- TemplateService.getAllLoopTemplates = jest.fn().mockImplementation(() => {
- return Promise.resolve([{"name":"template1"},{"name":"template2"}]);
- });
- TemplateService.getLoopNames = jest.fn().mockImplementation(() => {
- return Promise.resolve([]);
- });
-
- const component = shallow(<CreateLoopModal/>);
- expect(component).toMatchSnapshot();
- await flushPromises();
- component.update();
- expect(component.state('templateNames')).toStrictEqual([{"label": "template1", "value": "template1", "templateObject": {"name": "template1"}}, {"label": "template2", "value": "template2","templateObject": {"name": "template2"}}]);
- });
-
- it('handleDropdownListChange event', async () => {
- const flushPromises = () => new Promise(setImmediate);
-
- const component = shallow(<CreateLoopModal/>);
- component.find('StateManager').simulate('change', {value: 'template1', templateObject: {"name":"template1"} });
- await flushPromises();
- component.update();
- expect(component.state('chosenTemplateName')).toEqual("template1");
- expect(component.state('fakeLoopCacheWithTemplate').getLoopTemplate()['name']).toEqual("template1");
- expect(component.state('fakeLoopCacheWithTemplate').getLoopName()).toEqual("fakeLoop");
-
- component.find('StateManager').simulate('change',{value: 'template2', templateObject: {"name":"template2"} });
- await flushPromises();
- component.update();
- expect(component.state('chosenTemplateName')).toEqual("template2");
- expect(component.state('fakeLoopCacheWithTemplate').getLoopTemplate()['name']).toEqual("template2");
- expect(component.state('fakeLoopCacheWithTemplate').getLoopName()).toEqual("fakeLoop");
- });
-
- it('handleModelName event', async () => {
- const flushPromises = () => new Promise(setImmediate);
- TemplateService.getAllLoopTemplates = jest.fn().mockImplementation(() => {
- return Promise.resolve([{"name":"template1"},{"name":"template2"}]);
- });
- TemplateService.getLoopNames = jest.fn().mockImplementation(() => {
- return Promise.resolve([]);
- });
- const event = {target: {value : "model1"} };
- const component = shallow(<CreateLoopModal/>);
- await flushPromises();
- component.find('input').simulate('change', event);
- component.update();
- expect(component.state('modelName')).toEqual("model1");
- });
-
- it('Test handleClose', () => {
- const historyMock = { push: jest.fn() };
- const handleClose = jest.spyOn(CreateLoopModal.prototype,'handleClose');
- const component = shallow(<CreateLoopModal history={historyMock} />)
-
- component.find('[variant="secondary"]').prop('onClick')();
-
- expect(handleClose).toHaveBeenCalledTimes(1);
- expect(component.state('show')).toEqual(false);
- expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
-
- handleClose.mockClear();
- });
-
- it('Test handleCreate Fail', () => {
- const handleCreate = jest.spyOn(CreateLoopModal.prototype,'handleCreate');
- const component = shallow(<CreateLoopModal/>)
-
- component.find('[variant="primary"]').prop('onClick')();
-
- expect(handleCreate).toHaveBeenCalledTimes(1);
- expect(component.state('show')).toEqual(true);
-
- handleCreate.mockClear();
- });
-
- it('Test handleCreate Suc', async () => {
- const flushPromises = () => new Promise(setImmediate);
- const historyMock = { push: jest.fn() };
- const loadLoopFunction = jest.fn();
-
- LoopService.createLoop = jest.fn().mockImplementation(() => {
- return Promise.resolve({
- ok: true,
- status: 200,
- json: () => {}
- });
- });
-
- const handleCreate = jest.spyOn(CreateLoopModal.prototype,'handleCreate');
- const component = shallow(<CreateLoopModal history={historyMock} loadLoopFunction={loadLoopFunction}/>)
- component.setState({
- modelName: "modelNameTest",
- chosenTemplateName: "template1"
- });
-
- component.find('[variant="primary"]').prop('onClick')();
- await flushPromises();
- component.update();
-
- expect(handleCreate).toHaveBeenCalledTimes(1);
- expect(component.state('show')).toEqual(false);
- expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
-
- handleCreate.mockClear();
- });
-
-});
diff --git a/ui-react/src/components/dialogs/Loop/DeployLoopModal.js b/ui-react/src/components/dialogs/Loop/DeployLoopModal.js
deleted file mode 100644
index 803cfa9cb..000000000
--- a/ui-react/src/components/dialogs/Loop/DeployLoopModal.js
+++ /dev/null
@@ -1,173 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP POLICY-CLAMP
- * ================================================================================
- * Copyright (C) 2019, 2021 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 Tabs from 'react-bootstrap/Tabs';
-import Tab from 'react-bootstrap/Tab';
-import styled from 'styled-components';
-import Spinner from 'react-bootstrap/Spinner'
-
-const StyledSpinnerDiv = styled.div`
- justify-content: center !important;
- display: flex !important;
-`;
-
-const ModalStyled = styled(Modal)`
- background-color: transparent;
-`
-const FormStyled = styled(Form.Group)`
- padding: .25rem 1.5rem;
-`
-export default class DeployLoopModal extends React.Component {
-
-
-
- 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);
- this.renderSpinner = this.renderSpinner.bind(this);
-
- const propertiesJson = JSON.parse(JSON.stringify(this.props.loopCache.getGlobalProperties()));
- this.state = {
- loopCache: this.props.loopCache,
- temporaryPropertiesJson: propertiesJson,
- show: true,
- key: this.getInitialKeyValue(propertiesJson)
- };
- }
- getInitialKeyValue(temporaryPropertiesJson) {
- const deployJsonList = temporaryPropertiesJson["dcaeDeployParameters"];
- return Object.keys(deployJsonList).find((obj) => Object.keys(deployJsonList).indexOf(obj) === 0);
- }
- componentWillReceiveProps(newProps) {
- this.setState({
- loopName: newProps.loopCache.getLoopName(),
- show: true
- });
- }
-
- handleClose(){
- this.setState({ show: false });
- this.props.history.push('/');
- }
-
- renderSpinner() {
- if (this.state.deploying) {
- return (
- <StyledSpinnerDiv>
- <Spinner animation="border" role="status">
- <span className="sr-only">Loading...</span>
- </Spinner>
- </StyledSpinnerDiv>
- );
- } else {
- return (<div></div>);
- }
- }
-
- handleSave() {
- const loopName = this.props.loopCache.getLoopName();
- // save the global propserties
- this.setState({ deploying: true });
- LoopService.updateGlobalProperties(loopName, this.state.temporaryPropertiesJson).then(resp => {
- LoopActionService.performAction(loopName, "deploy").then(pars => {
- this.props.showSucAlert("Action deploy successfully performed");
- // refresh status and update loop logs
- this.refreshStatus(loopName);
- })
- .catch(error => {
- this.props.showFailAlert("Action deploy failed");
- // refresh status and update loop logs
- this.refreshStatus(loopName);
- });
- });
- }
-
- refreshStatus(loopName) {
- LoopActionService.refreshStatus(loopName).then(data => {
- this.props.updateLoopFunction(data);
- this.setState({ show: false, deploying: false });
- this.props.history.push('/');
- })
- .catch(error => {
- this.props.showFailAlert("Refresh status failed");
- this.setState({ show: false, deploying: false });
- this.props.history.push('/');
- });
- }
- handleChange(event) {
- let deploymentParam = this.state.temporaryPropertiesJson["dcaeDeployParameters"];
- deploymentParam[this.state.key][event.target.name] = event.target.value;
-
- this.setState({temporaryPropertiesJson:{dcaeDeployParameters: deploymentParam}});
- }
- renderDeployParamTabs() {
- if (typeof (this.state.temporaryPropertiesJson) === "undefined") {
- return "";
- }
-
- const deployJsonList = this.state.temporaryPropertiesJson["dcaeDeployParameters"];
- var indents = [];
- Object.keys(deployJsonList).forEach(item =>
- indents.push(<Tab key={item} eventKey={item} title={item}>
- {this.renderDeployParam(deployJsonList[item])}
- </Tab>)
- );
- return indents;
- }
- renderDeployParam(deployJson) {
- var indents = [];
- Object.keys(deployJson).forEach(item =>
- indents.push(<FormStyled key={item}>
- <Form.Label>{item}</Form.Label>
- <Form.Control type="text" name={item} onChange={this.handleChange} defaultValue={deployJson[item]}></Form.Control>
- </FormStyled>));
- return indents;
- }
- render() {
- return (
- <ModalStyled size="lg" show={this.state.show} onHide={this.handleClose} backdrop="static" keyboard={false} >
- <Modal.Header closeButton>
- <Modal.Title>Deployment parameters</Modal.Title>
- </Modal.Header>
- <Tabs id="controlled-tab-example" activeKey={this.state.key} onSelect={key => this.setState({ key })}>
- {this.renderDeployParamTabs()}
- </Tabs>
- {this.renderSpinner()}
- <Modal.Footer>
- <Button variant="secondary" type="null" onClick={this.handleClose}>Cancel</Button>
- <Button variant="primary" type="submit" onClick={this.handleSave}>Deploy</Button>
- </Modal.Footer>
- </ModalStyled>
- );
- }
-}
diff --git a/ui-react/src/components/dialogs/Loop/DeployLoopModal.test.js b/ui-react/src/components/dialogs/Loop/DeployLoopModal.test.js
deleted file mode 100644
index 84dbfd1f6..000000000
--- a/ui-react/src/components/dialogs/Loop/DeployLoopModal.test.js
+++ /dev/null
@@ -1,112 +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 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": {
- "testMs": {
- "location_id": "",
- "policy_id": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca"
- }
- }
- }
- });
-
- it('Test the render method', () => {
- const component = shallow(
- <DeployLoopModal loopCache={loopCache}/>
- )
-
- expect(component).toMatchSnapshot();
- });
-
- it('Test handleClose', () => {
- const historyMock = { push: jest.fn() };
- const handleClose = jest.spyOn(DeployLoopModal.prototype,'handleClose');
- const component = shallow(<DeployLoopModal history={historyMock} loopCache={loopCache}/>)
-
- 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 showSucAlert = jest.fn();
- const showFailAlert = 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(<DeployLoopModal history={historyMock}
- loopCache={loopCache} updateLoopFunction={updateLoopFunction} showSucAlert={showSucAlert} showFailAlert={showFailAlert} />)
-
- 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(<DeployLoopModal loopCache={loopCache}/>);
-
- component.find('[name="location_id"]').simulate('change', event);
- component.update();
- expect(component.state('temporaryPropertiesJson').dcaeDeployParameters.testMs.location_id).toEqual("testLocation");
- });
-}); \ No newline at end of file
diff --git a/ui-react/src/components/dialogs/Loop/LoopPropertiesModal.js b/ui-react/src/components/dialogs/Loop/LoopPropertiesModal.js
deleted file mode 100644
index acd0acade..000000000
--- a/ui-react/src/components/dialogs/Loop/LoopPropertiesModal.js
+++ /dev/null
@@ -1,118 +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 Button from 'react-bootstrap/Button';
-import Modal from 'react-bootstrap/Modal';
-import Form from 'react-bootstrap/Form';
-import styled from 'styled-components';
-import LoopService from '../../../api/LoopService';
-
-const ModalStyled = styled(Modal)`
- background-color: transparent;
-`
-export default class LoopPropertiesModal extends React.Component {
-
- state = {
- show: true,
- loopCache: this.props.loopCache,
- temporaryPropertiesJson: JSON.parse(JSON.stringify(this.props.loopCache.getGlobalProperties()))
- };
-
- constructor(props, context) {
- super(props, context);
-
- this.handleClose = this.handleClose.bind(this);
- this.handleSave = this.handleSave.bind(this);
- this.handleChange = this.handleChange.bind(this);
-
- this.renderDcaeParameters = this.renderDcaeParameters.bind(this);
- this.renderAllParameters = this.renderAllParameters.bind(this);
- this.getDcaeParameters = this.getDcaeParameters.bind(this);
- this.readOnly = props.readOnly !== undefined ? props.readOnly : false;
- }
-
- componentWillReceiveProps(newProps) {
- this.setState({
- loopCache: newProps.loopCache,
- temporaryPropertiesJson: JSON.parse(JSON.stringify(newProps.loopCache.getGlobalProperties()))
- });
- }
-
- handleClose() {
- this.props.history.push('/');
- }
-
- handleSave(event) {
- LoopService.updateGlobalProperties(this.state.loopCache.getLoopName(), this.state.temporaryPropertiesJson).then(resp => {
- this.setState({ show: false });
- this.props.history.push('/');
- this.props.loadLoopFunction(this.state.loopCache.getLoopName());
- });
- }
-
- handleChange(event) {
- this.setState({temporaryPropertiesJson:{[event.target.name]: JSON.parse(event.target.value)}});
- }
-
- renderAllParameters() {
- return (<Modal.Body>
- <Form>
- {this.renderDcaeParameters()}
- </Form>
- </Modal.Body>
- );
- }
-
- getDcaeParameters() {
- if (typeof (this.state.temporaryPropertiesJson) !== "undefined") {
- return JSON.stringify(this.state.temporaryPropertiesJson["dcaeDeployParameters"]);
- } else {
- return "";
- }
-
- }
-
- renderDcaeParameters() {
- return (
- <Form.Group >
- <Form.Label>Deploy Parameters</Form.Label>
- <Form.Control as="textarea" rows="3" name="dcaeDeployParameters" onChange={this.handleChange} defaultValue={this.getDcaeParameters()}></Form.Control>
- </Form.Group>
- );
- }
-
- render() {
- return (
- <ModalStyled size="lg" show={this.state.show} onHide={this.handleClose} backdrop="static" keyboard={false} >
- <Modal.Header closeButton>
- <Modal.Title>Model Properties</Modal.Title>
- </Modal.Header>
- {this.renderAllParameters()}
- <Modal.Footer>
- <Button variant="secondary" type="null" onClick={this.handleClose}>Cancel</Button>
- <Button variant="primary" type="submit" disabled={this.readOnly} onClick={this.handleSave}>Save Changes</Button>
- </Modal.Footer>
- </ModalStyled>
- );
- }
-}
diff --git a/ui-react/src/components/dialogs/Loop/LoopPropertiesModal.test.js b/ui-react/src/components/dialogs/Loop/LoopPropertiesModal.test.js
deleted file mode 100644
index 5bbefe228..000000000
--- a/ui-react/src/components/dialogs/Loop/LoopPropertiesModal.test.js
+++ /dev/null
@@ -1,108 +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 LoopPropertiesModal from './LoopPropertiesModal';
-import LoopCache from '../../../api/LoopCache';
-import LoopService from '../../../api/LoopService';
-
-describe('Verify LoopPropertiesModal', () => {
- 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(
- <LoopPropertiesModal loopCache={loopCache}/>
- )
- component.setState({ show: true,
- temporaryPropertiesJson: {
- "dcaeDeployParameters": {
- "location_id": "",
- "policy_id": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca"
- }
- }
- });
-
- expect(component.state('temporaryPropertiesJson')).toEqual({
- "dcaeDeployParameters": {
- "location_id": "",
- "policy_id": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca"}
- });
- expect(component.state('show')).toEqual(true);
-
- expect(component).toMatchSnapshot();
- });
-
- it('Test handleClose', () => {
- const historyMock = { push: jest.fn() };
- const handleClose = jest.spyOn(LoopPropertiesModal.prototype,'handleClose');
- const component = shallow(<LoopPropertiesModal history={historyMock} loopCache={loopCache}/>)
-
- 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 loadLoopFunction = jest.fn();
- const handleSave = jest.spyOn(LoopPropertiesModal.prototype,'handleSave');
- LoopService.updateGlobalProperties = jest.fn().mockImplementation(() => {
- return Promise.resolve({
- ok: true,
- status: 200,
- text: () => "OK"
- });
- });
-
- const component = shallow(<LoopPropertiesModal history={historyMock}
- loopCache={loopCache} loadLoopFunction={loadLoopFunction} />)
-
- 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([ '/']);
- });
-
- it('Onchange event', () => {
- const event = {target:{name:"dcaeDeployParameters", value:"{\"location_id\": \"testLocation\",\"policy_id\": \"TCA_h2NMX_v1_0_ResourceInstanceName1_tca\"}"}};
- const component = shallow(<LoopPropertiesModal loopCache={loopCache}/>);
-
- component.find('FormControl').simulate('change', event);
- component.update();
-
- expect(component.state('temporaryPropertiesJson').dcaeDeployParameters.location_id).toEqual("testLocation");
- });
-});
diff --git a/ui-react/src/components/dialogs/Loop/ModifyLoopModal.js b/ui-react/src/components/dialogs/Loop/ModifyLoopModal.js
deleted file mode 100644
index f6c0d2ede..000000000
--- a/ui-react/src/components/dialogs/Loop/ModifyLoopModal.js
+++ /dev/null
@@ -1,247 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP CLAMP
- * ================================================================================
- * Copyright (C) 2020 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, { forwardRef } from 'react'
-import MaterialTable from "material-table";
-import Button from 'react-bootstrap/Button';
-import Modal from 'react-bootstrap/Modal';
-import styled from 'styled-components';
-import PolicyToscaService from '../../../api/PolicyToscaService';
-import ArrowUpward from '@material-ui/icons/ArrowUpward';
-import ChevronLeft from '@material-ui/icons/ChevronLeft';
-import ChevronRight from '@material-ui/icons/ChevronRight';
-import Clear from '@material-ui/icons/Clear';
-import FirstPage from '@material-ui/icons/FirstPage';
-import LastPage from '@material-ui/icons/LastPage';
-import Search from '@material-ui/icons/Search';
-import LoopService from '../../../api/LoopService';
-import Tabs from 'react-bootstrap/Tabs';
-import Tab from 'react-bootstrap/Tab';
-import Alert from 'react-bootstrap/Alert';
-
-const ModalStyled = styled(Modal)`
- background-color: transparent;
-`
-const TextModal = styled.textarea`
- margin-top: 20px;
- white-space:pre;
- background-color: ${props => props.theme.toscaTextareaBackgroundColor};
- text-align: justify;
- font-size: ${props => props.theme.toscaTextareaFontSize};
- width: 100%;
- height: 300px;
-`
-const cellStyle = { border: '1px solid black' };
-const headerStyle = { backgroundColor: '#ddd', border: '2px solid black' };
-const rowHeaderStyle = {backgroundColor:'#ddd', fontSize: '15pt', text: 'bold', border: '1px solid black'};
-
-export default class ModifyLoopModal extends React.Component {
-
- state = {
- show: true,
- loopCache: this.props.loopCache,
- content: 'Please select Tosca model to view the details',
- selectedRowData: {},
- toscaPolicyModelsData: [],
- selectedPolicyModelsData: [],
- key: 'add',
- showFailAlert: false,
- toscaColumns: [
- { title: "#", field: "index", render: rowData => rowData.tableData.id + 1,
- cellStyle: cellStyle,
- headerStyle: headerStyle
- },
- { title: "Policy Model Type", field: "policyModelType",
- cellStyle: cellStyle,
- headerStyle: headerStyle
- },
- { title: "Policy Acronym", field: "policyAcronym",
- cellStyle: cellStyle,
- headerStyle: headerStyle
- },
- { title: "Policy Name", field: "policyName",
- cellStyle: cellStyle,
- headerStyle: headerStyle
- },
- { title: "Version", field: "version",
- cellStyle: cellStyle,
- headerStyle: headerStyle
- },
- { title: "Uploaded By", field: "updatedBy",
- cellStyle: cellStyle,
- headerStyle: headerStyle
- },
- { title: "Uploaded Date", field: "updatedDate", editable: 'never',
- cellStyle: cellStyle,
- headerStyle: headerStyle
- },
- { title: "Created Date", field: "createdDate", editable: 'never',
- cellStyle: cellStyle,
- headerStyle: headerStyle
- }
- ],
- tableIcons: {
- FirstPage: forwardRef((props, ref) => <FirstPage {...props} ref={ref} />),
- LastPage: forwardRef((props, ref) => <LastPage {...props} ref={ref} />),
- NextPage: forwardRef((props, ref) => <ChevronRight {...props} ref={ref} />),
- PreviousPage: forwardRef((props, ref) => <ChevronLeft {...props} ref={ref} />),
- ResetSearch: forwardRef((props, ref) => <Clear {...props} ref={ref} />),
- Search: forwardRef((props, ref) => <Search {...props} ref={ref} />),
- SortArrow: forwardRef((props, ref) => <ArrowUpward {...props} ref={ref} />)
- }
- };
-
- constructor(props, context) {
- super(props, context);
- this.handleClose = this.handleClose.bind(this);
- this.initializeToscaPolicyModelsInfo = this.initializeToscaPolicyModelsInfo.bind(this);
- this.handleYamlContent = this.handleYamlContent.bind(this);
- this.getToscaPolicyModelYaml = this.getToscaPolicyModelYaml.bind(this);
- this.handleAdd = this.handleAdd.bind(this);
- this.handleRemove = this.handleRemove.bind(this);
- this.initializeToscaPolicyModelsInfo();
- }
-
- initializeToscaPolicyModelsInfo() {
- var operationalPolicies = this.state.loopCache.getOperationalPolicies();
- var selectedPolicyModels = [];
- for (var policy in operationalPolicies) {
- var newRow = operationalPolicies[policy]["policyModel"];
- newRow["policyName"] = operationalPolicies[policy].name;
- selectedPolicyModels.push(newRow);
- }
-
- PolicyToscaService.getToscaPolicyModels().then(allToscaModels => {
- this.setState({ toscaPolicyModelsData: allToscaModels,
- selectedPolicyModelsData: selectedPolicyModels});
- });
- }
-
- getToscaPolicyModelYaml(policyModelType, policyModelVersion) {
- if (typeof policyModelType !== "undefined") {
- PolicyToscaService.getToscaPolicyModelYaml(policyModelType, policyModelVersion).then(toscaYaml => {
- if (toscaYaml.length !== 0) {
- this.setState({content: toscaYaml})
- } else {
- this.setState({ content: 'No Tosca model Yaml available' })
- }
- });
- } else {
- this.setState({ content: 'Please select Tosca model to view the details' })
- }
- }
-
- handleYamlContent(event) {
- this.setState({ content: event.target.value });
- }
-
- handleClose() {
- this.setState({ show: false });
- this.props.history.push('/');
- }
-
- renderAlert() {
- return (
- <div>
- <Alert variant="danger" show={this.state.showFailAlert} onClose={this.disableAlert} dismissible>
- {this.state.showMessage}
- </Alert>
- </div>
- );
- }
-
- handleAdd() {
- LoopService.addOperationalPolicyType(this.state.loopCache.getLoopName(),this.state.selectedRowData.policyModelType,this.state.selectedRowData.version)
- .then(pars => {
- this.props.loadLoopFunction(this.state.loopCache.getLoopName());
- this.handleClose();
- })
- .catch(error => {
- this.setState({ showFailAlert: true, showMessage: "Adding failed with error: " + error.message});
- });
- }
-
- handleRemove() {
- LoopService.removeOperationalPolicyType(this.state.loopCache.getLoopName(),this.state.selectedRowData.policyModelType,this.state.selectedRowData.version,this.state.selectedRowData.policyName);
- this.props.loadLoopFunction(this.state.loopCache.getLoopName());
- this.handleClose();
- }
-
- render() {
- return (
- <ModalStyled size="xl" show={this.state.show} onHide={this.handleClose} backdrop="static" keyboard={false} >
- <Modal.Header closeButton>
- <Modal.Title>Modify Loop Operational Policies</Modal.Title>
- </Modal.Header>
- <Tabs id="controlled-tab-example" activeKey={this.state.key} onSelect={key => this.setState({ key, selectedRowData: {} })}>
- <Tab eventKey="add" title="Add Operational Policies">
- <Modal.Body>
- <MaterialTable
- title={"View Tosca Policy Models"}
- data={this.state.toscaPolicyModelsData}
- columns={this.state.toscaColumns}
- icons={this.state.tableIcons}
- onRowClick={(event, rowData) => {this.getToscaPolicyModelYaml(rowData.policyModelType, rowData.version);this.setState({selectedRowData: rowData})}}
- options={{
- headerStyle: rowHeaderStyle,
- rowStyle: rowData => ({
- backgroundColor: (this.state.selectedRowData !== {} && this.state.selectedRowData.tableData !== undefined
- && this.state.selectedRowData.tableData.id === rowData.tableData.id) ? '#EEE' : '#FFF'
- })
- }}
- />
- <div>
- <TextModal value={this.state.content} onChange={this.handleYamlContent}/>
- </div>
- </Modal.Body>
- {this.renderAlert()}
- </Tab>
- <Tab eventKey="remove" title="Remove Operational Policies">
- <Modal.Body>
- <MaterialTable
- title={"Tosca Policy Models already added"}
- data={this.state.selectedPolicyModelsData}
- columns={this.state.toscaColumns}
- icons={this.state.tableIcons}
- onRowClick={(event, rowData) => {this.setState({selectedRowData: rowData})}}
- options={{
- headerStyle: rowHeaderStyle,
- rowStyle: rowData => ({
- backgroundColor: (this.state.selectedRowData !== {} && this.state.selectedRowData.tableData !== undefined
- && this.state.selectedRowData.tableData.id === rowData.tableData.id) ? '#EEE' : '#FFF'
- })
- }}
- />
- </Modal.Body>
- </Tab>
- </Tabs>
- <Modal.Footer>
- <Button variant="secondary" type="null" onClick={this.handleClose}>Cancel</Button>
- <Button variant="primary" disabled={(this.state.key === "remove")} type="submit" onClick={this.handleAdd}>Add</Button>
- <Button variant="primary" disabled={(this.state.key === "add")} type="submit" onClick={this.handleRemove}>Remove</Button>
- </Modal.Footer>
-
- </ModalStyled>
- );
- }
-}
diff --git a/ui-react/src/components/dialogs/Loop/ModifyLoopModal.test.js b/ui-react/src/components/dialogs/Loop/ModifyLoopModal.test.js
deleted file mode 100644
index 055ad0e68..000000000
--- a/ui-react/src/components/dialogs/Loop/ModifyLoopModal.test.js
+++ /dev/null
@@ -1,109 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP CLAMP
- * ================================================================================
- * Copyright (C) 2020 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 { mount } from 'enzyme';
-import ModifyLoopModal from './ModifyLoopModal';
-import LoopCache from '../../../api/LoopCache';
-import LoopService from '../../../api/LoopService';
-import PolicyToscaService from '../../../api/PolicyToscaService';
-
-describe('Verify ModifyLoopModal', () => {
- beforeEach(() => {
- PolicyToscaService.getToscaPolicyModels = jest.fn().mockImplementation(() => {
- return Promise.resolve([{
- "policyModelType":"test",
- "policyAcronym":"test",
- "version":"1.0.0",
- "updatedBy":"",
- "updatedDate":""
- }]);
- });
- PolicyToscaService.getToscaPolicyModelYaml = jest.fn().mockImplementation(() => {
- return Promise.resolve("OK");
- });
- })
-
- const loopCache = new LoopCache({
- "name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca",
- "microServicePolicies": [{
- "name": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca",
- "modelType": "onap.policies.monitoring.cdap.tca.hi.lo.app",
- "properties": {"domain": "measurementsForVfScaling"},
- "shared": false,
- "jsonRepresentation": {"schema": {}}
- }],
- "globalPropertiesJson": {
- "dcaeDeployParameters": {
- "testMs": {
- "location_id": "",
- "policy_id": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca"
- }
- }
- }
- });
- const historyMock = { push: jest.fn() };
- const flushPromises = () => new Promise(setImmediate);
-
- it('Test handleClose', () => {
- const handleClose = jest.spyOn(ModifyLoopModal.prototype,'handleClose');
- const component = mount(<ModifyLoopModal history={historyMock} loopCache={loopCache}/>)
-
- component.find('[variant="secondary"]').get(0).props.onClick();
-
- expect(handleClose).toHaveBeenCalledTimes(1);
- expect(component.state('show')).toEqual(false);
- expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
- });
-
- it('Test getToscaPolicyModelYaml', async () => {
- const flushPromises = () => new Promise(setImmediate);
- const component = mount(<ModifyLoopModal history={historyMock} loopCache={loopCache}/>)
- component.setState({
- "selectedRowData": {"tableData":{"id":0}}
- });
- const instance = component.instance();
-
- instance.getToscaPolicyModelYaml("","1.0.0");
- expect(component.state('content')).toEqual("Please select Tosca model to view the details");
-
- instance.getToscaPolicyModelYaml("test","1.0.0");
- await flushPromises();
- expect(component.state('content')).toEqual("OK");
-
- PolicyToscaService.getToscaPolicyModelYaml = jest.fn().mockImplementation(() => {
- return Promise.resolve("");
- });
- instance.getToscaPolicyModelYaml("test","1.0.0");
- await flushPromises();
- expect(component.state('content')).toEqual("No Tosca model Yaml available");
- });
-
- it('Test handleYamlContent', async () => {
- const component = mount(<ModifyLoopModal loopCache={loopCache}/>)
- const instance = component.instance();
-
- const event = {"target":{"value":"testValue"}}
- instance.handleYamlContent(event);
- expect(component.state('content')).toEqual("testValue");
- });
-}); \ No newline at end of file
diff --git a/ui-react/src/components/dialogs/Loop/OpenLoopModal.js b/ui-react/src/components/dialogs/Loop/OpenLoopModal.js
deleted file mode 100644
index b45df6502..000000000
--- a/ui-react/src/components/dialogs/Loop/OpenLoopModal.js
+++ /dev/null
@@ -1,137 +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 Select from 'react-select';
-import Button from 'react-bootstrap/Button';
-import Modal from 'react-bootstrap/Modal';
-import Form from 'react-bootstrap/Form';
-import Row from 'react-bootstrap/Row';
-import Col from 'react-bootstrap/Col';
-import FormCheck from 'react-bootstrap/FormCheck'
-import styled from 'styled-components';
-import LoopService from '../../../api/LoopService';
-import SvgGenerator from '../../loop_viewer/svg/SvgGenerator';
-import LoopCache from '../../../api/LoopCache';
-
-const ModalStyled = styled(Modal)`
- background-color: transparent;
-`
-const CheckBoxStyled = styled(FormCheck.Input)`
- margin-left:3rem;
-`
-
-export default class OpenLoopModal extends React.Component {
- constructor(props, context) {
- super(props, context);
-
- this.getLoopNames = this.getLoopNames.bind(this);
- this.handleOpen = this.handleOpen.bind(this);
- this.handleClose = this.handleClose.bind(this);
- this.handleDropDownListChange = this.handleDropDownListChange.bind(this);
- this.renderSvg = this.renderSvg.bind(this);
- this.showReadOnly = props.showReadOnly !== undefined ? props.showReadOnly : true;
- this.state = {
- show: true,
- chosenLoopName: '',
- loopNames: [],
- loopCacheOpened: new LoopCache({})
- };
- }
-
- componentWillMount() {
- this.getLoopNames();
- }
-
- handleClose() {
- this.setState({ show: false });
- this.props.history.push('/');
- }
-
- handleDropDownListChange(e) {
- LoopService.getLoop(e.value).then(loop => {
- this.setState({
- chosenLoopName: e.value,
- loopCacheOpened: new LoopCache(loop)
- });
- });
- }
-
- getLoopNames() {
- LoopService.getLoopNames().then(loopNames => {
- if (Object.entries(loopNames).length !== 0) {
- const loopOptions = loopNames.filter(loopName => loopName!=='undefined').map((loopName) => { return { label: loopName, value: loopName } });
- this.setState({ loopNames: loopOptions })
- }
- });
- }
-
- handleOpen() {
- console.info("Loop " + this.state.chosenLoopName + " is chosen");
- this.handleClose();
- this.props.loadLoopFunction(this.state.chosenLoopName);
- }
-
- renderSvg() {
- return(
- <SvgGenerator loopCache={this.state.loopCacheOpened} clickable={false} generatedFrom={SvgGenerator.GENERATED_FROM_INSTANCE}/>
- );
- }
-
- render() {
- return (
- <ModalStyled size="xl" show={this.state.show} onHide={this.handleClose} backdrop="static" keyboard={false} >
- <Modal.Header closeButton>
- <Modal.Title>Open Model</Modal.Title>
- </Modal.Header>
- <Modal.Body>
- <Form.Group as={Row} controlId="formPlaintextEmail">
- <Form.Label column sm="2">Model Name:</Form.Label>
- <Col sm="10">
- <Select onChange={this.handleDropDownListChange}
- options={this.state.loopNames} />
- </Col>
- </Form.Group>
- <Form.Group as={Row} style={{alignItems: 'center'}} controlId="formSvgPreview">
- <Form.Label column sm="2">Model Preview:</Form.Label>
- <Col sm="10">
- {this.renderSvg()}
- </Col>
- </Form.Group>
- {this.showReadOnly === true ?
- <Form.Group as={Row} controlId="formBasicCheckbox">
- <Form.Check>
- <FormCheck.Label>Read Only Mode:</FormCheck.Label>
- <CheckBoxStyled style={{marginLeft: '3.5em'}} type="checkbox" />
- </Form.Check>
- </Form.Group>
- : null}
- </Modal.Body>
- <Modal.Footer>
- <Button variant="secondary" type="null" onClick={this.handleClose}>Cancel</Button>
- <Button variant="primary" type="submit" onClick={this.handleOpen}>Open</Button>
- </Modal.Footer>
- </ModalStyled>
-
- );
- }
-}
diff --git a/ui-react/src/components/dialogs/Loop/OpenLoopModal.test.js b/ui-react/src/components/dialogs/Loop/OpenLoopModal.test.js
deleted file mode 100644
index 1865869df..000000000
--- a/ui-react/src/components/dialogs/Loop/OpenLoopModal.test.js
+++ /dev/null
@@ -1,92 +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 OpenLoopModal from './OpenLoopModal';
-import LoopService from '../../../api/LoopService';
-
-describe('Verify OpenLoopModal', () => {
-
- beforeEach(() => {
- fetch.resetMocks();
- fetch.mockResponse(JSON.stringify([
- "LOOP_gmtAS_v1_0_ResourceInstanceName1_tca",
- "LOOP_gmtAS_v1_0_ResourceInstanceName1_tca_3",
- "LOOP_gmtAS_v1_0_ResourceInstanceName2_tca_2"
- ]));
- });
-
- it('Test the render method', () => {
-
- const component = shallow(<OpenLoopModal/>);
- expect(component).toMatchSnapshot();
- });
-
- it('Onchange event', async () => {
- const flushPromises = () => new Promise(setImmediate);
- LoopService.getLoop = jest.fn().mockImplementation(() => {
- return Promise.resolve({
- ok: true,
- status: 200,
- json: () => {}
- });
- });
- const event = {value: 'LOOP_gmtAS_v1_0_ResourceInstanceName1_tca_3'};
- const component = shallow(<OpenLoopModal/>);
- component.find('StateManager').simulate('change', event);
- await flushPromises();
- component.update();
- expect(component.state('chosenLoopName')).toEqual("LOOP_gmtAS_v1_0_ResourceInstanceName1_tca_3");
- });
-
-
- it('Test handleClose', () => {
- const historyMock = { push: jest.fn() };
- const handleClose = jest.spyOn(OpenLoopModal.prototype,'handleClose');
- const component = shallow(<OpenLoopModal history={historyMock} />)
-
- component.find('[variant="secondary"]').prop('onClick')();
-
- expect(handleClose).toHaveBeenCalledTimes(1);
- expect(component.state('show')).toEqual(false);
- expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
-
- handleClose.mockClear();
- });
-
- it('Test handleSubmit', () => {
- const historyMock = { push: jest.fn() };
- const loadLoopFunction = jest.fn();
- const handleOpen = jest.spyOn(OpenLoopModal.prototype,'handleOpen');
- const component = shallow(<OpenLoopModal history={historyMock} loadLoopFunction={loadLoopFunction}/>)
-
- component.find('[variant="primary"]').prop('onClick')();
-
- expect(handleOpen).toHaveBeenCalledTimes(1);
- expect(component.state('show')).toEqual(false);
- expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
-
- handleOpen.mockClear();
- });
-
-});
diff --git a/ui-react/src/components/dialogs/Loop/__snapshots__/CreateLoopModal.test.js.snap b/ui-react/src/components/dialogs/Loop/__snapshots__/CreateLoopModal.test.js.snap
deleted file mode 100644
index 1ba9dbaf1..000000000
--- a/ui-react/src/components/dialogs/Loop/__snapshots__/CreateLoopModal.test.js.snap
+++ /dev/null
@@ -1,167 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify CreateLoopModal Test the render method 1`] = `
-<Styled(Modal)
- backdrop="static"
- keyboard={false}
- onHide={[Function]}
- show={true}
- size="xl"
->
- <ModalHeader
- closeButton={true}
- closeLabel="Close"
- >
- <ModalTitle>
- Create Model
- </ModalTitle>
- </ModalHeader>
- <ModalBody>
- <FormGroup
- as={
- Object {
- "$$typeof": Symbol(react.forward_ref),
- "defaultProps": Object {
- "noGutters": false,
- },
- "render": [Function],
- }
- }
- controlId="formPlaintextEmail"
- >
- <FormLabel
- column={true}
- sm="2"
- srOnly={false}
- >
- Template Name:
- </FormLabel>
- <Col
- sm="10"
- >
- <StateManager
- defaultInputValue=""
- defaultMenuIsOpen={false}
- defaultValue={null}
- onChange={[Function]}
- options={Array []}
- />
- </Col>
- </FormGroup>
- <FormGroup
- as={
- Object {
- "$$typeof": Symbol(react.forward_ref),
- "defaultProps": Object {
- "noGutters": false,
- },
- "render": [Function],
- }
- }
- controlId="formSvgPreview"
- style={
- Object {
- "alignItems": "center",
- }
- }
- >
- <FormLabel
- column={true}
- sm="2"
- srOnly={false}
- >
- Model Preview:
- </FormLabel>
- <Col
- sm="10"
- >
- <withRouter(SvgGenerator)
- clickable={false}
- generatedFrom="TEMPLATE"
- loopCache={
- LoopCache {
- "loopJsonCache": Object {},
- }
- }
- />
- </Col>
- </FormGroup>
- <FormGroup
- as={
- Object {
- "$$typeof": Symbol(react.forward_ref),
- "defaultProps": Object {
- "noGutters": false,
- },
- "render": [Function],
- }
- }
- controlId="formPlaintextEmail"
- >
- <FormLabel
- column={true}
- sm="2"
- srOnly={false}
- >
- Model Name:
- </FormLabel>
- <input
- onChange={[Function]}
- sm="5"
- style={
- Object {
- "marginLeft": "1em",
- "width": "50%",
- }
- }
- type="text"
- value=""
- />
- <span
- sm="5"
- />
- </FormGroup>
- <FormGroup
- as={
- Object {
- "$$typeof": Symbol(react.forward_ref),
- "defaultProps": Object {
- "noGutters": false,
- },
- "render": [Function],
- }
- }
- controlId="formPlaintextEmail"
- >
- <FormLabel
- column={true}
- sm="2"
- srOnly={false}
- >
-
- </FormLabel>
- <styled.div />
- </FormGroup>
- </ModalBody>
- <ModalFooter>
- <Button
- active={false}
- disabled={false}
- onClick={[Function]}
- type="null"
- variant="secondary"
- >
- Cancel
- </Button>
- <Button
- active={false}
- disabled={false}
- onClick={[Function]}
- type="submit"
- variant="primary"
- >
- Create
- </Button>
- </ModalFooter>
-</Styled(Modal)>
-`;
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
deleted file mode 100644
index 33f8faa77..000000000
--- a/ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap
+++ /dev/null
@@ -1,88 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify DeployLoopModal Test the render method 1`] = `
-<Styled(Modal)
- backdrop="static"
- keyboard={false}
- onHide={[Function]}
- show={true}
- size="lg"
->
- <ModalHeader
- closeButton={true}
- closeLabel="Close"
- >
- <ModalTitle>
- Deployment parameters
- </ModalTitle>
- </ModalHeader>
- <Tabs
- activeKey="testMs"
- id="controlled-tab-example"
- mountOnEnter={false}
- onSelect={[Function]}
- unmountOnExit={false}
- variant="tabs"
- >
- <Tab
- eventKey="testMs"
- key="testMs"
- title="testMs"
- >
- <Styled(FormGroup)
- key="location_id"
- >
- <FormLabel
- column={false}
- srOnly={false}
- >
- location_id
- </FormLabel>
- <FormControl
- defaultValue=""
- name="location_id"
- onChange={[Function]}
- type="text"
- />
- </Styled(FormGroup)>
- <Styled(FormGroup)
- key="policy_id"
- >
- <FormLabel
- column={false}
- srOnly={false}
- >
- policy_id
- </FormLabel>
- <FormControl
- defaultValue="TCA_h2NMX_v1_0_ResourceInstanceName1_tca"
- name="policy_id"
- onChange={[Function]}
- type="text"
- />
- </Styled(FormGroup)>
- </Tab>
- </Tabs>
- <div />
- <ModalFooter>
- <Button
- active={false}
- disabled={false}
- onClick={[Function]}
- type="null"
- variant="secondary"
- >
- Cancel
- </Button>
- <Button
- active={false}
- disabled={false}
- onClick={[Function]}
- type="submit"
- variant="primary"
- >
- Deploy
- </Button>
- </ModalFooter>
-</Styled(Modal)>
-`;
diff --git a/ui-react/src/components/dialogs/Loop/__snapshots__/LoopPropertiesModal.test.js.snap b/ui-react/src/components/dialogs/Loop/__snapshots__/LoopPropertiesModal.test.js.snap
deleted file mode 100644
index 3baaa5798..000000000
--- a/ui-react/src/components/dialogs/Loop/__snapshots__/LoopPropertiesModal.test.js.snap
+++ /dev/null
@@ -1,61 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify LoopPropertiesModal Test the render method 1`] = `
-<Styled(Modal)
- backdrop="static"
- keyboard={false}
- onHide={[Function]}
- show={true}
- size="lg"
->
- <ModalHeader
- closeButton={true}
- closeLabel="Close"
- >
- <ModalTitle>
- Model Properties
- </ModalTitle>
- </ModalHeader>
- <ModalBody>
- <Form
- inline={false}
- >
- <FormGroup>
- <FormLabel
- column={false}
- srOnly={false}
- >
- Deploy Parameters
- </FormLabel>
- <FormControl
- as="textarea"
- defaultValue="{\\"location_id\\":\\"\\",\\"policy_id\\":\\"TCA_h2NMX_v1_0_ResourceInstanceName1_tca\\"}"
- name="dcaeDeployParameters"
- onChange={[Function]}
- rows="3"
- />
- </FormGroup>
- </Form>
- </ModalBody>
- <ModalFooter>
- <Button
- active={false}
- disabled={false}
- onClick={[Function]}
- type="null"
- variant="secondary"
- >
- Cancel
- </Button>
- <Button
- active={false}
- disabled={false}
- onClick={[Function]}
- type="submit"
- variant="primary"
- >
- Save Changes
- </Button>
- </ModalFooter>
-</Styled(Modal)>
-`;
diff --git a/ui-react/src/components/dialogs/Loop/__snapshots__/OpenLoopModal.test.js.snap b/ui-react/src/components/dialogs/Loop/__snapshots__/OpenLoopModal.test.js.snap
deleted file mode 100644
index 581fd0ec0..000000000
--- a/ui-react/src/components/dialogs/Loop/__snapshots__/OpenLoopModal.test.js.snap
+++ /dev/null
@@ -1,137 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify OpenLoopModal Test the render method 1`] = `
-<Styled(Modal)
- backdrop="static"
- keyboard={false}
- onHide={[Function]}
- show={true}
- size="xl"
->
- <ModalHeader
- closeButton={true}
- closeLabel="Close"
- >
- <ModalTitle>
- Open Model
- </ModalTitle>
- </ModalHeader>
- <ModalBody>
- <FormGroup
- as={
- Object {
- "$$typeof": Symbol(react.forward_ref),
- "defaultProps": Object {
- "noGutters": false,
- },
- "render": [Function],
- }
- }
- controlId="formPlaintextEmail"
- >
- <FormLabel
- column={true}
- sm="2"
- srOnly={false}
- >
- Model Name:
- </FormLabel>
- <Col
- sm="10"
- >
- <StateManager
- defaultInputValue=""
- defaultMenuIsOpen={false}
- defaultValue={null}
- onChange={[Function]}
- options={Array []}
- />
- </Col>
- </FormGroup>
- <FormGroup
- as={
- Object {
- "$$typeof": Symbol(react.forward_ref),
- "defaultProps": Object {
- "noGutters": false,
- },
- "render": [Function],
- }
- }
- controlId="formSvgPreview"
- style={
- Object {
- "alignItems": "center",
- }
- }
- >
- <FormLabel
- column={true}
- sm="2"
- srOnly={false}
- >
- Model Preview:
- </FormLabel>
- <Col
- sm="10"
- >
- <withRouter(SvgGenerator)
- clickable={false}
- generatedFrom="INSTANCE"
- loopCache={
- LoopCache {
- "loopJsonCache": Object {},
- }
- }
- />
- </Col>
- </FormGroup>
- <FormGroup
- as={
- Object {
- "$$typeof": Symbol(react.forward_ref),
- "defaultProps": Object {
- "noGutters": false,
- },
- "render": [Function],
- }
- }
- controlId="formBasicCheckbox"
- >
- <FormCheck>
- <FormCheckLabel>
- Read Only Mode:
- </FormCheckLabel>
- <Styled(FormCheckInput)
- style={
- Object {
- "marginLeft": "3.5em",
- }
- }
- type="checkbox"
- />
- </FormCheck>
- </FormGroup>
- </ModalBody>
- <ModalFooter>
- <Button
- active={false}
- disabled={false}
- onClick={[Function]}
- type="null"
- variant="secondary"
- >
- Cancel
- </Button>
- <Button
- active={false}
- disabled={false}
- onClick={[Function]}
- type="submit"
- variant="primary"
- >
- Open
- </Button>
- </ModalFooter>
-</Styled(Modal)>
-`;