"@babel/preset-env": "7.14.7",
"@babel/preset-react": "7.14.5",
"@wojtekmaj/enzyme-adapter-react-17": "0.6.2",
- "babel-jest": "26.6.0",
"enzyme": "3.11.0",
"enzyme-adapter-react-17-updated": "1.0.2",
"enzyme-to-json": "3.6.2",
import ReadAndConvertYaml from "./components/dialogs/ControlLoop/ReadAndConvertYaml";
import MonitorInstantiation from "./components/dialogs/ControlLoop/MonitorInstantiation";
import GetLocalToscaFileForUpload from "./components/dialogs/ControlLoop/GetLocalToscaFileForUpload";
+import CommissioningModal from "./components/dialogs/ControlLoop/CommissioningModal";
import UploadToscaInstantiation from "./components/dialogs/ControlLoop/UploadToscaInstantiation";
const StyledMainDiv = styled.div`
<React.Fragment>
<Route path="/readToscaTemplate" render={ (routeProps) => (<ReadAndConvertYaml { ...routeProps } />) }/>
<Route path="/uploadToscaFile" render={ (routeProps) => (<GetLocalToscaFileForUpload { ...routeProps } />) }/>
+ <Route path="/getJsonSchema" render={ (routeProps) => (<CommissioningModal { ...routeProps } />) }/>
<Route path="/viewLoopTemplatesModal" render={ (routeProps) => (<ViewLoopTemplatesModal { ...routeProps } />) }/>
<Route path="/manageDictionaries" render={ (routeProps) => (<ManageDictionaries { ...routeProps } />) }/>
<Route path="/viewAllPolicies" render={ (routeProps) => (<ViewAllPolicies { ...routeProps } />) }/>
path="/uploadToscaFile"
render={[Function]}
/>
+ <Route
+ path="/getJsonSchema"
+ render={[Function]}
+ />
<Route
path="/viewLoopTemplatesModal"
render={[Function]}
path="/uploadToscaFile"
render={[Function]}
/>
+ <Route
+ path="/getJsonSchema"
+ render={[Function]}
+ />
<Route
path="/viewLoopTemplatesModal"
render={[Function]}
const response = await fetch(windowLocationPathname +
'/restservices/clds/v2/toscaControlLoop/getToscaTemplate' + '?' + (new URLSearchParams(params)));
- if (!response.ok) {
- const message = `An error has occurred: ${response.status}`;
- throw new Error(message);
+ const data = await response;
+
+ return data;
+ }
+
+ static async deleteToscaTemplate(name, version, windowLocationPathname) {
+ const params = {
+ name: name,
+ version: version
}
+ const response = await fetch(windowLocationPathname +
+ '/restservices/clds/v2/toscaControlLoop/decommissionToscaTemplate' + '?' + (new URLSearchParams(params)),
+ {
+ method: 'DELETE'
+ });
+
+ this.checkResponseForError(response);
+
+ const data = await response;
+
+ return data;
+ }
+
+ static async getToscaControlLoopDefinitions(windowLocationPathname) {
+
+ const response = await fetch(windowLocationPathname +
+ '/restservices/clds/v2/toscaControlLoop/getElementDefinitions');
+
+ this.checkResponseForError(response);
+
const data = await response;
return data;
return response
}
+
+ static async getToscaServiceTemplateSchema(section, windowLocationPathName) {
+
+ const params = {
+ section: section
+ }
+
+ const response = await fetch(windowLocationPathName +
+ '/restservices/clds/v2/toscaControlLoop/getJsonSchema' + '?' + (new URLSearchParams(params)));
+
+ this.checkResponseForError(response);
+
+ return response;
+ }
+
+ static checkResponseForError (response) {
+ if (!response.ok) {
+ const message = `An error has occurred: ${response.status}`;
+ throw new Error(message);
+ }
+ }
}
--- /dev/null
+/*
+ * ============LICENSE_START=======================================================
+ * Copyright (C) 2021 Nordix Foundation.
+ * ================================================================================
+ * 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.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ * ============LICENSE_END=========================================================
+ */
+import Modal from "react-bootstrap/Modal";
+import Button from "react-bootstrap/Button";
+import React, { useEffect, useState } from "react";
+import styled from "styled-components";
+import { JSONEditor } from "@json-editor/json-editor";
+import ControlLoopService from "../../../api/ControlLoopService";
+import OnapConstant from "../../../utils/OnapConstants";
+
+const ModalStyled = styled(Modal)`
+ @media (min-width: 800px) {
+ .modal-xl {
+ max-width: 96%;
+ }
+ }
+ background-color: transparent;
+`
+
+const StyledMessagesDiv = styled.div`
+ overflow: auto;
+ min-width: 100%;
+ max-height: 300px;
+ padding: 5px 5px 0px 5px;
+ text-align: center;
+`
+
+const CommissioningModal = (props) => {
+ const [windowLocationPathName, setWindowLocationPathName] = useState('');
+ const [toscaInitialValues, setToscaInitialValues] = useState({});
+ const [toscaJsonSchema, setToscaJsonSchema] = useState({});
+ const [jsonEditor, setJsonEditor] = useState({});
+ const [show, setShow] = useState(true);
+
+ const handleClose = () => {
+ console.log('handleClose called');
+ setShow(false);
+ props.history.push('/');
+ }
+
+ const getToscaServiceTemplateHandler = async (toscaServiceTemplateResponse) => {
+
+ if (!toscaServiceTemplateResponse.ok) {
+ const toscaData = await toscaServiceTemplateResponse;
+ setToscaInitialValues(toscaData);
+ } else {
+ const toscaData = await toscaServiceTemplateResponse.json();
+ setToscaInitialValues(toscaData);
+ }
+ }
+
+ const getToscaSchemaHandler = async (toscaSchemaResponse) => {
+
+ if (!toscaSchemaResponse.ok) {
+ const toscaSchemaData = await toscaSchemaResponse;
+ setToscaJsonSchema(toscaSchemaData);
+ } else {
+ const toscaSchemaData = await toscaSchemaResponse.json();
+ setToscaJsonSchema(toscaSchemaData);
+ }
+ }
+
+ useEffect(async () => {
+ setWindowLocationPathName(window.location.pathname);
+
+ const toscaTemplateResponse = await ControlLoopService.getToscaControlLoopDefinitions(windowLocationPathName)
+ .catch(error => error.message);
+
+ const toscaSchemaResponse = await ControlLoopService.getToscaServiceTemplateSchema('node_templates', windowLocationPathName);
+
+ createJsonEditor(await toscaSchemaResponse.json(), await toscaTemplateResponse.json());
+
+ }, []);
+
+ // TODO Need to Hook this up to a new camel endpoint to get it working
+ const createJsonEditor = (toscaModel, editorData) => {
+ JSONEditor.defaults.options.collapse = true;
+
+ return new JSONEditor(document.getElementById("editor"),
+ {
+ schema: toscaModel,
+ startval: editorData,
+ theme: 'bootstrap4',
+ iconlib: 'fontawesome5',
+ object_layout: 'normal',
+ disable_properties: false,
+ disable_edit_json: false,
+ disable_array_reorder: true,
+ disable_array_delete_last_row: true,
+ disable_array_delete_all_rows: false,
+ array_controls_top: true,
+ keep_oneof_values: false,
+ collapsed: true,
+ show_errors: 'always',
+ display_required_only: false,
+ show_opt_in: false,
+ prompt_before_delete: true,
+ required_by_default: false,
+ })
+ }
+
+ return (
+ <ModalStyled size="xl"
+ show={ show }
+ onHide={ handleClose }
+ backdrop="static"
+ keyboard={ false }>
+ <Modal.Header closeButton>
+ <Modal.Title>Edit Control Loop Parameters</Modal.Title>
+ </Modal.Header>
+ <br/>
+ <div style={ { padding: '5px 5px 0px 5px' } }>
+ <Modal.Body>
+ <div id="editor"/>
+ </Modal.Body>
+ </div>
+ <Modal.Footer>
+ <Button variant="primary"
+ >Submit</Button>
+ <Button variant="secondary"
+ onClick={ handleClose }>Close</Button>
+ </Modal.Footer>
+ </ModalStyled>
+ );
+}
+
+export default CommissioningModal;
--- /dev/null
+/*
+ * ============LICENSE_START=======================================================
+ * Copyright (C) 2021 Nordix Foundation.
+ * ================================================================================
+ * 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.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ * ============LICENSE_END=========================================================
+ */
+
+import React from 'react';
+import { mount, shallow } from 'enzyme';
+import ReadAndConvertYaml from './ReadAndConvertYaml';
+import toJson from "enzyme-to-json";
+import { act } from "react-dom/test-utils";
+import { createMemoryHistory } from "history";
+import CommissioningModal from "./CommissioningModal";
+
+describe('Verify ReadAndConvertYaml', () => {
+
+ it("renders without crashing", () => {
+ shallow(<CommissioningModal/>);
+ });
+
+ it("renders correctly", () => {
+ const tree = shallow(<CommissioningModal/>);
+ expect(toJson(tree)).toMatchSnapshot();
+ });
+
+ it('should have two Button elements', () => {
+ const container = shallow(<CommissioningModal/>)
+ expect(container.find('Button').length).toEqual(2);
+ });
+
+ it('handleClose called when bottom button clicked', () => {
+ const history = createMemoryHistory();
+ const component = mount(<CommissioningModal history={ history }/>)
+ const logSpy = jest.spyOn(console, 'log');
+
+
+ act(() => {
+ component.find('[variant="secondary"]').simulate('click');
+ expect(logSpy).toHaveBeenCalledWith('handleClose called');
+ });
+ });
+
+ it('handleClose called when top-right button clicked', () => {
+ const history = createMemoryHistory();
+ const component = mount(<CommissioningModal history={ history }/>)
+ const logSpy = jest.spyOn(console, 'log');
+
+
+ act(() => {
+ component.find('[size="xl"]').get(0).props.onHide();
+ expect(logSpy).toHaveBeenCalledWith('handleClose called');
+ });
+ });
+
+});
--- /dev/null
+/*
+ * ============LICENSE_START=======================================================
+ * Copyright (C) 2021 Nordix Foundation.
+ * ================================================================================
+ * 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.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ * ============LICENSE_END=========================================================
+ */
+
+import React, { useState } from "react";
+import Button from "react-bootstrap/Button";
+import ControlLoopService from "../../../api/ControlLoopService";
+
+const DeleteToscaTemplate = props => {
+
+ const [windowLocationPathName, setWindowLocationPathname] = useState('');
+
+ const deleteTemplateHandler = async () => {
+ console.log('deleteTemplateHandler called');
+ setWindowLocationPathname(window.location.pathname);
+
+ const response = await ControlLoopService.deleteToscaTemplate(props.templateName, props.templateVersion, windowLocationPathName)
+ .catch(error => error.message);
+
+ console.log('Response is ok: ' + response.ok);
+
+ props.onDeleteToscaServiceTemplate(response);
+
+ }
+
+ return (
+ <React.Fragment>
+ <Button variant="danger"
+ type="submit"
+ style={{float: "right"}}
+ onClick={ deleteTemplateHandler }>Delete Tosca Service Template</Button>
+ </React.Fragment>
+ );
+
+
+}
+
+export default DeleteToscaTemplate;
--- /dev/null
+/*
+ * ============LICENSE_START=======================================================
+ * Copyright (C) 2021 Nordix Foundation.
+ * ================================================================================
+ * 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.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ * ============LICENSE_END=========================================================
+ */
+
+import React from 'react';
+import { mount, shallow } from 'enzyme';
+import GetToscaTemplate from './GetToscaTemplate';
+import toJson from "enzyme-to-json";
+import DeleteToscaTemplate from "./DeleteToscaTemplate";
+
+describe('Verify DeleteToscaTemplate', () => {
+
+ it("renders without crashing", () => {
+ shallow(<DeleteToscaTemplate/>);
+ });
+
+ it("renders correctly", () => {
+ const tree = shallow(<DeleteToscaTemplate/>);
+ expect(toJson(tree)).toMatchSnapshot();
+ });
+
+ it('should have a Button element', () => {
+ const container = shallow(<DeleteToscaTemplate/>)
+ expect(container.find('Button').length).toEqual(1);
+ });
+
+ it('button should call deleteTemplateHandler when clicked', async () => {
+ const component = mount(<DeleteToscaTemplate/>)
+ const logSpy = jest.spyOn(console, 'log');
+
+ component.find('[variant="danger"]').simulate('click');
+ expect(logSpy).toHaveBeenCalledWith('deleteTemplateHandler called');
+ });
+
+ it('should have a Button element with specified text', () => {
+ const container = shallow(<DeleteToscaTemplate/>)
+ expect(container.find('Button').text()).toBe('Delete Tosca Service Template');
+ });
+});
<React.Fragment>
<Button variant="primary"
type="submit"
- onClick={ getTemplateHandler }>Get Tosca Service Template</Button>
+ onClick={ getTemplateHandler }>Pull Tosca Service Template</Button>
</React.Fragment>
);
it('should have a Button element with specified text', () => {
const container = shallow(<GetToscaTemplate/>)
- expect(container.find('Button').text()).toBe('Get Tosca Service Template');
+ expect(container.find('Button').text()).toBe('Pull Tosca Service Template');
});
});
import { Alert } from "react-bootstrap";
import styled from 'styled-components';
+import DeleteToscaTemplate from "./DeleteToscaTemplate";
const ModalStyled = styled(Modal)`
background-color: transparent;
const ReadAndConvertYaml = (props) => {
const [show, setShow] = useState(true);
const [toscaTemplateData, setToscaTemplateData] = useState();
- const [responeOk, setResponseOk] = useState(true);
+ const [deleteToscaTemplateData, setDeleteToscaTemplateData] = useState();
+ const [responseOk, setResponseOk] = useState(true);
+ const [deleteResponseOk, setDeleteResponseOk] = useState(true);
const name = 'ToscaServiceTemplateSimple';
const version = '1.0.0';
// console.log('getToscaServiceTemplateHandler called: ' + toscaServiceTemplate);
if (!toscaServiceTemplateResponse.ok) {
+ console.log('Response is not ok');
setResponseOk(false);
- const toscaData = await toscaServiceTemplateResponse;
+ const toscaData = await toscaServiceTemplateResponse.json();
setToscaTemplateData(toscaData);
} else {
setResponseOk(true);
}
}
+ const deleteToscaServiceTemplateHandler = async (deleteToscaServiceTemplateResponse) => {
+
+ if (!deleteToscaServiceTemplateResponse.ok) {
+ console.log('Delete response not ok');
+ setDeleteResponseOk(false);
+ const deleteToscaData = await deleteToscaServiceTemplateResponse;
+ setDeleteToscaTemplateData(deleteToscaData);
+ } else {
+ setDeleteResponseOk(true);
+ const deleteToscaData = await deleteToscaServiceTemplateResponse.json();
+ setDeleteToscaTemplateData(deleteToscaData);
+ }
+ }
+
return (
<ModalStyled size="xl"
show={ show }
<GetToscaTemplate templateName={ name }
templateVersion={ version }
onGetToscaServiceTemplate={ getToscaServiceTemplateHandler }/>
- { responeOk && <PreStyled> { JSON.stringify(toscaTemplateData, null, 2) } </PreStyled> }
- <AlertStyled show={ !responeOk }
- variant="danger">{ toscaTemplateData }</AlertStyled>
+ { responseOk && <PreStyled> { JSON.stringify(toscaTemplateData, null, 2) } </PreStyled> }
+ <AlertStyled show={ !responseOk }
+ variant="danger">{ JSON.stringify(toscaTemplateData, null, 2) }</AlertStyled>
+ { deleteResponseOk && responseOk && toscaTemplateData != null &&
+ <DeleteToscaTemplate templateName={ name }
+ templateVersion={ version }
+ onDeleteToscaServiceTemplate={ deleteToscaServiceTemplateHandler }
+ />
+ }
+ <AlertStyled show={ !deleteResponseOk }
+ variant="danger">{ deleteToscaTemplateData }</AlertStyled>
+ <AlertStyled show={ deleteResponseOk && deleteToscaTemplateData != null }
+ variant="success"><h2>Delete Successful</h2><PreStyled>{ JSON.stringify(deleteToscaTemplateData, null, 2) }</PreStyled></AlertStyled>
</Modal.Body>
<Modal.Footer>
<Button variant="secondary"
type="null"
- onClick={ handleClose }>Cancel</Button>
+ onClick={ handleClose }>Close</Button>
</Modal.Footer>
</ModalStyled>
);
-};
+}
+;
export default ReadAndConvertYaml;
--- /dev/null
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Verify ReadAndConvertYaml renders correctly 1`] = `
+<Styled(Modal)
+ backdrop="static"
+ keyboard={false}
+ onHide={[Function]}
+ show={true}
+ size="xl"
+>
+ <ModalHeader
+ closeButton={true}
+ closeLabel="Close"
+ >
+ <ModalTitle>
+ Edit Control Loop Parameters
+ </ModalTitle>
+ </ModalHeader>
+ <br />
+ <div
+ style={
+ Object {
+ "padding": "5px 5px 0px 5px",
+ }
+ }
+ >
+ <ModalBody>
+ <div
+ id="editor"
+ />
+ </ModalBody>
+ </div>
+ <ModalFooter>
+ <Button
+ active={false}
+ disabled={false}
+ variant="primary"
+ >
+ Submit
+ </Button>
+ <Button
+ active={false}
+ disabled={false}
+ onClick={[Function]}
+ variant="secondary"
+ >
+ Close
+ </Button>
+ </ModalFooter>
+</Styled(Modal)>
+`;
--- /dev/null
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Verify DeleteToscaTemplate renders correctly 1`] = `
+<Fragment>
+ <Button
+ active={false}
+ disabled={false}
+ onClick={[Function]}
+ style={
+ Object {
+ "float": "right",
+ }
+ }
+ type="submit"
+ variant="danger"
+ >
+ Delete Tosca Service Template
+ </Button>
+</Fragment>
+`;
type="submit"
variant="primary"
>
- Get Tosca Service Template
+ Pull Tosca Service Template
</Button>
</Fragment>
`;
show={false}
variant="danger"
/>
+ <Styled(Alert)
+ show={false}
+ variant="danger"
+ />
+ <Styled(Alert)
+ show={false}
+ variant="success"
+ >
+ <h2>
+ Delete Successful
+ </h2>
+ <styled.pre />
+ </Styled(Alert)>
</ModalBody>
<ModalFooter>
<Button
type="null"
variant="secondary"
>
- Cancel
+ Close
</Button>
</ModalFooter>
</Styled(Modal)>
<NavDropdown.Item as={ StyledLink } to="/uploadToscaInstantiation">Upload Tosca Instantiation</NavDropdown.Item>
<NavDropdown.Divider />
<NavDropdown.Header>Commissioning</NavDropdown.Header>
- <NavDropdown.Item as={ StyledLink } to="/readToscaTemplate">View Tosca Template</NavDropdown.Item>
+ <NavDropdown.Item as={ StyledLink } to="/readToscaTemplate">Manage Commissioned Tosca Template</NavDropdown.Item>
<NavDropdown.Item as={ StyledLink } to="/uploadToscaFile">Upload Tosca to Commissioning</NavDropdown.Item>
+ <NavDropdown.Item as={ StyledLink } to="/getJsonSchema">Edit Control Loop Type Definitions</NavDropdown.Item>
</StyledNavDropdown>
<StyledNavDropdown title="Help">
<StyledNavLink href="https://wiki.onap.org/" target="_blank">Wiki</StyledNavLink>
disabled={false}
to="/readToscaTemplate"
>
- View Tosca Template
+ Manage Commissioned Tosca Template
</DropdownItem>
<DropdownItem
as={
>
Upload Tosca to Commissioning
</DropdownItem>
+ <DropdownItem
+ as={
+ Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "attrs": Array [],
+ "componentStyle": e {
+ "baseHash": -715527839,
+ "baseStyle": undefined,
+ "componentId": "sc-bdnxRM",
+ "isStatic": false,
+ "rules": Array [
+ "
+ color: ",
+ [Function],
+ ";
+ background-color: ",
+ [Function],
+ ";
+ font-weight: normal;
+ display: block;
+ width: 100%;
+ padding: .25rem 1.5rem;
+ clear: both;
+ text-align: inherit;
+ white-space: nowrap;
+ border: 0;
+
+ :hover {
+ text-decoration: none;
+ background-color: ",
+ [Function],
+ ";
+ color: ",
+ [Function],
+ ";
+ }
+",
+ ],
+ "staticRulesId": "",
+ },
+ "foldedComponentIds": Array [],
+ "render": [Function],
+ "shouldForwardProp": undefined,
+ "styledComponentId": "sc-bdnxRM",
+ "target": Object {
+ "$$typeof": Symbol(react.forward_ref),
+ "propTypes": Object {
+ "innerRef": [Function],
+ "onClick": [Function],
+ "replace": [Function],
+ "target": [Function],
+ "to": [Function],
+ },
+ "render": [Function],
+ },
+ "toString": [Function],
+ "warnTooManyClasses": [Function],
+ "withComponent": [Function],
+ }
+ }
+ disabled={false}
+ to="/getJsonSchema"
+ >
+ Edit Control Loop Type Definitions
+ </DropdownItem>
</Styled(NavDropdown)>
<Styled(NavDropdown)
title="Help"
Code Review / policy / gui.git / commitdiff