Merge master into tosca-poc branch

This review was created with the commands:
git co master
git pull
git co tosca-poc
git pull
git merge -X theirs master

With this merge, the CLAMP master branch is merged into tosca-poc, and,
apart from the tosca-controlloop directory, they are identical

Issue-ID: POLICY-3215
Change-Id: Iaa1c4894b33508f8bb75b7d1c0dd414964497625
Signed-off-by: liamfallon <liam.fallon@est.tech>

70 files changed, 0 insertions, 11089 deletions

diff --git a/ui-react/src/LoopUI.js b/ui-react/src/LoopUI.js
deleted file mode 100644
index 8dc3bdb03..000000000
--- a/ui-react/src/LoopUI.js
+++ /dev/null
@@ -1,419 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP 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 styled from 'styled-components';
-import MenuBar from './components/menu/MenuBar';
-import Navbar from 'react-bootstrap/Navbar';
-import logo from './logo.png';
-import { GlobalClampStyle } from './theme/globalStyle.js';
-import OnapConstants from './utils/OnapConstants';
-
-import SvgGenerator from './components/loop_viewer/svg/SvgGenerator';
-import LoopLogs from './components/loop_viewer/logs/LoopLogs';
-import LoopStatus from './components/loop_viewer/status/LoopStatus';
-import UserService from './api/UserService';
-import LoopCache from './api/LoopCache';
-import LoopActionService from './api/LoopActionService';
-
-import { Route } from 'react-router-dom'
-import CreateLoopModal from './components/dialogs/Loop/CreateLoopModal';
-import OpenLoopModal from './components/dialogs/Loop/OpenLoopModal';
-import ModifyLoopModal from './components/dialogs/Loop/ModifyLoopModal';
-import PolicyModal from './components/dialogs/Policy/PolicyModal';
-import ViewAllPolicies from './components/dialogs/Policy/ViewAllPolicies';
-import LoopPropertiesModal from './components/dialogs/Loop/LoopPropertiesModal';
-import UserInfoModal from './components/dialogs/UserInfoModal';
-import LoopService from './api/LoopService';
-import ViewLoopTemplatesModal from './components/dialogs/Tosca/ViewLoopTemplatesModal';
-import ManageDictionaries from './components/dialogs/ManageDictionaries/ManageDictionaries';
-import PerformAction from './components/dialogs/PerformActions';
-import RefreshStatus from './components/dialogs/RefreshStatus';
-import DeployLoopModal from './components/dialogs/Loop/DeployLoopModal';
-import Alert from 'react-bootstrap/Alert';
-import Spinner from 'react-bootstrap/Spinner';
-
-import { Link } from 'react-router-dom';
-
-const StyledMainDiv = styled.div`
-    background-color: ${props => props.theme.backgroundColor};
-`
-
-const StyledSpinnerDiv = styled.div`
-    justify-content: center !important;
-    display: flex !important;
-`;
-
-const ProjectNameStyled = styled.a`
-    vertical-align: middle;
-    padding-left: 30px;
-    font-size: 36px;
-    font-weight: bold;
-`
-
-const StyledRouterLink = styled(Link)`
-    color: ${props => props.theme.menuFontColor};
-    background-color: ${props => props.theme.backgroundColor};
-`
-
-const StyledLoginInfo = styled.a`
-    color: ${props => props.theme.menuFontColor};
-    background-color: ${props => props.theme.backgroundColor};
-`
-
-const LoopViewDivStyled = styled.div`
-    height: 100%;
-    overflow: hidden;
-    margin-left: 10px;
-    margin-right: 10px;
-    margin-bottom: 10px;
-    color: ${props => props.theme.loopViewerFontColor};
-    background-color: ${props => props.theme.loopViewerBackgroundColor};
-    border: 1px solid transparent;
-    border-color: ${props => props.theme.loopViewerHeaderBackgroundColor};
-`
-
-const LoopViewHeaderDivStyled = styled.div`
-    background-color: ${props => props.theme.loopViewerHeaderBackgroundColor};
-    padding: 10px 10px;
-    color: ${props => props.theme.loopViewerHeaderFontColor};
-`
-
-const LoopViewBodyDivStyled = styled.div`
-    background-color: ${props => (props.theme.loopViewerBackgroundColor)};
-    padding: 10px 10px;
-    color: ${props => (props.theme.loopViewerHeaderFontColor)};
-    height: 95%;
-`
-
-export default class LoopUI extends React.Component {
-
-    state = {
-        userName: null,
-        loopName: OnapConstants.defaultLoopName,
-        loopCache: new LoopCache({}),
-        showSucAlert: false,
-        showFailAlert: false,
-        busyLoadingCount: 0
-    };
-
-    constructor() {
-        super();
-        this.getUser = this.getUser.bind(this);
-        this.updateLoopCache = this.updateLoopCache.bind(this);
-        this.loadLoop = this.loadLoop.bind(this);
-        this.closeLoop = this.closeLoop.bind(this);
-        this.showSucAlert =  this.showSucAlert.bind(this);
-        this.showFailAlert =  this.showFailAlert.bind(this);
-        this.disableAlert =  this.disableAlert.bind(this);
-        this.setBusyLoading = this.setBusyLoading.bind(this);
-        this.clearBusyLoading = this.clearBusyLoading.bind(this);
-        this.isBusyLoading = this.isBusyLoading.bind(this);
-        this.renderGlobalStyle = this.renderGlobalStyle.bind(this);
-        this.renderSvg = this.renderSvg.bind(this);
-    }
-
-    componentWillMount() {
-        this.getUser();
-    }
-
-    getUser() {
-        UserService.login().then(user => {
-            this.setState({ userName: user })
-        });
-    }
-
-    renderMenuNavBar() {
-        return (
-            <MenuBar loopName={this.state.loopName}/>
-        );
-    }
-
-    renderUserLoggedNavBar() {
-        return (
-            <Navbar.Text>
-            <StyledLoginInfo>Signed in as: </StyledLoginInfo>
-                <StyledRouterLink to="/userInfo">{this.state.userName}</StyledRouterLink>
-            </Navbar.Text>
-        );
-    }
-
-    renderLogoNavBar() {
-        return (
-            <Navbar.Brand>
-                <img height="50px" width="234px" src={logo} alt="" />
-                <ProjectNameStyled>CLAMP</ProjectNameStyled>
-            </Navbar.Brand>
-        );
-    }
-
-    renderAlertBar() {
-        return (
-            <div>
-                <Alert variant="success" show={this.state.showSucAlert} onClose={this.disableAlert} dismissible>
-                    {this.state.showMessage}
-                </Alert>
-                <Alert variant="danger" show={this.state.showFailAlert} onClose={this.disableAlert} dismissible>
-                    {this.state.showMessage}
-                </Alert>
-            </div>
-        );
-    }
-
-    renderNavBar() {
-        return (
-            <Navbar >
-                {this.renderLogoNavBar()}
-                <Navbar.Toggle aria-controls="responsive-navbar-nav" />
-                {this.renderMenuNavBar()}
-                {this.renderUserLoggedNavBar()}
-            </Navbar>
-        );
-    }
-
-    renderLoopViewHeader() {
-        return (
-            <LoopViewHeaderDivStyled>
-                Loop Viewer - {this.state.loopName} - ({this.state.loopCache.getTemplateName()})
-            </LoopViewHeaderDivStyled>
-        );
-    }
-
-    renderSvg() {
-        return (
-            <SvgGenerator loopCache={this.state.loopCache} clickable={true} generatedFrom={SvgGenerator.GENERATED_FROM_INSTANCE} isBusyLoading={this.isBusyLoading}/>
-        )
-    }
-    renderLoopViewBody() {
-        return (
-            <LoopViewBodyDivStyled>
-                {this.renderSvg()}
-                <LoopStatus loopCache={this.state.loopCache}/>
-                <LoopLogs loopCache={this.state.loopCache} />
-            </LoopViewBodyDivStyled>
-        );
-    }
-
-    getLoopCache() {
-        return this.state.loopCache;
-
-    }
-
-    renderLoopViewer() {
-        return (
-            <LoopViewDivStyled>
-                {this.renderLoopViewHeader()}
-                {this.renderLoopViewBody()}
-            </LoopViewDivStyled>
-        );
-    }
-
-    updateLoopCache(loopJson) {
-
-        // If call with an empty object for loopJson, this is a reset to empty
-        // from someplace like PerformActions for the case where we are "deleting"
-        // a Control Loop model. Set the loopName to the default.
-
-        if (loopJson === null) {
-            this.setState({ loopName: OnapConstants.defaultLoopName });
-            this.setState({ loopCache: new LoopCache({}) });
-        } else {
-            this.setState({ loopCache: new LoopCache(loopJson) });
-            this.setState({ loopName: this.state.loopCache.getLoopName() });
-        }
-        console.info(this.state.loopName+" loop loaded successfully");
-        }
-
-    showSucAlert(message) {
-        this.setState ({ showSucAlert: true, showMessage:message });
-    }
-
-    showFailAlert(message) {
-        this.setState ({ showFailAlert: true, showMessage:message });
-    }
-
-    disableAlert() {
-        this.setState ({ showSucAlert: false, showFailAlert: false });
-    }
-
-    loadLoop(loopName) {
-        this.setBusyLoading();
-        LoopService.getLoop(loopName).then(loop => {
-            console.debug("Updating loopCache");
-            LoopActionService.refreshStatus(loopName).then(data => {
-                this.updateLoopCache(data);
-                this.clearBusyLoading();
-                this.props.history.push('/');
-            })
-            .catch(error => {
-                this.updateLoopCache(loop);
-                this.clearBusyLoading();
-                this.props.history.push('/');
-            });
-        });
-    }
-
-    setBusyLoading() {
-        this.setState((state,props) => ({ busyLoadingCount: ++state.busyLoadingCount }));
-    }
-
-    clearBusyLoading() {
-        this.setState((state,props) => ({ busyLoadingCount: --state.busyLoadingCount }));
-    }
-
-    isBusyLoading() {
-        if (this.state.busyLoadingCount === 0) {
-            return false;
-        } else {
-            return true;
-        }
-    }
-
-    closeLoop() {
-        this.setState({ loopCache: new LoopCache({}), loopName: OnapConstants.defaultLoopName });
-        this.props.history.push('/');
-    }
-
-    renderRoutes() {
-        return(
-            <React.Fragment>
-                <Route path="/viewLoopTemplatesModal" render={(routeProps) => (<ViewLoopTemplatesModal {...routeProps} />)} />
-                <Route path="/manageDictionaries" render={(routeProps) => (<ManageDictionaries {...routeProps} />)} />
-                <Route path="/viewAllPolicies" render={(routeProps) => (<ViewAllPolicies {...routeProps} />)} />
-                <Route path="/policyModal/:policyInstanceType/:policyName" render={(routeProps) => (<PolicyModal {...routeProps}
-                    loopCache={this.getLoopCache()}
-                    loadLoopFunction={this.loadLoop}/>)}
-                />
-                <Route path="/createLoop" render={(routeProps) => (<CreateLoopModal {...routeProps}
-                    loadLoopFunction={this.loadLoop} />)}
-                />
-                <Route path="/openLoop" render={(routeProps) => (<OpenLoopModal {...routeProps}
-                    loadLoopFunction={this.loadLoop} />)}
-                />
-                <Route path="/loopProperties" render={(routeProps) => (<LoopPropertiesModal {...routeProps}
-                    loopCache={this.getLoopCache()}
-                    loadLoopFunction={this.loadLoop}/>)}
-                />
-                <Route path="/modifyLoop" render={(routeProps) => (<ModifyLoopModal {...routeProps}
-                    loopCache={this.getLoopCache()}
-                    loadLoopFunction={this.loadLoop}/>)}
-                />
-
-                <Route path="/userInfo" render={(routeProps) => (<UserInfoModal {...routeProps} />)} />
-                <Route path="/closeLoop" render={this.closeLoop} />
-
-                <Route path="/submit" render={(routeProps) => (<PerformAction {...routeProps}
-                    loopAction="submit"
-                    loopCache={this.getLoopCache()}
-                    updateLoopFunction={this.updateLoopCache}
-                    showSucAlert={this.showSucAlert}
-                    showFailAlert={this.showFailAlert}
-                    setBusyLoading={this.setBusyLoading}
-                    clearBusyLoading={this.clearBusyLoading}/>)}
-                />
-                <Route path="/stop" render={(routeProps) => (<PerformAction {...routeProps}
-                    loopAction="stop"
-                    loopCache={this.getLoopCache()}
-                    updateLoopFunction={this.updateLoopCache}
-                    showSucAlert={this.showSucAlert}
-                    showFailAlert={this.showFailAlert}
-                    setBusyLoading={this.setBusyLoading}
-                    clearBusyLoading={this.clearBusyLoading}/>)}
-                />
-                <Route path="/restart" render={(routeProps) => (<PerformAction {...routeProps}
-                    loopAction="restart"
-                    loopCache={this.getLoopCache()}
-                    updateLoopFunction={this.updateLoopCache}
-                    showSucAlert={this.showSucAlert}
-                    showFailAlert={this.showFailAlert}
-                    setBusyLoading={this.setBusyLoading}
-                    clearBusyLoading={this.clearBusyLoading}/>)}
-                />
-                <Route path="/delete" render={(routeProps) => (<PerformAction {...routeProps}
-                    loopAction="delete"
-                    loopCache={this.getLoopCache()}
-                    updateLoopFunction={this.updateLoopCache}
-                    showSucAlert={this.showSucAlert}
-                    showFailAlert={this.showFailAlert}
-                    setBusyLoading={this.setBusyLoading}
-                    clearBusyLoading={this.clearBusyLoading}/>)}
-                />
-                <Route path="/undeploy" render={(routeProps) => (<PerformAction {...routeProps}
-                    loopAction="undeploy"
-                    loopCache={this.getLoopCache()}
-                    updateLoopFunction={this.updateLoopCache}
-                    showSucAlert={this.showSucAlert}
-                    showFailAlert={this.showFailAlert}
-                    setBusyLoading={this.setBusyLoading}
-                    clearBusyLoading={this.clearBusyLoading}/>)}
-                />
-                <Route path="/deploy" render={(routeProps) => (<DeployLoopModal {...routeProps}
-                    loopCache={this.getLoopCache()}
-                    updateLoopFunction={this.updateLoopCache}
-                    showSucAlert={this.showSucAlert}
-                    showFailAlert={this.showFailAlert}/>)}
-                />
-                <Route path="/refreshStatus" render={(routeProps) => (<RefreshStatus {...routeProps}
-                    loopCache={this.getLoopCache()}
-                    updateLoopFunction={this.updateLoopCache}
-                    showSucAlert={this.showSucAlert}
-                    showFailAlert={this.showFailAlert}/>)}
-                />
-            </React.Fragment>
-        );
-    }
-
-        renderGlobalStyle() {
-                return (
-                        <GlobalClampStyle />
-                );
-        };
-
-
-    renderSpinner() {
-        if (this.isBusyLoading()) {
-            return (
-                <StyledSpinnerDiv>
-                    <Spinner animation="border" role="status">
-                        <span className="sr-only">Loading...</span>
-                    </Spinner>
-                </StyledSpinnerDiv>
-            );
-        } else {
-            return (<div></div>);
-        }
-    }
-
-    render() {
-        return (
-                <StyledMainDiv id="main_div">
-                    {this.renderGlobalStyle()}
-                    {this.renderRoutes()}
-                    {this.renderSpinner()}
-                    {this.renderAlertBar()}
-                    {this.renderNavBar()}
-                    {this.renderLoopViewer()}
-                </StyledMainDiv>
-        );
-    }
-}
diff --git a/ui-react/src/LoopUI.test.js b/ui-react/src/LoopUI.test.js
deleted file mode 100644
index bfd6376e3..000000000
--- a/ui-react/src/LoopUI.test.js
+++ /dev/null
@@ -1,171 +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 LoopUI from './LoopUI';
-import OnapConstants from './utils/OnapConstants';
-
-import LoopCache from './api/LoopCache';
-import LoopActionService from './api/LoopActionService';
-import LoopService from './api/LoopService';
-
-describe('Verify LoopUI', () => {
-	beforeEach(() => {
-		fetch.resetMocks();
-		fetch.mockImplementation(() => {
-			return Promise.resolve({
-				ok: true,
-				status: 200,
-				text: () => "testUser"
-
-			});
-		});
-	})
-
-	const loopCache = new LoopCache({
-		"name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca",
-		"components": {
-			"POLICY": {
-				"componentState": {
-					"stateName": "UNKNOWN",
-					"description": "The policies defined have NOT yet been created on the policy engine"
-				}
-			},
-			"DCAE": {
-				"componentState": {
-					"stateName": "BLUEPRINT_DEPLOYED",
-					"description": "The DCAE blueprint has been found in the DCAE inventory but not yet instancianted for this loop"
-				}
-			}
-		}
-	});
-
-	it('Test the render method', async () => {
-		const flushPromises = () => new Promise(setImmediate);
-
-		const component = shallow(<LoopUI />)
-		component.setState({
-			loopName: "testLoopName",
-			showSucAlert: false,
-			showFailAlert: false 
-		});
-		await flushPromises();
-		expect(component).toMatchSnapshot();
-	});
-
-	test('Test closeLoop method', () => {
-		const historyMock = { push: jest.fn() };
-		const component = shallow(<LoopUI history={historyMock}/>)
-		const instance = component.instance();
-		instance.closeLoop();
-			
-		expect(component.state('loopName')).toEqual(OnapConstants.defaultLoopName);
-		expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
-	})
-
-	test('Test loadLoop method refresh suc', async () => {
-		const historyMock = { push: jest.fn() };
-		LoopService.getLoop = jest.fn().mockImplementation(() => {
-			return Promise.resolve({
-				ok: true,
-				status: 200,
-				text: () => {}
-			});
-		});
-
-		LoopActionService.refreshStatus = jest.fn().mockImplementation(() => {
-			return Promise.resolve({name: "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca"});
-		});
-
-		const flushPromises = () => new Promise(setImmediate);
-		const component = shallow(<LoopUI history={historyMock}/>)
-		const instance = component.instance();
-		instance.loadLoop("LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca");
-
-		await flushPromises();
-
-		const resLoopCache = instance.getLoopCache();
-			
-		expect(resLoopCache.getComponentStates()).toBeUndefined();
-		expect(component.state('loopName')).toEqual("LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca");
-	})
-
-	test('Test loadLoop method refresh fail', async () => {
-		const historyMock = { push: jest.fn() };
-		LoopService.getLoop = jest.fn().mockImplementation(() => {
-			return Promise.resolve({
-			name: "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca",
-			"components": {
-				"POLICY": {
-					"componentState": {
-						"stateName": "UNKNOWN",
-						"description": "The policies defined have NOT yet been created on the policy engine"
-					}
-				},
-				"DCAE": {
-					"componentState": {
-						"stateName": "BLUEPRINT_DEPLOYED",
-						"description": "The DCAE blueprint has been found in the DCAE inventory but not yet instancianted for this loop"
-					}
-				}
-			}});
-		});
-
-		LoopActionService.refreshStatus = jest.fn().mockImplementation(() => {
-			return Promise.reject({error: "whatever"});
-		});
-
-		const flushPromises = () => new Promise(setImmediate);
-		const component = shallow(<LoopUI history={historyMock}/>)
-		const instance = component.instance();
-		instance.loadLoop("LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca");
-
-		await flushPromises();
-
-		const resLoopCache = instance.getLoopCache();
-			
-		expect(resLoopCache).toEqual(loopCache);
-		expect(component.state('loopName')).toEqual("LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca");
-	})
-
-	test('Test alert methods', () => {
-		const component = shallow(<LoopUI />)
-		expect(component.state('showSucAlert')).toEqual(false);
-
-		const instance = component.instance();
-		instance.showSucAlert("testAlert");
-		expect(component.state('showSucAlert')).toEqual(true);
-		expect(component.state('showFailAlert')).toEqual(false);
-		expect(component.state('showMessage')).toEqual("testAlert");
-
-		instance.disableAlert();
-			
-		expect(component.state('showSucAlert')).toEqual(false);
-		expect(component.state('showFailAlert')).toEqual(false);
-
-		instance.showFailAlert("testAlert2");
-		expect(component.state('showSucAlert')).toEqual(false);
-		expect(component.state('showFailAlert')).toEqual(true);
-		expect(component.state('showMessage')).toEqual("testAlert2");
-	})
-});
diff --git a/ui-react/src/NotFound.js b/ui-react/src/NotFound.js
deleted file mode 100644
index d4b53fd71..000000000
--- a/ui-react/src/NotFound.js
+++ /dev/null
@@ -1,36 +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'
-
-
-export default class NotFound extends React.Component {
-	render () {
-		return (
-      <div id='main'>
-      	<div class="divRow"><b>Page Not Found!</b></div>
-      	<div class="divRow">Please cick <a href="/">here</a> to go back to the main page.</div>
-      </div>
-
-		);
-	}
-}
diff --git a/ui-react/src/NotFound.test.js b/ui-react/src/NotFound.test.js
deleted file mode 100644
index 3a5fc107d..000000000
--- a/ui-react/src/NotFound.test.js
+++ /dev/null
@@ -1,36 +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 NotFound from './NotFound';
-
-describe('Verify OnapClamp', () => {
-
-	it('Test the render method',  () => {
-
-		const component = shallow(<NotFound />)
-
-		expect(component).toMatchSnapshot();
-	});
-
-});
diff --git a/ui-react/src/OnapClamp.js b/ui-react/src/OnapClamp.js
deleted file mode 100644
index 506f6e09d..000000000
--- a/ui-react/src/OnapClamp.js
+++ /dev/null
@@ -1,39 +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 LoopUI from './LoopUI'
-import { ThemeProvider } from 'styled-components';
-import { DefaultClampTheme } from './theme/globalStyle.js';
-
-export default class OnapClamp extends LoopUI {
-	
-	render() {
-		console.info("Onap Clamp UI starting");
-		return (
-		<ThemeProvider theme={DefaultClampTheme}>
-			{super.render()}
-		</ThemeProvider>);
-	}
-}
-
diff --git a/ui-react/src/OnapClamp.test.js b/ui-react/src/OnapClamp.test.js
deleted file mode 100644
index c3336a9ab..000000000
--- a/ui-react/src/OnapClamp.test.js
+++ /dev/null
@@ -1,36 +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 OnapClamp from './OnapClamp';
-
-describe('Verify OnapClamp', () => {
-
-	it('Test the render method',  () => {
-
-		const component = shallow(<OnapClamp />)
-
-		expect(component).toMatchSnapshot();
-	});
-
-});
diff --git a/ui-react/src/__snapshots__/LoopUI.test.js.snap b/ui-react/src/__snapshots__/LoopUI.test.js.snap
deleted file mode 100644
index 322c93155..000000000
--- a/ui-react/src/__snapshots__/LoopUI.test.js.snap
+++ /dev/null
@@ -1,188 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify LoopUI Test the render method 1`] = `
-<styled.div
-  id="main_div"
->
-  <Memo(l) />
-  <Route
-    path="/viewLoopTemplatesModal"
-    render={[Function]}
-  />
-  <Route
-    path="/manageDictionaries"
-    render={[Function]}
-  />
-  <Route
-    path="/viewAllPolicies"
-    render={[Function]}
-  />
-  <Route
-    path="/policyModal/:policyInstanceType/:policyName"
-    render={[Function]}
-  />
-  <Route
-    path="/createLoop"
-    render={[Function]}
-  />
-  <Route
-    path="/openLoop"
-    render={[Function]}
-  />
-  <Route
-    path="/loopProperties"
-    render={[Function]}
-  />
-  <Route
-    path="/modifyLoop"
-    render={[Function]}
-  />
-  <Route
-    path="/userInfo"
-    render={[Function]}
-  />
-  <Route
-    path="/closeLoop"
-    render={[Function]}
-  />
-  <Route
-    path="/submit"
-    render={[Function]}
-  />
-  <Route
-    path="/stop"
-    render={[Function]}
-  />
-  <Route
-    path="/restart"
-    render={[Function]}
-  />
-  <Route
-    path="/delete"
-    render={[Function]}
-  />
-  <Route
-    path="/undeploy"
-    render={[Function]}
-  />
-  <Route
-    path="/deploy"
-    render={[Function]}
-  />
-  <Route
-    path="/refreshStatus"
-    render={[Function]}
-  />
-  <div />
-  <div>
-    <Alert
-      closeLabel="Close alert"
-      dismissible={true}
-      onClose={[Function]}
-      show={false}
-      transition={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "defaultProps": Object {
-            "appear": false,
-            "in": false,
-            "mountOnEnter": false,
-            "timeout": 300,
-            "unmountOnExit": false,
-          },
-          "render": [Function],
-        }
-      }
-      variant="success"
-    />
-    <Alert
-      closeLabel="Close alert"
-      dismissible={true}
-      onClose={[Function]}
-      show={false}
-      transition={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "defaultProps": Object {
-            "appear": false,
-            "in": false,
-            "mountOnEnter": false,
-            "timeout": 300,
-            "unmountOnExit": false,
-          },
-          "render": [Function],
-        }
-      }
-      variant="danger"
-    />
-  </div>
-  <Navbar
-    collapseOnSelect={false}
-    expand={true}
-    variant="light"
-  >
-    <NavbarBrand>
-      <img
-        alt=""
-        height="50px"
-        src={null}
-        width="234px"
-      />
-      <styled.a>
-        CLAMP
-      </styled.a>
-    </NavbarBrand>
-    <NavbarToggle
-      aria-controls="responsive-navbar-nav"
-      label="Toggle navigation"
-    />
-    <MenuBar
-      loopName="testLoopName"
-    />
-    <NavbarText>
-      <styled.a>
-        Signed in as: 
-      </styled.a>
-      <Styled(Link)
-        to="/userInfo"
-      >
-        testUser
-      </Styled(Link)>
-    </NavbarText>
-  </Navbar>
-  <styled.div>
-    <styled.div>
-      Loop Viewer - 
-      testLoopName
-       - (
-      )
-    </styled.div>
-    <styled.div>
-      <withRouter(SvgGenerator)
-        clickable={true}
-        generatedFrom="INSTANCE"
-        isBusyLoading={[Function]}
-        loopCache={
-          LoopCache {
-            "loopJsonCache": Object {},
-          }
-        }
-      />
-      <LoopStatus
-        loopCache={
-          LoopCache {
-            "loopJsonCache": Object {},
-          }
-        }
-      />
-      <LoopLogs
-        loopCache={
-          LoopCache {
-            "loopJsonCache": Object {},
-          }
-        }
-      />
-    </styled.div>
-  </styled.div>
-</styled.div>
-`;
diff --git a/ui-react/src/__snapshots__/NotFound.test.js.snap b/ui-react/src/__snapshots__/NotFound.test.js.snap
deleted file mode 100644
index 86bcfd1c4..000000000
--- a/ui-react/src/__snapshots__/NotFound.test.js.snap
+++ /dev/null
@@ -1,26 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify OnapClamp Test the render method 1`] = `
-<div
-  id="main"
->
-  <div
-    class="divRow"
-  >
-    <b>
-      Page Not Found!
-    </b>
-  </div>
-  <div
-    class="divRow"
-  >
-    Please cick 
-    <a
-      href="/"
-    >
-      here
-    </a>
-     to go back to the main page.
-  </div>
-</div>
-`;
diff --git a/ui-react/src/__snapshots__/OnapClamp.test.js.snap b/ui-react/src/__snapshots__/OnapClamp.test.js.snap
deleted file mode 100644
index 353bc1173..000000000
--- a/ui-react/src/__snapshots__/OnapClamp.test.js.snap
+++ /dev/null
@@ -1,216 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify OnapClamp Test the render method 1`] = `
-<Component
-  theme={
-    Object {
-      "backgroundColor": "#eeeeee",
-      "fontDanger": "#eb238e",
-      "fontDark": "#888888",
-      "fontFamily": "Arial, Sans-serif",
-      "fontHighlight": "#ffff00",
-      "fontLight": "#ffffff",
-      "fontNormal": "black",
-      "fontSize": "16px",
-      "fontWarning": "#eb238e",
-      "loopLogsHeaderBackgroundColor": "white",
-      "loopLogsHeaderFontColor": "black",
-      "loopViewerBackgroundColor": "white",
-      "loopViewerFontColor": "yellow",
-      "loopViewerHeaderBackgroundColor": "#337ab7",
-      "loopViewerHeaderFontColor": "white",
-      "menuBackgroundColor": "white",
-      "menuFontColor": "black",
-      "menuHighlightedBackgroundColor": "#337ab7",
-      "menuHighlightedFontColor": "white",
-      "policyEditorBackgroundColor": "white",
-      "policyEditorFontSize": "13px",
-      "toscaTextareaBackgroundColor": "white",
-      "toscaTextareaFontSize": "13px",
-    }
-  }
->
-  <styled.div
-    id="main_div"
-  >
-    <Memo(l) />
-    <Route
-      path="/viewLoopTemplatesModal"
-      render={[Function]}
-    />
-    <Route
-      path="/manageDictionaries"
-      render={[Function]}
-    />
-    <Route
-      path="/viewAllPolicies"
-      render={[Function]}
-    />
-    <Route
-      path="/policyModal/:policyInstanceType/:policyName"
-      render={[Function]}
-    />
-    <Route
-      path="/createLoop"
-      render={[Function]}
-    />
-    <Route
-      path="/openLoop"
-      render={[Function]}
-    />
-    <Route
-      path="/loopProperties"
-      render={[Function]}
-    />
-    <Route
-      path="/modifyLoop"
-      render={[Function]}
-    />
-    <Route
-      path="/userInfo"
-      render={[Function]}
-    />
-    <Route
-      path="/closeLoop"
-      render={[Function]}
-    />
-    <Route
-      path="/submit"
-      render={[Function]}
-    />
-    <Route
-      path="/stop"
-      render={[Function]}
-    />
-    <Route
-      path="/restart"
-      render={[Function]}
-    />
-    <Route
-      path="/delete"
-      render={[Function]}
-    />
-    <Route
-      path="/undeploy"
-      render={[Function]}
-    />
-    <Route
-      path="/deploy"
-      render={[Function]}
-    />
-    <Route
-      path="/refreshStatus"
-      render={[Function]}
-    />
-    <div />
-    <div>
-      <Alert
-        closeLabel="Close alert"
-        dismissible={true}
-        onClose={[Function]}
-        show={false}
-        transition={
-          Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "defaultProps": Object {
-              "appear": false,
-              "in": false,
-              "mountOnEnter": false,
-              "timeout": 300,
-              "unmountOnExit": false,
-            },
-            "render": [Function],
-          }
-        }
-        variant="success"
-      />
-      <Alert
-        closeLabel="Close alert"
-        dismissible={true}
-        onClose={[Function]}
-        show={false}
-        transition={
-          Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "defaultProps": Object {
-              "appear": false,
-              "in": false,
-              "mountOnEnter": false,
-              "timeout": 300,
-              "unmountOnExit": false,
-            },
-            "render": [Function],
-          }
-        }
-        variant="danger"
-      />
-    </div>
-    <Navbar
-      collapseOnSelect={false}
-      expand={true}
-      variant="light"
-    >
-      <NavbarBrand>
-        <img
-          alt=""
-          height="50px"
-          src={null}
-          width="234px"
-        />
-        <styled.a>
-          CLAMP
-        </styled.a>
-      </NavbarBrand>
-      <NavbarToggle
-        aria-controls="responsive-navbar-nav"
-        label="Toggle navigation"
-      />
-      <MenuBar
-        loopName="Empty (NO loop loaded yet)"
-      />
-      <NavbarText>
-        <styled.a>
-          Signed in as: 
-        </styled.a>
-        <Styled(Link)
-          to="/userInfo"
-        />
-      </NavbarText>
-    </Navbar>
-    <styled.div>
-      <styled.div>
-        Loop Viewer - 
-        Empty (NO loop loaded yet)
-         - (
-        )
-      </styled.div>
-      <styled.div>
-        <withRouter(SvgGenerator)
-          clickable={true}
-          generatedFrom="INSTANCE"
-          isBusyLoading={[Function]}
-          loopCache={
-            LoopCache {
-              "loopJsonCache": Object {},
-            }
-          }
-        />
-        <LoopStatus
-          loopCache={
-            LoopCache {
-              "loopJsonCache": Object {},
-            }
-          }
-        />
-        <LoopLogs
-          loopCache={
-            LoopCache {
-              "loopJsonCache": Object {},
-            }
-          }
-        />
-      </styled.div>
-    </styled.div>
-  </styled.div>
-</Component>
-`;
diff --git a/ui-react/src/api/LoopActionService.js b/ui-react/src/api/LoopActionService.js
deleted file mode 100644
index bff812a2f..000000000
--- a/ui-react/src/api/LoopActionService.js
+++ /dev/null
@@ -1,74 +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============================================
- * ===================================================================
- *
- */
-
-export default class LoopActionService{
-
-	static performAction(cl_name, uiAction) {
-		console.info("LoopActionService perform action: " + uiAction + " closedloopName=" + cl_name);
-		const svcAction = uiAction.toLowerCase();
- 		return fetch(window.location.pathname + "restservices/clds/v2/loop/" + svcAction + "/" + cl_name, {
- 				method: 'PUT',
- 				credentials: 'same-origin'
- 			})
- 		.then(function (response) {
- 			if (response.ok) {
- 				return response.json();
- 			} else {
- 				return Promise.reject("Perform action failed with code:" + response.status);
- 			}
- 		})
- 		.then(function (data) {
-			console.info("Action Successful: " + uiAction);
- 			return data;
- 		})
- 		.catch(function(error) {
- 			console.info("Action Failure: " + uiAction);
- 			return Promise.reject(error);
- 		});
- 	}
-
-
-	static refreshStatus(cl_name) {
-		console.info("Refresh the status for closedloopName=" + cl_name);
-
-		return fetch(window.location.pathname + "restservices/clds/v2/loop/getstatus/" + cl_name, {
-			method: 'GET',
-			credentials: 'same-origin'
-		})
-		.then(function (response) {
-			if (response.ok) {
-				return response.json();
-			} else {
-				return Promise.reject("Refresh status failed with code:" + response.status);
-			}
-		})
-		.then(function (data) {
-			console.info ("Refresh status Successful");
-			return data;
-		})
-		.catch(function(error) {
-			console.info ("Refresh status failed:", error);
-			return Promise.reject(error);
-		});
- 	}
-}
diff --git a/ui-react/src/api/LoopCache.js b/ui-react/src/api/LoopCache.js
deleted file mode 100644
index 3e19b4fc7..000000000
--- a/ui-react/src/api/LoopCache.js
+++ /dev/null
@@ -1,252 +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============================================
- * ===================================================================
- *
- */
-
-export default class LoopCache {
-	loopJsonCache;
-
-	constructor(loopJson) {
-		this.loopJsonCache=loopJson;
-	}
-
-	updateMicroServiceProperties(name, newMsProperties) {
-			for (var policy in this.loopJsonCache["microServicePolicies"]) {
-				if (this.loopJsonCache["microServicePolicies"][policy]["name"] === name) {
-					this.loopJsonCache["microServicePolicies"][policy]["configurationsJson"] = newMsProperties;
-				}
-			}
-	}
-
-	updateMicroServicePdpGroup(name, pdpGroup, pdpSubgroup) {
-			for (var policy in this.loopJsonCache["microServicePolicies"]) {
-				if (this.loopJsonCache["microServicePolicies"][policy]["name"] === name) {
-					this.loopJsonCache["microServicePolicies"][policy]["pdpGroup"] = pdpGroup;
-					this.loopJsonCache["microServicePolicies"][policy]["pdpSubgroup"] = pdpSubgroup;
-				}
-			}
-	}
-
-	updateGlobalProperties(newGlobalProperties) {
-		this.loopJsonCache["globalPropertiesJson"] = newGlobalProperties;
-	}
-
-	updateOperationalPolicyProperties(name, newOpProperties) {
-		for (var policy in this.loopJsonCache["operationalPolicies"]) {
-				if (this.loopJsonCache["operationalPolicies"][policy]["name"] === name) {
-					this.loopJsonCache["operationalPolicies"][policy]["configurationsJson"] = newOpProperties;
-				}
-			}
-	}
-
-	updateOperationalPolicyPdpGroup(name, pdpGroup, pdpSubgroup) {
-		for (var policy in this.loopJsonCache["operationalPolicies"]) {
-			if (this.loopJsonCache["operationalPolicies"][policy]["name"] === name) {
-				this.loopJsonCache["operationalPolicies"][policy]["pdpGroup"] = pdpGroup;
-				this.loopJsonCache["operationalPolicies"][policy]["pdpSubgroup"] = pdpSubgroup;
-			}
-		}
-	}
-
-	getLoopName() {
-		return this.loopJsonCache["name"];
-	}
-
-	getOperationalPolicyJsonSchema() {
-		return this.loopJsonCache["operationalPolicies"]["0"]["jsonRepresentation"];
-	}
-
-	getOperationalPolicies() {
-		return this.loopJsonCache["operationalPolicies"];
-	}
-
-	getOperationalPoliciesNoJsonSchema() {
-		var operationalPolicies = JSON.parse(JSON.stringify(this.loopJsonCache["operationalPolicies"]));
-		delete operationalPolicies[0]["jsonRepresentation"];
-		return operationalPolicies;
-	}
-
-	getGlobalProperties() {
-		return this.loopJsonCache["globalPropertiesJson"];
-	}
-
-	getDcaeDeploymentProperties() {
-		return this.loopJsonCache["globalPropertiesJson"]["dcaeDeployParameters"];
-	}
-
-	getMicroServicePolicies() {
-		return this.loopJsonCache["microServicePolicies"];
-	}
-
-	getOperationalPolicyForName(name) {
-		var opProperties=this.getOperationalPolicies();
-		for (var policy in opProperties) {
-			if (opProperties[policy]["name"] === name) {
-				return opProperties[policy];
-			}
-		}
-		return null;
-	}
-
-	getOperationalPolicyPropertiesForName(name) {
-		var opConfig = this.getOperationalPolicyForName(name);
-		if (opConfig !== null) {
-			return opConfig["configurationsJson"];
-		}
-		return null;
-	}
-
-	getOperationalPolicyJsonRepresentationForName(name) {
-		var opConfig = this.getOperationalPolicyForName(name);
-		if (opConfig !== null) {
-			return opConfig["jsonRepresentation"];
-		}
-		return null;
-	}
-
-	getOperationalPolicySupportedPdpGroup(name) {
-		var opConfig=this.getOperationalPolicyForName(name);
-		if (opConfig !== null) {
-		    if (opConfig["policyModel"]["policyPdpGroup"] !== undefined && opConfig["policyModel"]["policyPdpGroup"]["supportedPdpGroups"] !== undefined) {
-			    return opConfig["policyModel"]["policyPdpGroup"]["supportedPdpGroups"];
-			}
-		}
-		return [];
-	}
-
-	getOperationalPolicyPdpGroup(name) {
-		var opConfig=this.getOperationalPolicyForName(name);
-		if (opConfig !== null) {
-			return opConfig["pdpGroup"];
-		}
-		return null;
-	}
-
-	getOperationalPolicyPdpSubgroup(name) {
-		var opConfig=this.getOperationalPolicyForName(name);
-		if (opConfig !== null) {
-			return opConfig["pdpSubgroup"];
-		}
-		return null;
-	}
-
-	getMicroServiceSupportedPdpGroup(name) {
-		var microService=this.getMicroServiceForName(name);
-		if (microService !== null) {
-		    if (microService["policyModel"]["policyPdpGroup"] !== undefined && microService["policyModel"]["policyPdpGroup"]["supportedPdpGroups"] !== undefined) {
-			    return microService["policyModel"]["policyPdpGroup"]["supportedPdpGroups"];
-			}
-		}
-		return [];
-	}
-
-	getMicroServicePdpGroup(name) {
-		var microService=this.getMicroServiceForName(name);
-		if (microService !== null) {
-			return microService["pdpGroup"];
-		}
-		return null;
-	}
-
-	getMicroServicePdpSubgroup(name) {
-		var microService=this.getMicroServiceForName(name);
-		if (microService !== null) {
-			return microService["pdpSubgroup"];
-		}
-		return null;
-	}
-
-	getMicroServiceForName(name) {
-		var msProperties=this.getMicroServicePolicies();
-		for (var policy in msProperties) {
-			if (msProperties[policy]["name"] === name) {
-				return msProperties[policy];
-			}
-		}
-		return null;
-	}
-
-	getMicroServicePropertiesForName(name) {
-		var msConfig = this.getMicroServiceForName(name);
-		if (msConfig !== null) {
-			return msConfig["configurationsJson"];
-		}
-		return null;
-	}
-
-	getMicroServiceJsonRepresentationForName(name) {
-		var msConfig = this.getMicroServiceForName(name);
-		if (msConfig !== null) {
-			return msConfig["jsonRepresentation"];
-		}
-		return null;
-	}
-
-	getResourceDetailsVfProperty() {
-		return this.loopJsonCache["modelService"]["resourceDetails"]["VF"];
-	}
-
-	getResourceDetailsVfModuleProperty() {
-		return this.loopJsonCache["modelService"]["resourceDetails"]["VFModule"];
-	}
-
-	getLoopLogsArray() {
-		return this.loopJsonCache.loopLogs;
-	}
-
-	getComputedState() {
-		return this.loopJsonCache.lastComputedState;
-	}
-
-	getComponentStates() {
-		return this.loopJsonCache.components;
-	}
-
-	getTemplateName() {
-	    if (this.getLoopTemplate() !== undefined) {
-        			return this.getLoopTemplate().name;
-        }
-	    return null;
-	}
-
-	getLoopTemplate() {
-		return this.loopJsonCache["loopTemplate"];
-	}
-
-	isOpenLoopTemplate() {
-		var loopTemplate = this.getLoopTemplate();
-		if(loopTemplate != null && loopTemplate["allowedLoopType"] === "OPEN") {
-			return true;
-		}
-		return false;
-	}
-
-	getAllLoopElementModels() {
-	    var loopTemplate = this.getLoopTemplate();
-	    var loopElementModels = [];
-	    if(loopTemplate != null) {
-	        for (var element of loopTemplate['loopElementModelsUsed']) {
-	            loopElementModels.push(element['loopElementModel'])
-	        }
-	    }
-	    return loopElementModels;
-	}
-}
diff --git a/ui-react/src/api/LoopCache.test.js b/ui-react/src/api/LoopCache.test.js
deleted file mode 100644
index 76f819c69..000000000
--- a/ui-react/src/api/LoopCache.test.js
+++ /dev/null
@@ -1,305 +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 LoopCache from '../api/LoopCache';
-
-const json = require('./LoopCacheMockFile.json');
-
-describe('Verify LoopCache functions', () => {
-    const loopCache = new LoopCache(json);
-		it('getLoopName', () => {
-      expect(loopCache.getLoopName()).toBe("LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca");
-		});
-
-    it('getOperationalPolicies', () => {
-      const opPolicy = [{
-        "name": "OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca",
-        "configurationsJson": {
-          "operational_policy": {
-            "controlLoop": {},
-            "policies": []
-          }
-        },
-        "pdpGroup": "pdpGroupTest",
-        "pdpSubgroup": "pdpSubgroupTest",
-        "jsonRepresentation": {
-        "schema": {}
-      }
-      }];
-      expect(loopCache.getOperationalPolicies()).toStrictEqual(opPolicy);
-    });
-
-    it('getOperationalPoliciesNoJsonSchema', () => {
-      const opPolicy = [{
-        "name": "OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca",
-        "configurationsJson": {
-          "operational_policy": {
-            "controlLoop": {},
-            "policies": []
-          }
-        },
-        "pdpGroup": "pdpGroupTest",
-        "pdpSubgroup": "pdpSubgroupTest",
-      }];
-      expect(loopCache.getOperationalPoliciesNoJsonSchema()).toStrictEqual(opPolicy);
-    });
-
-    it('getOperationalPolicyJsonSchema', () => {
-      const jsonSchema = {
-          "schema": {}
-      };
-
-      expect(loopCache.getOperationalPolicyJsonSchema()).toStrictEqual(jsonSchema);
-    });
-    it('getGlobalProperties', () => {
-      const globelProp = {
-        "dcaeDeployParameters": {
-          "location_id": "",
-          "service_id": "",
-          "policy_id": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca"
-        }
-      };
-      expect(loopCache.getGlobalProperties()).toStrictEqual(globelProp);
-    });
-
-    it('getDcaeDeploymentProperties', () => {
-      const deploymentProp = {
-          "location_id": "",
-          "service_id": "",
-          "policy_id": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca"
-      };
-      expect(loopCache.getDcaeDeploymentProperties()).toStrictEqual(deploymentProp);
-    });
-
-    it('getMicroServiceForName', () => {
-      const msJson = {
-          "name": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca",
-          "modelType": "onap.policies.monitoring.cdap.tca.hi.lo.app",
-          "configurationsJson": {"domain": "measurementsForVfScaling"},
-          "shared": false,
-          "pdpGroup": "pdpGroupTest",
-          "pdpSubgroup": "pdpSubgroupTest",
-          "policyModel": {"policyPdpGroup": {"supportedPdpGroups": "supportedPdpGroupsTest"}},
-          "jsonRepresentation": {"schema": {}}
-      };
-      expect(loopCache.getMicroServiceForName("TCA_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual(msJson);
-      expect(loopCache.getMicroServiceForName("TCA_h2NMX_v1_0_ResourceInstanceName1_tca_2")).toBeNull();
-    });
-
-    it('getMicroServicePropertiesForName', () => {
-      const msProp = {"domain": "measurementsForVfScaling"};
-      expect(loopCache.getMicroServicePropertiesForName("TCA_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual(msProp);
-      expect(loopCache.getMicroServicePropertiesForName("TCA_h2NMX_v1_0_ResourceInstanceName1_tca_2")).toBeNull();
-    });
-
-    it('getMicroServiceJsonRepresentationForName', () => {
-      const msJsonRepresentation = {"schema": {}};
-      expect(loopCache.getMicroServiceJsonRepresentationForName("TCA_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual(msJsonRepresentation);
-    });
-
-    it('getResourceDetailsVfProperty', () => {
-      const resourceVF = {
-        "vLoadBalancerMS 0": {
-          "resourceVendor": "Test",
-          "resourceVendorModelNumber": "",
-          "name": "vLoadBalancerMS",
-          "description": "vLBMS",
-          "invariantUUID": "1a31b9f2-e50d-43b7-89b3-a040250cf506",
-          "subcategory": "Load Balancer",
-          "category": "Application L4+",
-          "type": "VF",
-          "UUID": "b4c4f3d7-929e-4b6d-a1cd-57e952ddc3e6",
-          "version": "1.0",
-          "resourceVendorRelease": "1.0",
-          "customizationUUID": "465246dc-7748-45f4-a013-308d92922552"
-        }
-      };
-      expect(loopCache.getResourceDetailsVfProperty()).toStrictEqual(resourceVF);
-    });
-
-    it('getResourceDetailsVfModuleProperty', () => {
-      const vfModule = {
-        "Vloadbalancerms..vpkg..module-1": {
-          "vfModuleModelInvariantUUID": "ca052563-eb92-4b5b-ad41-9111768ce043",
-          "vfModuleModelVersion": "1",
-          "vfModuleModelName": "Vloadbalancerms..vpkg..module-1",
-          "vfModuleModelUUID": "1e725ccc-b823-4f67-82b9-4f4367070dbc",
-          "vfModuleModelCustomizationUUID": "1bffdc31-a37d-4dee-b65c-dde623a76e52",
-          "min_vf_module_instances": 0,
-          "vf_module_label": "vpkg",
-          "max_vf_module_instances": 1,
-          "vf_module_type": "Expansion",
-          "isBase": false,
-          "initial_count": 0,
-          "volume_group": false
-        }
-      };
-      expect(loopCache.getResourceDetailsVfModuleProperty()).toStrictEqual(vfModule);
-    });
-
-    it('getLoopLogsArray', () => {
-      const logs = [
-        {
-          "id": 1,
-          "logType": "INFO",
-          "logComponent": "CLAMP",
-          "message": "Operational policies UPDATED",
-          "logInstant": "2019-07-08T09:44:37Z"
-        }
-      ];
-      expect(loopCache.getLoopLogsArray()).toStrictEqual(logs);
-    });
-
-    it('getComponentStates', () => {
-      const component = {
-        "POLICY": {
-          "componentState": {
-            "stateName": "NOT_SENT",
-            "description": "The policies defined have NOT yet been created on the policy engine"
-          }
-        },
-        "DCAE": {
-          "componentState": {
-            "stateName": "BLUEPRINT_DEPLOYED",
-            "description": "The DCAE blueprint has been found in the DCAE inventory but not yet instancianted for this loop"
-          }
-        }
-      };
-      expect(loopCache.getComponentStates()).toStrictEqual(component);
-    });
-
-    it('getOperationalPolicyForName', () => {
-      const opPolicy = {
-      "name": "OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca",
-      "configurationsJson": {
-        "operational_policy": {
-          "controlLoop": {},
-          "policies": []
-        }
-      },
-      "pdpGroup": "pdpGroupTest",
-      "pdpSubgroup": "pdpSubgroupTest",
-      "jsonRepresentation": {
-        "schema": {}
-      }
-    };
-      expect(loopCache.getOperationalPolicyForName("OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual(opPolicy);
-      expect(loopCache.getOperationalPolicyForName("Not_Exist")).toBeNull();
-    });
-
-    it('getOperationalPolicyPropertiesForName', () => {
-      const opPolicyJson = {
-        "operational_policy": {
-          "controlLoop": {},
-          "policies": []
-        }};
-      expect(loopCache.getOperationalPolicyPropertiesForName("OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual(opPolicyJson);
-      expect(loopCache.getOperationalPolicyPropertiesForName("Not_Exist")).toBeNull();
-    });
-
-    it('getOperationalPolicyJsonRepresentationForName', () => {
-      const opPolicySchema = {
-        "schema": {}
-      };
-      expect(loopCache.getOperationalPolicyJsonRepresentationForName("OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual(opPolicySchema);
-      expect(loopCache.getOperationalPolicyJsonRepresentationForName("Not_Exist")).toBeNull();
-    });
-
-    it('getOperationalPolicySupportedPdpGroup', () => {
-      expect(loopCache.getOperationalPolicySupportedPdpGroup("Not_Exist")).toStrictEqual([]);
-    });
-
-    it('getOperationalPolicyPdpGroup', () => {
-      expect(loopCache.getOperationalPolicyPdpGroup("OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual("pdpGroupTest");
-      expect(loopCache.getOperationalPolicyPdpGroup("Not_Exist")).toBeNull();
-    });
-
-    it('getOperationalPolicyPdpSubgroup', () => {
-      expect(loopCache.getOperationalPolicyPdpSubgroup("OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual("pdpSubgroupTest");
-      expect(loopCache.getOperationalPolicyPdpSubgroup("Not_Exist")).toBeNull();
-    });
-
-    it('getMicroServiceSupportedPdpGroup', () => {
-      expect(loopCache.getMicroServiceSupportedPdpGroup("TCA_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual("supportedPdpGroupsTest");
-      expect(loopCache.getMicroServiceSupportedPdpGroup("Not_Exist")).toStrictEqual([]);
-    });
-
-    it('getMicroServicePdpGroup', () => {
-      expect(loopCache.getMicroServicePdpGroup("TCA_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual("pdpGroupTest");
-      expect(loopCache.getMicroServicePdpGroup("Not_Exist")).toBeNull();
-    });
-
-    it('getMicroServicePdpSubgroup', () => {
-      expect(loopCache.getMicroServicePdpSubgroup("TCA_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual("pdpSubgroupTest");
-      expect(loopCache.getMicroServicePdpSubgroup("Not_Exist")).toBeNull();
-    });
-
-    it('getMicroServiceJsonRepresentationForName', () => {
-      const msPolicySchema = {
-        "schema": {}
-      };
-      expect(loopCache.getMicroServiceJsonRepresentationForName("TCA_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual(msPolicySchema);
-      expect(loopCache.getMicroServiceJsonRepresentationForName("Not_Exist")).toBeNull();
-    });
-
-    it('getTemplateName', () => {
-      expect(loopCache.getTemplateName()).toStrictEqual("loopTemplateTest");
-    });
-
-    it('updateGlobalProperties', () => {
-      const newGlobalProps = {
-        "dcaeDeployParameters": {
-          "location_id": "newLocation",
-          "service_id": "newServiceId",
-          "policy_id": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca_2"
-        }
-      };
-      loopCache.updateGlobalProperties(newGlobalProps);
-      expect(loopCache.getGlobalProperties()).toStrictEqual(newGlobalProps);
-    });
-
-    it('updateOperationalPolicyProperties', () => {
-      const newOpPolicy = {
-          "operational_policy": {
-            "controlLoop": {},
-            "policies": []
-          }
-        };
-      loopCache.updateOperationalPolicyProperties("OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca",newOpPolicy);
-      expect(loopCache.getOperationalPolicyPropertiesForName("OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual(newOpPolicy);
-    });
-
-    it('updateMicroServiceProperties', () => {
-      const newMsPolicyProperties = {"domain": "measurementsForVfScalingNew"};
-      loopCache.updateMicroServiceProperties("TCA_h2NMX_v1_0_ResourceInstanceName1_tca", newMsPolicyProperties);
-      expect(loopCache.getMicroServicePropertiesForName("TCA_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual(newMsPolicyProperties);
-    });
-
-    it('updateMicroServicePdpGroup', () => {
-      const newMsPolicyProperties = {"domain": "measurementsForVfScalingNew"};
-      loopCache.updateMicroServicePdpGroup("TCA_h2NMX_v1_0_ResourceInstanceName1_tca", "pdpGroupTest1", "pdpSubgroupTest1");
-      expect(loopCache.getMicroServicePdpGroup("TCA_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual("pdpGroupTest1");
-      expect(loopCache.getMicroServicePdpGroup("Not_Exist")).toBeNull();
-      expect(loopCache.getMicroServicePdpSubgroup("TCA_h2NMX_v1_0_ResourceInstanceName1_tca")).toStrictEqual("pdpSubgroupTest1");
-      expect(loopCache.getMicroServicePdpSubgroup("Not_Exist")).toBeNull();
-    });
- });
diff --git a/ui-react/src/api/LoopCacheMockFile.json b/ui-react/src/api/LoopCacheMockFile.json
deleted file mode 100644
index cb9ed87b0..000000000
--- a/ui-react/src/api/LoopCacheMockFile.json
+++ /dev/null
@@ -1,125 +0,0 @@
-{
-  "name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca",
-  "dcaeBlueprintId": "typeId-3a942643-a8f7-4e54-b2c1-eea8daba2b17",
-  "globalPropertiesJson": {
-    "dcaeDeployParameters": {
-      "location_id": "",
-      "service_id": "",
-      "policy_id": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca"
-    }
-  },
-  "loopTemplate": {"name": "loopTemplateTest"},
-  "modelService": {
-    "serviceDetails": {
-      "serviceType": "",
-      "namingPolicy": "",
-      "environmentContext": "General_Revenue-Bearing",
-      "serviceEcompNaming": "true",
-      "serviceRole": "",
-      "name": "vLoadBalancerMS",
-      "description": "vLBMS",
-      "invariantUUID": "30ec5b59-4799-48d8-ac5f-1058a6b0e48f",
-      "ecompGeneratedNaming": "true",
-      "category": "Network L4+",
-      "type": "Service",
-      "UUID": "63cac700-ab9a-4115-a74f-7eac85e3fce0",
-      "instantiationType": "A-la-carte"
-    },
-    "resourceDetails": {
-      "CP": {},
-      "VL": {},
-      "VF": {
-        "vLoadBalancerMS 0": {
-          "resourceVendor": "Test",
-          "resourceVendorModelNumber": "",
-          "name": "vLoadBalancerMS",
-          "description": "vLBMS",
-          "invariantUUID": "1a31b9f2-e50d-43b7-89b3-a040250cf506",
-          "subcategory": "Load Balancer",
-          "category": "Application L4+",
-          "type": "VF",
-          "UUID": "b4c4f3d7-929e-4b6d-a1cd-57e952ddc3e6",
-          "version": "1.0",
-          "resourceVendorRelease": "1.0",
-          "customizationUUID": "465246dc-7748-45f4-a013-308d92922552"
-        }
-      },
-      "CR": {},
-      "VFC": {},
-      "PNF": {},
-      "Service": {},
-      "CVFC": {},
-      "Service Proxy": {},
-      "Configuration": {},
-      "AllottedResource": {},
-      "VFModule": {
-        "Vloadbalancerms..vpkg..module-1": {
-          "vfModuleModelInvariantUUID": "ca052563-eb92-4b5b-ad41-9111768ce043",
-          "vfModuleModelVersion": "1",
-          "vfModuleModelName": "Vloadbalancerms..vpkg..module-1",
-          "vfModuleModelUUID": "1e725ccc-b823-4f67-82b9-4f4367070dbc",
-          "vfModuleModelCustomizationUUID": "1bffdc31-a37d-4dee-b65c-dde623a76e52",
-          "min_vf_module_instances": 0,
-          "vf_module_label": "vpkg",
-          "max_vf_module_instances": 1,
-          "vf_module_type": "Expansion",
-          "isBase": false,
-          "initial_count": 0,
-          "volume_group": false
-        }
-      }
-    }
-  },
-  "lastComputedState": "DESIGN",
-  "components": {
-    "POLICY": {
-      "componentState": {
-        "stateName": "NOT_SENT",
-        "description": "The policies defined have NOT yet been created on the policy engine"
-      }
-    },
-    "DCAE": {
-      "componentState": {
-        "stateName": "BLUEPRINT_DEPLOYED",
-        "description": "The DCAE blueprint has been found in the DCAE inventory but not yet instancianted for this loop"
-      }
-    }
-  },
-  "operationalPolicies": [
-    {
-      "name": "OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca",
-      "configurationsJson": {
-        "operational_policy": {
-          "controlLoop": {},
-          "policies": []
-        }
-      },
-      "pdpGroup": "pdpGroupTest",
-      "pdpSubgroup": "pdpSubgroupTest",
-      "jsonRepresentation": {
-        "schema": {}
-      }
-    }
-  ],
-  "microServicePolicies": [
-    {
-      "name": "TCA_h2NMX_v1_0_ResourceInstanceName1_tca",
-      "modelType": "onap.policies.monitoring.cdap.tca.hi.lo.app",
-      "configurationsJson": {"domain": "measurementsForVfScaling"},
-      "shared": false,
-      "pdpGroup": "pdpGroupTest",
-      "pdpSubgroup": "pdpSubgroupTest",
-      "policyModel": {"policyPdpGroup": {"supportedPdpGroups": "supportedPdpGroupsTest"}},
-      "jsonRepresentation": {"schema": {}}
-    }
-  ],
-  "loopLogs": [
-    {
-      "id": 1,
-      "logType": "INFO",
-      "logComponent": "CLAMP",
-      "message": "Operational policies UPDATED",
-      "logInstant": "2019-07-08T09:44:37Z"
-    }
-  ]
-}
diff --git a/ui-react/src/api/LoopService.js b/ui-react/src/api/LoopService.js
deleted file mode 100644
index 96bb8a0a7..000000000
--- a/ui-react/src/api/LoopService.js
+++ /dev/null
@@ -1,244 +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============================================
- * ===================================================================
- *
- */
-
-export default class LoopService {
-	static getLoopNames() {
-		return fetch(window.location.pathname + 'restservices/clds/v2/loop/getAllNames', { method: 'GET', credentials: 'same-origin' })
-			.then(function (response) {
-				console.debug("GetLoopNames response received: ", response.status);
-				if (response.ok) {
-					return response.json();
-				} else {
-					console.error("GetLoopNames query failed");
-					return {};
-				}
-			})
-			.catch(function (error) {
-				console.error("GetLoopNames error received", error);
-				return {};
-			});
-	}
-
-	static createLoop(loopName, templateName) {
-		return fetch(window.location.pathname + 'restservices/clds/v2/loop/create/' + loopName + '?templateName=' + templateName, {
-			method: 'POST',
-			headers: {
-				"Content-Type": "application/json"
-			},
-			credentials: 'same-origin'
-		})
-			.then(function (response) {
-				console.debug("CreateLoop response received: ", response.status);
-				return response.json();
-			})
-			.catch(function (error) {
-				console.error("CreateLoop error received", error);
-				return "";
-			});
-	}
-
-	static getLoop(loopName) {
-		return fetch(window.location.pathname + 'restservices/clds/v2/loop/' + loopName, {
-			method: 'GET',
-			headers: {
-				"Content-Type": "application/json"
-			},
-			credentials: 'same-origin'
-		})
-			.then(function (response) {
-				console.debug("GetLoop response received: ", response.status);
-				if (response.ok) {
-					return response.json();
-				} else {
-					console.error("GetLoop query failed");
-					return {};
-				}
-			})
-			.catch(function (error) {
-				console.error("GetLoop error received", error);
-				return {};
-			});
-	}
-
-	static setMicroServiceProperties(loopName, jsonData) {
-		return fetch(window.location.pathname + 'restservices/clds/v2/loop/updateMicroservicePolicy/' + loopName, {
-			method: 'POST',
-			credentials: 'same-origin',
-			headers: {
-				"Content-Type": "application/json"
-			},
-			body: JSON.stringify(jsonData)
-		})
-			.then(function (response) {
-				console.debug("updateMicroservicePolicy response received: ", response.status);
-				if (response.ok) {
-					return response.text();
-				} else {
-					console.error("updateMicroservicePolicy query failed");
-					return "";
-				}
-			})
-			.catch(function (error) {
-				console.error("updateMicroservicePolicy error received", error);
-				return "";
-			});
-	}
-	
-	static setOperationalPolicyProperties(loopName, jsonData) {
-		return fetch(window.location.pathname + 'restservices/clds/v2/loop/updateOperationalPolicies/' + loopName, {
-			method: 'POST',
-			credentials: 'same-origin',
-			headers: {
-				"Content-Type": "application/json"
-			},
-			body: JSON.stringify(jsonData)
-		})
-			.then(function (response) {
-				console.debug("updateOperationalPolicies response received: ", response.status);
-				if (response.ok) {
-					return response.text();
-				} else {
-					console.error("updateOperationalPolicies query failed");
-					return "";
-				}
-			})
-			.catch(function (error) {
-				console.error("updateOperationalPolicies error received", error);
-				return "";
-			});
-	}
-
-	static updateGlobalProperties(loopName, jsonData) {
-		return fetch(window.location.pathname + 'restservices/clds/v2/loop/updateGlobalProperties/' + loopName, {
-			method: 'POST',
-			credentials: 'same-origin',
-			headers: {
-				"Content-Type": "application/json"
-			},
-			body: JSON.stringify(jsonData)
-		})
-			.then(function (response) {
-				console.debug("updateGlobalProperties response received: ", response.status);
-				if (response.ok) {
-					return response.text();
-				} else {
-					console.error("updateGlobalProperties query failed");
-					return "";
-				}
-			})
-			.catch(function (error) {
-				console.error("updateGlobalProperties error received", error);
-				return "";
-			});
-	}
-
-	static refreshOperationalPolicyJson(loopName,operationalPolicyName) {
-		return fetch(window.location.pathname + 'restservices/clds/v2/loop/refreshOperationalPolicyJsonSchema/' + loopName + '/' + operationalPolicyName, {
-			method: 'PUT',
-			headers: {
-				"Content-Type": "application/json"
-			},
-			credentials: 'same-origin'
-		})
-			.then(function (response) {
-				console.debug("Refresh Operational Policy Json Schema response received: ", response.status);
-				if (response.ok) {
-					return response.json();
-				} else {
-					console.error("Refresh Operational Policy Json Schema query failed");
-					return {};
-				}
-			})
-			.catch(function (error) {
-				console.error("Refresh Operational Policy Json Schema error received", error);
-				return {};
-			});
-	}
-
-		static refreshMicroServicePolicyJson(loopName,microServicePolicyName) {
-    		return fetch(window.location.pathname + 'restservices/clds/v2/loop/refreshMicroServicePolicyJsonSchema/' + loopName + '/' + microServicePolicyName, {
-    			method: 'PUT',
-    			headers: {
-    				"Content-Type": "application/json"
-    			},
-    			credentials: 'same-origin'
-    		})
-    			.then(function (response) {
-    				console.debug("Refresh Operational Policy Json Schema response received: ", response.status);
-    				if (response.ok) {
-    					return response.json();
-    				} else {
-    					console.error("Refresh Operational Policy Json Schema query failed");
-    					return {};
-    				}
-    			})
-    			.catch(function (error) {
-    				console.error("Refresh Operational Policy Json Schema error received", error);
-    				return {};
-    			});
-    }
-
-	static addOperationalPolicyType(loopName, policyType, policyVersion) {
-		return fetch(window.location.pathname + 'restservices/clds/v2/loop/addOperationaPolicy/' + loopName + '/policyModel/' + policyType +'/' + policyVersion , {
-			method: 'PUT',
-			headers: {
-				"Content-Type": "application/json"
-			},
-			credentials: 'same-origin'
-		})
-				.then(function (response) {
-				console.debug("Add Operational Policy response received: ", response.status);
-				if (response.ok) {
-					return response.json();
-				} else {
-					return response.text();
-				}
-			})
-			.catch(function (error) {
-				console.error("Add Operational Policy query failed");
-				throw new Error(error);
-			})
-	}
-
-	static removeOperationalPolicyType(loopName, policyType, policyVersion, policyName) {
-		return fetch(window.location.pathname + 'restservices/clds/v2/loop/removeOperationaPolicy/' + loopName + '/policyModel/' + policyType +'/' + policyVersion + '/' + policyName , {
-			method: 'PUT',
-			headers: {
-				"Content-Type": "application/json"
-			},
-			credentials: 'same-origin'
-		})
-				.then(function (response) {
-					console.debug("Remove Operational Policy response received: ", response.status);
-				if (response.ok) {
-					return response.json();
-				} else {
-					console.error("Remove Operational Policy query failed");
-					return {};
-				}
-			})
-			.catch(function (error) {
-				console.error("Remove Operational Policy error received", error);
-				return {};
-			});
-	}
-}
diff --git a/ui-react/src/api/PoliciesListCache.js b/ui-react/src/api/PoliciesListCache.js
deleted file mode 100644
index 30c9348d0..000000000
--- a/ui-react/src/api/PoliciesListCache.js
+++ /dev/null
@@ -1,34 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP CLAMP
- * ================================================================================
- * Copyright (C) 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============================================
- * ===================================================================
- *
- */
-
-export default class PoliciesListCache {
-    policiesJsonCache;
-
-    constructor(policiesJson) {
-        this.policiesJsonCache=policiesJson;
-    }
-
-    getAllPolicies() {
-        return this.policiesJsonCache["policies"];
-    }
-}
diff --git a/ui-react/src/api/PoliciesListCacheMockFile.json b/ui-react/src/api/PoliciesListCacheMockFile.json
deleted file mode 100644
index 5c6bd5b6b..000000000
--- a/ui-react/src/api/PoliciesListCacheMockFile.json
+++ /dev/null
@@ -1,215 +0,0 @@
-{
-  "policies": [
-    {
-      "MICROSERVICE_vLoadBalancerMS_v1_0_tcagen2_1_0_0_AV0": {
-        "type": "onap.policies.monitoring.tcagen2",
-        "type_version": "1.0.0",
-        "properties": {
-          "tca.policy": {
-            "domain": "measurementsForVfScaling",
-            "metricsPerEventName": [
-              {
-                "policyScope": "DCAE",
-                "thresholds": [
-                  {
-                    "version": "1.0.2",
-                    "severity": "MAJOR",
-                    "thresholdValue": 200,
-                    "closedLoopEventStatus": "ONSET",
-                    "closedLoopControlName": "LOOP_test",
-                    "direction": "LESS_OR_EQUAL",
-                    "fieldPath": "$.event.measurementsForVfScalingFields.vNicPerformanceArray[*].receivedTotalPacketsDelta"
-                  }
-                ],
-                "eventName": "vLoadBalancer",
-                "policyVersion": "v0.0.1",
-                "controlLoopSchemaType": "VM",
-                "policyName": "DCAE.Config_tca-hi-lo"
-              }
-            ]
-          }
-        },
-        "name": "MICROSERVICE_vLoadBalancerMS_v1_0_tcagen2_1_0_0_AV0",
-        "version": "1.0.0",
-        "metadata": {
-          "policy-id": "MICROSERVICE_vLoadBalancerMS_v1_0_tcagen2_1_0_0_AV0",
-          "policy-version": "1.0.0"
-        },
-        "pdpGroupInfo": {
-          "pdpGroup": "pdpGroup2",
-          "pdpSubGroup": "subGroup2"
-        },
-        "supportedPdpGroups": [
-          {
-            "pdpGroup2": [
-              "subGroup2",
-              "subGroup3"
-            ]
-          }
-        ]
-      }
-    },
-    {
-      "OPERATIONAL_vLoadBalancerMS_v1_0_Drools_1_0_0_7xd": {
-        "type": "onap.policies.controlloop.operational.common.Drools",
-        "type_version": "1.0.0",
-        "properties": {
-          "abatement": false,
-          "operations": [
-            {
-              "failure_retries": "final_failure_retries",
-              "id": "test1",
-              "failure_timeout": "final_failure_timeout",
-              "failure": "final_failure",
-              "operation": {
-                "payload": {
-                  "artifact_name": "baseconfiguration",
-                  "artifact_version": "1.0.0",
-                  "mode": "async",
-                  "data": "{\"resource-assignment-properties\":{\"request-id\":\"\",\"service-instance-id\":\"\",\"hostname\":\"\",\"request-info\":{\"prop1\":\"\",\"prop2\":\"\"}}}"
-                },
-                "target": {
-                  "entityIds": {
-                    "resourceID": "Vloadbalancerms..vdns..module-3",
-                    "modelInvariantId": "4c10ba9b-f88f-415e-9de3-5d33336047fa",
-                    "modelVersionId": "4fa73b49-8a6c-493e-816b-eb401567b720",
-                    "modelName": "Vloadbalancerms..vdns..module-3",
-                    "modelVersion": "1",
-                    "modelCustomizationId": "bafcdab0-801d-4d81-9ead-f464640a38b1"
-                  },
-                  "targetType": "VNF"
-                },
-                "actor": "SDNR",
-                "operation": "BandwidthOnDemand"
-              },
-              "failure_guard": "final_failure_guard",
-              "retries": 0,
-              "timeout": 0,
-              "failure_exception": "final_failure_exception",
-              "description": "test",
-              "success": "final_success"
-            }
-          ],
-          "trigger": "test1",
-          "timeout": 0,
-          "id": "LOOP_test"
-        },
-        "name": "OPERATIONAL_vLoadBalancerMS_v1_0_Drools_1_0_0_7xd",
-        "version": "1.0.0",
-        "metadata": {
-          "policy-id": "OPERATIONAL_vLoadBalancerMS_v1_0_Drools_1_0_0_7xd",
-          "policy-version": "1.0.0"
-        },
-        "pdpGroupInfo": {
-          "pdpGroup": "pdpGroup2",
-          "pdpSubGroup": "subGroup3"
-        },
-        "supportedPdpGroups": [
-          {
-            "pdpGroup2": [
-              "subGroup2",
-              "subGroup3"
-            ]
-          }
-        ]
-      }
-    },
-    {
-      "SDNC_Policy.ONAP_NF_NAMING_TIMESTAMP": {
-        "type": "onap.policies.Naming",
-        "type_version": "1.0.0",
-        "properties": {
-          "naming-models": [
-            {
-              "naming-type": "VNF",
-              "naming-recipe": "AIC_CLOUD_REGION|DELIMITER|CONSTANT|DELIMITER|TIMESTAMP",
-              "name-operation": "to_lower_case()",
-              "naming-properties": [
-                {
-                  "property-name": "AIC_CLOUD_REGION"
-                },
-                {
-                  "property-name": "CONSTANT",
-                  "property-value": "onap-nf"
-                },
-                {
-                  "property-name": "TIMESTAMP"
-                },
-                {
-                  "property-value": "-",
-                  "property-name": "DELIMITER"
-                }
-              ]
-            },
-            {
-              "naming-type": "VNFC",
-              "naming-recipe": "VNF_NAME|DELIMITER|NFC_NAMING_CODE|DELIMITER|SEQUENCE",
-              "name-operation": "to_lower_case()",
-              "naming-properties": [
-                {
-                  "property-name": "VNF_NAME"
-                },
-                {
-                  "property-name": "SEQUENCE",
-                  "increment-sequence": {
-                    "max": "zzz",
-                    "scope": "ENTIRETY",
-                    "start-value": "1",
-                    "length": "3",
-                    "increment": "1",
-                    "sequence-type": "alpha-numeric"
-                  }
-                },
-                {
-                  "property-name": "NFC_NAMING_CODE"
-                },
-                {
-                  "property-value": "-",
-                  "property-name": "DELIMITER"
-                }
-              ]
-            },
-            {
-              "naming-type": "VF-MODULE",
-              "naming-recipe": "VNF_NAME|DELIMITER|VF_MODULE_LABEL|DELIMITER|VF_MODULE_TYPE|DELIMITER|SEQUENCE",
-              "name-operation": "to_lower_case()",
-              "naming-properties": [
-                {
-                  "property-name": "VNF_NAME"
-                },
-                {
-                  "property-value": "-",
-                  "property-name": "DELIMITER"
-                },
-                {
-                  "property-name": "VF_MODULE_LABEL"
-                },
-                {
-                  "property-name": "VF_MODULE_TYPE"
-                },
-                {
-                  "property-name": "SEQUENCE",
-                  "increment-sequence": {
-                    "max": "zzz",
-                    "scope": "PRECEEDING",
-                    "start-value": "1",
-                    "length": "3",
-                    "increment": "1",
-                    "sequence-type": "alpha-numeric"
-                  }
-                }
-              ]
-            }
-          ],
-          "policy-instance-name": "ONAP_NF_NAMING_TIMESTAMP"
-        },
-        "name": "SDNC_Policy.ONAP_NF_NAMING_TIMESTAMP",
-        "version": "1.0.0",
-        "metadata": {
-          "policy-id": "SDNC_Policy.ONAP_NF_NAMING_TIMESTAMP",
-          "policy-version": "1.0.0"
-        }
-      }
-    }
-  ]
-}
\ No newline at end of file
diff --git a/ui-react/src/api/PolicyService.js b/ui-react/src/api/PolicyService.js
deleted file mode 100644
index 855d44167..000000000
--- a/ui-react/src/api/PolicyService.js
+++ /dev/null
@@ -1,96 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP POLICY-CLAMP
- * ================================================================================
- * Copyright (C) 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============================================
- * ===================================================================
- *
- */
-
-export default class PolicyService {
-  static getPoliciesList() {
-    return fetch(window.location.pathname + 'restservices/clds/v2/policies', {
-        method: 'GET',
-        credentials: 'same-origin'
-        })
-        .then(function(response) {
-            console.debug("getPoliciesList response received: ", response.status);
-            if (response.ok) {
-                console.info("getPoliciesList query successful");
-                return response.json();
-            } else {
-                return response.text().then(responseBody => {
-                    throw new Error("HTTP " + response.status + "," + responseBody);
-                })
-            }
-        })
-        .catch(function(error) {
-            console.error("getPoliciesList error occurred ", error);
-            alert("getPoliciesList error occurred " + error);
-            return undefined;
-        })
-  }
-  static createNewPolicy(policyModelType, policyModelVersion, policyName, policyVersion, policyJson) {
-    return fetch(window.location.pathname + 'restservices/clds/v2/policies/' + policyModelType + '/'
-                    + policyModelVersion + '/' + policyName + '/' + policyVersion, {
-            method: 'POST',
-            credentials: 'same-origin',
-            headers: {
-                "Content-Type": "application/json"
-            },
-            body: JSON.stringify(policyJson)
-        })
-        .then(function (response) {
-            console.debug("createNewPolicy response received: ", response.status);
-            if (response.ok) {
-                console.info("createNewPolicy query successful");
-                return response.text();
-            } else {
-               return response.text().then(responseBody => {
-                    throw new Error("HTTP " + response.status + "," + responseBody);
-                })
-            }
-        })
-        .catch(function (error) {
-            console.error("createNewPolicy error occurred ", error);
-            alert ("createNewPolicy error occurred " + error);
-            return undefined;
-        });
-  }
-  static deletePolicy(policyModelType, policyModelVersion, policyName, policyVersion) {
-    return fetch(window.location.pathname + 'restservices/clds/v2/policies/' + policyModelType + '/'
-        + policyModelVersion + '/' + policyName + '/' + policyVersion, {
-            method: 'DELETE',
-            credentials: 'same-origin'
-        })
-        .then(function (response) {
-            console.debug("deletePolicy response received: ", response.status);
-            if (response.ok) {
-                console.info("deletePolicy query successful");
-                return response.text();
-            } else {
-                return response.text().then(responseBody => {
-                    throw new Error("HTTP " + response.status + "," + responseBody);
-                })
-            }
-        })
-        .catch(function (error) {
-            console.error("deletePolicy error occurred ", error);
-            alert ("deletePolicy error occurred " + error);
-            return undefined;
-        });
-  }
-}
diff --git a/ui-react/src/api/PolicyToscaService.js b/ui-react/src/api/PolicyToscaService.js
deleted file mode 100644
index c54e768a9..000000000
--- a/ui-react/src/api/PolicyToscaService.js
+++ /dev/null
@@ -1,136 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP 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============================================
- * ===================================================================
- *
- */
-
-export default class PolicyToscaService {
-  static getToscaPolicyModels() {
-    return fetch(window.location.pathname + 'restservices/clds/v2/policyToscaModels', { method: 'GET', credentials: 'same-origin' })
-      .then(function (response) {
-        console.debug("getToscaPolicyModels response received: ", response.status);
-        if (response.ok) {
-          return response.json();
-        } else {
-          console.error("getToscaPolicyModels query failed");
-          return {};
-        }
-      })
-      .catch(function (error) {
-        console.error("getToscaPolicyModels error received", error);
-        return {};
-      });
-  }
-
-  static getToscaPolicyModelYaml(policyModelType, policyModelVersion) {
-        return fetch(window.location.pathname + 'restservices/clds/v2/policyToscaModels/yaml/' + policyModelType + "/" + policyModelVersion, {
-            method: 'GET',
-            credentials: 'same-origin'
-        })
-            .then(function (response) {
-                console.debug("getToscaPolicyModelYaml response received: ", response.status);
-                if (response.ok) {
-                    return response.json();
-                } else {
-                    console.error("getToscaPolicyModelYaml query failed");
-                    return "";
-                }
-            })
-            .catch(function (error) {
-                console.error("getToscaPolicyModelYaml error received", error);
-                return "";
-            });
- }
-
- static getToscaPolicyModel(policyModelType, policyModelVersion) {
-         return fetch(window.location.pathname + 'restservices/clds/v2/policyToscaModels/' + policyModelType + "/" + policyModelVersion, {
-             method: 'GET',
-             credentials: 'same-origin'
-         })
-             .then(function (response) {
-                 console.debug("getToscaPolicyModel response received: ", response.status);
-                 if (response.ok) {
-                     return response.json();
-                 } else {
-                     console.error("getToscaPolicyModel query failed");
-                     return {};
-                 }
-             })
-             .catch(function (error) {
-                 console.error("getToscaPolicyModel error received", error);
-                 return {};
-             });
-  }
-
-  static createPolicyModelFromToscaModel(jsonData) {
-       return fetch(window.location.pathname + 'restservices/clds/v2/policyToscaModels', {
-           method: 'POST',
-           credentials: 'same-origin',
-           headers: {
-             "Content-Type": "a",
-           },
-           body: JSON.stringify(jsonData)
-         })
-         .then(function(response) {
-           console.debug("createPolicyModelFromToscaModel response received: ", response.status);
-           if (response.ok) {
-             var message = {
-               status: response.status,
-               message: 'Tosca Policy Model successfully uploaded'
-             };
-             return message;
-           } else {
-             console.error("createPolicyModelFromToscaModel failed");
-             return response.text();
-           }
-         })
-         .catch(function(error) {
-           console.error("createPolicyModelFromToscaModel error received", error);
-           return "";
-         });
-     }
-
-     static updatePolicyModelTosca(policyModelType, policyModelVersion, jsonData) {
-         return fetch(window.location.pathname + 'restservices/clds/v2/policyToscaModels/' + policyModelType + '/' + policyModelVersion, {
-             method: 'PUT',
-             credentials: 'same-origin',
-             headers: {
-               "Content-Type": "a",
-             },
-             body: JSON.stringify(jsonData)
-           })
-           .then(function(response) {
-             console.debug("updatePolicyModelTosca response received: ", response.status);
-             if (response.ok) {
-               var message = {
-                 status: response.status,
-                 message: 'Tosca Policy Model successfully uploaded'
-               };
-               return message;
-             } else {
-               console.error("updatePolicyModelTosca failed");
-               return response.text();
-             }
-           })
-           .catch(function(error) {
-             console.error("updatePolicyModelTosca error received", error);
-             return "";
-           });
-       }
-}
diff --git a/ui-react/src/api/TemplateService.js b/ui-react/src/api/TemplateService.js
deleted file mode 100644
index 08436f2b8..000000000
--- a/ui-react/src/api/TemplateService.js
+++ /dev/null
@@ -1,197 +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============================================
- * ===================================================================
- *
- */
-
-export default class TemplateService {
-
-        static getLoopNames() {
-                return fetch(window.location.pathname + 'restservices/clds/v2/loop/getAllNames', { method: 'GET', credentials: 'same-origin' })
-                        .then(function (response) {
-                                console.debug("getLoopNames response received: ", response.status);
-                                if (response.ok) {
-                                        return response.json();
-                                } else {
-                                        console.error("getLoopNames query failed");
-                                        return {};
-                                }
-                        })
-                        .catch(function (error) {
-                                console.error("getLoopNames error received", error);
-                                return {};
-                        });
-        }
-
-	static getAllLoopTemplates() {
-	    return fetch(window.location.pathname + 'restservices/clds/v2/templates', { method: 'GET', credentials: 'same-origin', })
-	        .then(function (response) {
-	            console.debug("getAllLoopTemplates response received: ", response.status);
-	            if (response.ok) {
-	                return response.json();
-	            } else {
-	                console.error("getAllLoopTemplates query failed");
-	                return {};
-	            }
-	        })
-	        .catch(function (error) {
-	            console.error("getAllLoopTemplates error received", error);
-	            return {};
-	        });
-	    }
-
-	static getDictionary() {
-	    return fetch(window.location.pathname + 'restservices/clds/v2/dictionary/', { method: 'GET', credentials: 'same-origin', })
-	      .then(function (response) {
-	        console.debug("getDictionary response received: ", response.status);
-	        if (response.ok) {
-	          return response.json();
-	        } else {
-	          console.error("getDictionary query failed");
-	          return {};
-	        }
-	      })
-	      .catch(function (error) {
-	        console.error("getDictionary error received", error);
-	        return {};
-	      });
-	  }
-
-	  static getDictionaryElements(dictionaryName) {
-	    return fetch(window.location.pathname + 'restservices/clds/v2/dictionary/' + dictionaryName, {
-	      method: 'GET',
-	      headers: {
-	        "Content-Type": "application/json",
-	      },
-	      credentials: 'same-origin',
-	    })
-	      .then(function (response) {
-	        console.debug("getDictionaryElements response received: ", response.status);
-	        if (response.ok) {
-	          return response.json();
-	        } else {
-	          console.error("getDictionaryElements query failed");
-	          return {};
-	        }
-	      })
-	      .catch(function (error) {
-	        console.error("getDictionaryElements error received", error);
-	        return {};
-	      });
-	  }
-
-	  static insDictionary(jsonData) {
-	    console.log("dictionaryName is", jsonData.name)
-	    return fetch(window.location.pathname + 'restservices/clds/v2/dictionary/', {
-	      method: 'PUT',
-	      credentials: 'same-origin',
-	      headers: {
-	        "Content-Type": "application/json",
-	      },
-	      body: JSON.stringify(jsonData)
-	    })
-	      .then(function (response) {
-	        console.debug("insDictionary response received: ", response.status);
-	        if (response.ok) {
-	          return response.status;
-	        } else {
-	          var errorMessage = response.status;
-	          console.error("insDictionary query failed", response.status);
-	          return errorMessage;
-	        }
-	      })
-	      .catch(function (error) {
-	        console.error("insDictionary error received", error);
-	        return "";
-	      });
-	  }
-
-	  static insDictionaryElements(jsonData) {
-	    console.log("dictionaryName is", jsonData.name)
-	    return fetch(window.location.pathname + 'restservices/clds/v2/dictionary/' + jsonData.name, {
-	      method: 'PUT',
-	      credentials: 'same-origin',
-	      headers: {
-	        "Content-Type": "application/json",
-	      },
-	      body: JSON.stringify(jsonData)
-	    })
-	      .then(function (response) {
-	        console.debug("insDictionary response received: ", response.status);
-	        if (response.ok) {
-	          return response.status;
-	        } else {
-	          var errorMessage = response.status;
-	          console.error("insDictionary query failed", response.status);
-	          return errorMessage;
-	        }
-	      })
-	      .catch(function (error) {
-	        console.error("insDictionary error received", error);
-	        return "";
-	      });
-	  }
-
-	  static deleteDictionary(dictionaryName) {
-	    console.log("inside templaemenu service", dictionaryName)
-	    return fetch(window.location.pathname + 'restservices/clds/v2/dictionary/' + dictionaryName, {
-	      method: 'DELETE',
-	      headers: {
-	        "Content-Type": "application/json",
-	      },
-	      credentials: 'same-origin',
-	    })
-	      .then(function (response) {
-	        console.debug("deleteDictionary response received: ", response.status);
-	        if (response.ok) {
-	          return response.status;
-	        } else {
-	          console.error("deleteDictionary query failed");
-	          return {};
-	        }
-	      })
-	      .catch(function (error) {
-	        console.error("deleteDictionary error received", error);
-	        return {};
-	      });
-	  }
-
-	  static deleteDictionaryElements(dictionaryData) {
-	    return fetch(window.location.pathname + 'restservices/clds/v2/dictionary/' + dictionaryData.name + '/elements/' + dictionaryData.shortName , {
-	      method: 'DELETE',
-	      headers: {
-	        "Content-Type": "application/json",
-	      },
-	      credentials: 'same-origin',
-	    })
-	      .then(function (response) {
-	        console.debug("deleteDictionary response received: ", response.status);
-	        if (response.ok) {
-	          return response.status;
-	        } else {
-	          console.error("deleteDictionary query failed");
-	          return {};
-	        }
-	      })
-	      .catch(function (error) {
-	        console.error("deleteDictionary error received", error);
-	        return {};
-	      });
-	  }
-    }
diff --git a/ui-react/src/api/UserService.js b/ui-react/src/api/UserService.js
deleted file mode 100644
index 5fb4aa6b4..000000000
--- a/ui-react/src/api/UserService.js
+++ /dev/null
@@ -1,74 +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============================================
- * ===================================================================
- *
- */
-
-export default class UserService {
-	static notLoggedUserName='Anonymous';
-	static login() {
-		return fetch(window.location.pathname + 'restservices/clds/v1/user/getUser', {
-				method: 'GET',
-				credentials: 'same-origin'
-			})
-		.then(function (response) {
-			console.debug("getUser response received, status code:", response.status);
-			if (response.ok) {
-				return response.text();
-			} else {
-				console.error("getUser response is nok");
-				return UserService.notLoggedUserName;
-			}
-		})
-		.then(function (data) {
-			console.info ("User connected:",data)
-			return data;
-		})
-		.catch(function(error) {
-			console.warn("getUser error received, user set to: ",UserService.notLoggedUserName);
-			console.error("getUser error:",error);
-			return UserService.notLoggedUserName;
-		});
-	}
-
-	static getUserInfo() {
-		return fetch(window.location.pathname + 'restservices/clds/v2/clampInformation', {
-				method: 'GET',
-				credentials: 'same-origin'
-			})
-		.then(function (response) {
-			console.debug("getUserInfo response received, status code:", response.status);
-			if (response.ok) {
-				return response.json();
-			} else {
-			    return {}
-			}
-		})
-		.then(function (data) {
-			console.info ("User info received:",data)
-			return data;
-		})
-		.catch(function(error) {
-			console.warn("getUserInfo error received, user set to: ",UserService.notLoggedUserName);
-			console.error("getUserInfo error:",error);
-			return {};
-		});
-	}
-}
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 1caa22dc7..000000000
--- a/ui-react/src/components/dialogs/Loop/CreateLoopModal.test.js
+++ /dev/null
@@ -1,139 +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';
-
-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 2155977f6..000000000
--- a/ui-react/src/components/dialogs/Loop/DeployLoopModal.js
+++ /dev/null
@@ -1,179 +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 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"];
-		let initialKey;
-		Object.keys(deployJsonList)
-			.filter((obj) => Object.keys(deployJsonList).indexOf(obj) === 0)
-			.map(obj =>
-				initialKey = obj
-		);
-		return initialKey;
-	}
-	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).map((item,key) =>
-			indents.push(<Tab eventKey={item} title={item}>
-				{this.renderDeployParam(deployJsonList[item])}
-				</Tab>)
-		);
-		return indents;
-	}
-	renderDeployParam(deployJson) {
-		var indents = [];
-		Object.keys(deployJson).map((item,key) =>
-		indents.push(<FormStyled>
-				<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 5154a880b..000000000
--- a/ui-react/src/components/dialogs/Loop/ModifyLoopModal.js
+++ /dev/null
@@ -1,254 +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();
-	}
-
-	componentWillReceiveProps(newProps) {
-		this.setState({
-			loopCache: newProps.loopCache,
-			temporaryPropertiesJson: JSON.parse(JSON.stringify(newProps.loopCache.getGlobalProperties()))
-		});
-	}
-
-	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 4779ced0d..000000000
--- a/ui-react/src/components/dialogs/Loop/__snapshots__/DeployLoopModal.test.js.snap
+++ /dev/null
@@ -1,83 +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"
-      title="testMs"
-    >
-      <Styled(FormGroup)>
-        <FormLabel
-          column={false}
-          srOnly={false}
-        >
-          location_id
-        </FormLabel>
-        <FormControl
-          defaultValue=""
-          name="location_id"
-          onChange={[Function]}
-          type="text"
-        />
-      </Styled(FormGroup)>
-      <Styled(FormGroup)>
-        <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)>
-`;
diff --git a/ui-react/src/components/dialogs/ManageDictionaries/ManageDictionaries.js b/ui-react/src/components/dialogs/ManageDictionaries/ManageDictionaries.js
deleted file mode 100644
index 90bbc887c..000000000
--- a/ui-react/src/components/dialogs/ManageDictionaries/ManageDictionaries.js
+++ /dev/null
@@ -1,631 +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, { forwardRef } from 'react';
-import Button from 'react-bootstrap/Button';
-import Modal from 'react-bootstrap/Modal';
-import Row from 'react-bootstrap/Row';
-import Col from 'react-bootstrap/Col';
-import styled from 'styled-components';
-import TemplateMenuService from '../../../api/TemplateService';
-import CsvToJson from '../../../utils/CsvToJson';
-import MaterialTable, {MTableToolbar} from "material-table";
-import IconButton from '@material-ui/core/IconButton';
-import Tooltip from '@material-ui/core/Tooltip';
-import AddBox from '@material-ui/icons/AddBox';
-import ArrowUpward from '@material-ui/icons/ArrowUpward';
-import Check from '@material-ui/icons/Check';
-import ChevronLeft from '@material-ui/icons/ChevronLeft';
-import VerticalAlignTopIcon from '@material-ui/icons/VerticalAlignTop';
-import VerticalAlignBottomIcon from '@material-ui/icons/VerticalAlignBottom';
-import ChevronRight from '@material-ui/icons/ChevronRight';
-import Clear from '@material-ui/icons/Clear';
-import DeleteOutline from '@material-ui/icons/DeleteOutline';
-import Edit from '@material-ui/icons/Edit';
-import FilterList from '@material-ui/icons/FilterList';
-import FirstPage from '@material-ui/icons/FirstPage';
-import LastPage from '@material-ui/icons/LastPage';
-import Remove from '@material-ui/icons/Remove';
-import Search from '@material-ui/icons/Search';
-import ViewColumn from '@material-ui/icons/ViewColumn';
-
-
-const ModalStyled = styled(Modal)`
-	@media (min-width: 1200px) {
-		.modal-xl {
-			max-width: 96%;
-		}
-	}
-	background-color: transparent;
-`
-
-const MTableToolbarStyled = styled(MTableToolbar)`
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-`
-const ColPullLeftStyled = styled(Col)`
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	margin-left: -40px;
-`
-
-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'};
-
-let dictList = [];
-let subDictFlag = false;
-
-function SelectSubDictType(props) {
-	const {onChange} = props;
-	const selectedValues = (e) => {
-		let options = e.target.options;
-		let SelectedDictTypes = '';
-		for (let dictType = 0, values = options.length; dictType < values; dictType++) {
-			if (options[dictType].selected) {
-				SelectedDictTypes = SelectedDictTypes.concat(options[dictType].value);
-				SelectedDictTypes = SelectedDictTypes.concat('|');
-			}
-		}
-		SelectedDictTypes = SelectedDictTypes.slice(0,-1);
-		onChange(SelectedDictTypes);
-	}
-	// When the subDictFlag is true, we need to disable selection of element "type"
-	return(
-		<div>
-			<select disabled={subDictFlag} multiple={true} onChange={selectedValues}>
-				<option value="string">string</option>
-				<option value="number">number</option>
-				<option value="datetime">datetime</option>
-				<option value="map">map</option>
-				<option value="json">json</option>
-			</select>
-		</div>
-	);
-}
-
-function SubDict(props) {
-	const {onChange} = props;
-	const subDicts = [];
-	subDicts.push('none');
-	if (dictList !== undefined  && dictList.length > 0) {
-		let item;
-        	for(item in dictList) {
-            		if(dictList[item].secondLevelDictionary === 1) {
-                		subDicts.push(dictList[item].name);
-            		}
-        	}
-	}
-	let optionItems = [];
-	for (let i=0; i<subDicts.length; ++i) {
-		if (i === 0) {
-			optionItems.push(<option selected key={subDicts[i]}>{subDicts[i]}</option>);
-		} else {
-			optionItems.push(<option key={subDicts[i]}>{subDicts[i]}</option>);
-		}
-	}
-
- 	function selectedValue (e) {
-		onChange(e.target.value);
-	}
-	// When the subDictFlag is true, we need to disable selection of
-	// the sub-dictionary flag
-	return(
-			<select disabled={subDictFlag} onChange={selectedValue} >
-				{optionItems}
-			</select>
-	);
-}
-
-export default class ManageDictionaries extends React.Component {
-	constructor(props, context) {
-		super(props, context);
-		this.addDictionaryElementRow = this.addDictionaryElementRow.bind(this);
-		this.addDictionaryRow = this.addDictionaryRow.bind(this);
-		this.addReplaceDictionaryRequest = this.addReplaceDictionaryRequest.bind(this);
-		this.clickHandler = this.clickHandler.bind(this);
-		this.deleteDictionaryElementRow = this.deleteDictionaryElementRow.bind(this);
-		this.deleteDictionaryRequest = this.deleteDictionaryRequest.bind(this);
-		this.deleteDictionaryRow = this.deleteDictionaryRow.bind(this);
-		this.fileSelectedHandler = this.fileSelectedHandler.bind(this);
-		this.getDictionaries = this.getDictionaries.bind(this);
-		this.getDictionaryElements = this.getDictionaryElements.bind(this);
-		this.handleClose = this.handleClose.bind(this);
-		this.handleDictionaryRowClick = this.handleDictionaryRowClick.bind(this);
-		this.importCsvData = this.importCsvData.bind(this);
-		this.updateDictionaryElementRow = this.updateDictionaryElementRow.bind(this);
-		this.updateDictionaryElementsRequest = this.updateDictionaryElementsRequest.bind(this);
-		this.updateDictionaryRow = this.updateDictionaryRow.bind(this);
-		this.readOnly = props.readOnly !== undefined ? props.readOnly : false;
-		this.state = {
-			show: true,
-			currentSelectedDictionary: null,
-			exportFilename: '',
-			content: null,
-			dictionaryElements: [],
-			tableIcons: {
-				Add: forwardRef((props, ref) => <AddBox {...props} ref={ref} />),
-				Delete: forwardRef((props, ref) => <DeleteOutline {...props} ref={ref} />),
-				DetailPanel: forwardRef((props, ref) => <ChevronRight {...props} ref={ref} />),
-				Edit: forwardRef((props, ref) => <Edit {...props} ref={ref} />),
-				Check: forwardRef((props, ref) => <Check {...props} ref={ref} />),
-				Clear: forwardRef((props, ref) => <Clear {...props} ref={ref} />),
-				Export: forwardRef((props, ref) => <VerticalAlignBottomIcon {...props} ref={ref} />),
-				Filter: forwardRef((props, ref) => <FilterList {...props} ref={ref} />),
-				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} />),
-				ThirdStateCheck: forwardRef((props, ref) => <Remove {...props} ref={ref} />),
-				ViewColumn: forwardRef((props, ref) => <ViewColumn {...props} ref={ref} />)
-			},
-			dictColumns: [
-				{
-					title: "Dictionary Name", field: "name",editable: 'onAdd',
-					cellStyle: cellStyle,
-					headerStyle: headerStyle
-				},
-				{
-					title: "Sub Dictionary ?", field: "secondLevelDictionary", lookup: {0: 'No', 1: 'Yes'},
-					cellStyle: cellStyle,
-					headerStyle: headerStyle
-				},
-				{
-					title: "Dictionary Type", field: "subDictionaryType",lookup: {string: 'string', number: 'number'},
-					cellStyle: cellStyle,
-					headerStyle: headerStyle
-				},
-				{
-					title: "Updated By", field: "updatedBy", editable: 'never',
-					cellStyle: cellStyle,
-					headerStyle: headerStyle
-				},
-				{
-					title: "Last Updated Date", field: "updatedDate", editable: 'never',
-					cellStyle: cellStyle,
-					headerStyle: headerStyle
-				}
-			],
-			dictElementColumns: [
-				{
-					title: "Element Short Name", field: "shortName",editable: 'onAdd',
-					cellStyle: cellStyle,
-					headerStyle: headerStyle
-				},
-				{
-					title: "Element Name", field: "name",
-					cellStyle: cellStyle,
-					headerStyle: headerStyle
-				},
-				{
-					title: "Element Description", field: "description",
-					cellStyle: cellStyle,
-					headerStyle: headerStyle
-				},
-				{
-					title: "Element Type", field: "type",
-					editComponent: props => (
-						<div>
-							<SelectSubDictType  value={props.value} onChange={props.onChange} />
-						</div>
-					),
-					cellStyle: cellStyle,
-					headerStyle: headerStyle
-				},
-				{
-					title: "Sub-Dictionary", field: "subDictionary",
-					editComponent: props => (
-						 <div>
-							 <SubDict value={props.value} onChange={props.onChange} />
-						 </div>
-				      ),
-				    cellStyle: cellStyle,
-				    headerStyle: headerStyle
-				},
-				{
-					title: "Updated By", field: "updatedBy", editable: 'never',
-					cellStyle: cellStyle,
-					headerStyle: headerStyle
-				},
-				{
-					title: "Updated Date", field: "updatedDate", editable: 'never',
-					cellStyle: cellStyle,
-					headerStyle: headerStyle
-				}
-			]
-		}
-	}
-
-	componentDidMount() {
-		this.getDictionaries();
-	}
-
-	getDictionaries() {
-		TemplateMenuService.getDictionary().then(arrayOfdictionaries => {
-			this.setState({ dictionaries: arrayOfdictionaries, currentSelectedDictionary: null })
-			// global variable setting used functional components in this file
-			dictList = arrayOfdictionaries;
-		}).catch(() => {
-			console.error('Failed to retrieve dictionaries');
-			this.setState({ dictionaries: [], currentSelectedDictionary: null })
-		});
-	}
-
-	getDictionaryElements(dictionaryName) {
-		TemplateMenuService.getDictionaryElements(dictionaryName).then(dictionaryElements => {
-			this.setState({ dictionaryElements: dictionaryElements.dictionaryElements} );
-			this.setState({ currentSelectDictionary: dictionaryName });
-		}).catch(() => console.error('Failed to retrieve dictionary elements'))
-	}
-
-	clickHandler(rowData) {
-		this.getDictionaries();
-	}
-
-	handleClose() {
-		this.setState({ show: false });
-		this.props.history.push('/');
-	}
-
-	addReplaceDictionaryRequest(dictionaryEntry) {
-		TemplateMenuService.insDictionary(dictionaryEntry)
-		.then(resp => {
-			this.getDictionaries();
-		})
-		.catch(() => console.error('Failed to insert new dictionary elements'));
-	}
-
-	updateDictionaryElementsRequest(dictElements) {
-		let reqData = { "name": this.state.currentSelectedDictionary, 'dictionaryElements': dictElements };
-		TemplateMenuService.insDictionaryElements(reqData)
-		.then(resp => { this.getDictionaryElements(this.state.currentSelectedDictionary) })
-		.catch(() => console.error('Failed to update dictionary elements'));
-	}
-
-	deleteDictionaryRequest(dictionaryName) {
-		TemplateMenuService.deleteDictionary(dictionaryName)
-		.then(resp => {
-			this.getDictionaries();
-		})
-		.catch(() => console.error('Failed to delete dictionary'));
-	}
-
-	deleteDictionaryElementRequest(dictionaryName, elemenetShortName) {
-		TemplateMenuService.deleteDictionaryElements({ 'name': dictionaryName, 'shortName': elemenetShortName })
-		.then(resp => {
-			this.getDictionaryElements(dictionaryName);
-		})
-		.catch(() => console.error('Failed to delete dictionary elements'));
-	}
-
-	fileSelectedHandler = (event) => {
-
-		if (event.target.files[0].type === 'text/csv' || event.target.files[0].type === 'application/vnd.ms-excel') {
-			if (event.target.files && event.target.files[0]) {
-				const reader = new FileReader();
-				reader.onload = (e) => {
-					let errorMessages = this.importCsvData(reader.result);
-					if (errorMessages !== '') {
-						alert(errorMessages);
-					}
-				}
-				reader.readAsText(event.target.files[0]);
-			}
-		} else {
-			alert('Please upload .csv extention files only.');
-		}
-	}
-
-	importCsvData(rawCsvData) {
-
-		const jsonKeyNames = [ 'shortName', 'name', 'description', 'type', 'subDictionary' ];
-		const userHeaderNames = [ 'Element Short Name', 'Element Name', 'Element Description', 'Element Type', 'Sub-Dictionary'  ];
-		const validTypes = ['string','number','datetime','json','map'];
-
-		let mandatory;
-
-		if (subDictFlag) {
-			mandatory = [ true, true, true, false, false ];
-		} else {
-			mandatory = [ true, true, true, true, false ];
-		}
-
-		let result = CsvToJson(rawCsvData, ',', '||||', userHeaderNames, jsonKeyNames, mandatory);
-
-		let errorMessages = result.errorMessages;
-		let jsonObjArray = result.jsonObjArray;
-
-		let validTypesErrorMesg = '';
-
-		for (let i=0; i < validTypes.length; ++i) {
-			if (i === 0) {
-				validTypesErrorMesg = validTypes[i];
-			} else {
-				validTypesErrorMesg += ',' + validTypes[i];
-			}
-		}
-
-		if (errorMessages !== '') {
-			return errorMessages;
-		}
-
-		// Perform further checks on data that is now in JSON form
-		let subDictionaries = [];
-
-		// NOTE: dictList is a global variable  maintained faithfully
-		//       by the getDictionaries() method outside this import
-		//       functionality.
-		let item;
-		for (item in dictList) {
-			if (dictList[item].secondLevelDictionary === 1) {
-				subDictionaries.push(dictList[item].name);
-			}
-		};
-
-		// Check for valid Sub-Dictionary and Element Type values
-		subDictionaries = subDictionaries.toString();
-		let row = 2;
-		let dictElem;
-		for (dictElem of jsonObjArray) {
-			let itemKey;
-			for (itemKey in dictElem){
-				let value = dictElem[itemKey].trim();
-				let keyIndex = jsonKeyNames.indexOf(itemKey);
-				if (itemKey === 'shortName' && /[^a-zA-Z0-9-_.]/.test(value)) {
-					errorMessages += '\n' + userHeaderNames[keyIndex] +
-						' at row #' + row +
-						' can only contain alphanumeric characters and periods, hyphens or underscores';
-				}
-				if (itemKey === 'type' && validTypes.indexOf(value) < 0) {
-					errorMessages += '\nInvalid value of "' + value + '" for "' + userHeaderNames[keyIndex] + '" at row #' + row;
-					errorMessages += '\nValid types are: ' + validTypesErrorMesg;
-				}
-				if (value !== "" && itemKey === 'subDictionary' && subDictionaries.indexOf(value) < 0) {
-					errorMessages += '\nInvalid Sub-Dictionary value of "' + value + '" at row #' + row;
-				}
-			}
-			++row;
-		}
-		if (errorMessages === '') {
-			// We made it through all the checks. Send it to back end
-			this.updateDictionaryElementsRequest(jsonObjArray);
-		}
-
-		return errorMessages;
-	}
-
-	addDictionaryRow(newData) {
-		let validData = true;
-		return new Promise((resolve, reject) => {
-			setTimeout(() => {
-					if (/[^a-zA-Z0-9-_.]/.test(newData.name)) {
-						validData = false;
-						alert('Please enter alphanumeric input. Only allowed special characters are:(period, hyphen, underscore)');
-						reject();
-					}
-					for (let i = 0; i < this.state.dictionaries.length; i++) {
-						if (this.state.dictionaries[i].name === newData.name) {
-							validData = false;
-							alert(newData.name + ' dictionary name already exists')
-							reject();
-						}
-					}
-					if (validData) {
-						this.addReplaceDictionaryRequest(newData);
-					}
-					resolve();
-			}, 1000);
-		});
-	}
-
-
-	updateDictionaryRow(newData, oldData) {
-		let validData = true;
-		return new Promise((resolve, reject) => {
-			setTimeout(() => {
-				if (/[^a-zA-Z0-9-_.]/.test(newData.name)) {
-					validData = false;
-					alert('Please enter alphanumberic input. Only allowed special characters are:(period, hyphen, underscore)');
-					reject();
-				}
-				if (validData) {
-					this.addReplaceDictionaryRequest(newData);
-				}
-				resolve();
-			}, 1000);
-		});
-	}
-
-	deleteDictionaryRow(oldData) {
-		return new Promise((resolve, reject) => {
-			setTimeout(() => {
-				this.deleteDictionaryRequest(oldData.name);
-				resolve();
-			}, 1000);
-		});
-	}
-
-	addDictionaryElementRow(newData) {
-		return new Promise((resolve, reject) => {
-			setTimeout(() => {
-				let dictionaryElements = this.state.dictionaryElements;
-				let errorMessages = '';
-				for (let i = 0; i < this.state.dictionaryElements.length; i++) {
-					if (this.state.dictionaryElements[i].shortName === newData.shortName) {
-						alert('Short Name "' + newData.shortName + '" already exists');
-						reject("");
-					}
-				}
-				// MaterialTable returns no property at all if the user has not touched a
-				// new column, so we want to add the property with an emptry string
-				// for several cases if that is the case to simplify other checks.
-				if (newData.description === undefined) {
-					newData.description = "";
-				}
-				if (newData.subDictionary === undefined) {
-					newData.subDictionary = null;
-				}
-				if (newData.type === undefined) {
-					newData.type = "";
-				}
-				if (!newData.shortName && /[^a-zA-Z0-9-_.]/.test(newData.shortName)) {
-					errorMessages += '\nShort Name is limited to alphanumeric characters and also period, hyphen, and underscore';
-				}
-				if (!newData.shortName){
-					errorMessages += '\nShort Name must be specified';
-				}
-				if (!newData.name){
-					errorMessages += '\nElement Name must be specified';
-				}
-				if (!newData.type && !subDictFlag){
-					errorMessages += '\nElement Type must be specified';
-				}
-				if (errorMessages === '') {
-					dictionaryElements.push(newData);
-					this.updateDictionaryElementsRequest([newData]);
-					resolve();
-				} else {
-					alert(errorMessages);
-					reject("");
-				}
-			}, 1000);
-		});
-	}
-
-	updateDictionaryElementRow(newData, oldData) {
-		return new Promise((resolve, reject) => {
-			setTimeout(() => {
-				let dictionaryElements = this.state.dictionaryElements;
-				let validData =  true;
-				if (!newData.type) {
-					validData = false;
-					alert('Element Type cannot be null');
-					reject();
-				}
-				if (validData) {
-					const index = dictionaryElements.indexOf(oldData);
-					dictionaryElements[index] = newData;
-					this.updateDictionaryElementsRequest([newData]);
-				}
-				resolve();
-			}, 1000);
-		});
-	}
-
-
-	deleteDictionaryElementRow(oldData) {
-		return new Promise((resolve) => {
-			setTimeout(() => {
-				this.deleteDictionaryElementRequest(this.state.currentSelectedDictionary, oldData.shortName);
-				resolve();
-			}, 1000);
-		});
-	}
-
-	handleDictionaryRowClick(event, rowData) {
-		subDictFlag = rowData.secondLevelDictionary === 1 ? true : false;
-		this.setState({
-			currentSelectedDictionary : rowData.name,
-			exportFilename: rowData.name
-		})
-		this.getDictionaryElements(rowData.name);
-	}
-
-	render() {
-		return (
-			<ModalStyled size="xl" show={this.state.show} onHide={this.handleClose} backdrop="static" keyboard={false} >
-				<Modal.Header closeButton>
-					<Modal.Title>Manage Dictionaries</Modal.Title>
-				</Modal.Header>
-				<Modal.Body>
-					{this.state.currentSelectedDictionary === null ?
-						<MaterialTable
-                        				title={"Dictionary List"}
-                        				data={this.state.dictionaries}
-                        				columns={this.state.dictColumns}
-                        				icons={this.state.tableIcons}
-                        				onRowClick={this.handleDictionaryRowClick}
-                        				options={{
-								headerStyle: rowHeaderStyle,
-                        				}}
-                        				editable={!this.readOnly ?
-								{
-									onRowAdd: this.addDictionaryRow,
-									onRowUpdate: this.updateDictionaryRow,
-									onRowDelete: this.deleteDictionaryRow
-								} : undefined }
-						/> : null
-					}
-					{this.state.currentSelectedDictionary !== null ?
-						<MaterialTable
-                        				title={'Dictionary Elements List for ' + (subDictFlag ? 'Sub-Dictionary "' : '"') + this.state.currentSelectedDictionary + '"'}
-                        				data={this.state.dictionaryElements}
-                        				columns={this.state.dictElementColumns}
-                        				icons={this.state.tableIcons}
-                        				options={{
-								exportAllData: true,
-								exportButton: true,
-								exportFileName: this.state.exportFilename,
-								headerStyle:{backgroundColor:'white',  fontSize: '15pt', text: 'bold', border: '1px solid black'}
-                        				}}
-                        				components={{
-								Toolbar: props => (
-									<Row>
-										<Col sm="11">
-											<MTableToolbarStyled {...props} />
-										</Col>
-										<ColPullLeftStyled sm="1">
-											<Tooltip title="Import" placement = "bottom">
-												<IconButton aria-label="import" disabled={this.readOnly} onClick={() => this.fileUpload.click()}>
-													<VerticalAlignTopIcon />
-												</IconButton>
-											</Tooltip>
-                                							<input type="file" ref={(fileUpload) => {this.fileUpload = fileUpload;}}
-												style={{ visibility: 'hidden', width: '1px' }} onChange={this.fileSelectedHandler} />
-										</ColPullLeftStyled>
-									</Row>
-                            					)
-                        				}}
-                        				editable={!this.readOnly ?
-								{
-                            						onRowAdd: this.addDictionaryElementRow,
-                            						onRowUpdate: this.updateDictionaryElementRow,
-                            						onRowDelete: this.deleteDictionaryElementRow
-                        					} : undefined
-							 }
-						/> : null
-					}
-					{this.state.currentSelectedDictionary !== null ? <button onClick={this.clickHandler} style={{marginTop: '25px'}}>Go Back to Dictionaries List</button>:""}
-				</Modal.Body>
-				<Modal.Footer>
-					<Button variant="secondary" type="null" onClick={this.handleClose}>Close</Button>
-				</Modal.Footer>
-			</ModalStyled>
-		);
-	}
-}
diff --git a/ui-react/src/components/dialogs/ManageDictionaries/ManageDictionaries.test.js b/ui-react/src/components/dialogs/ManageDictionaries/ManageDictionaries.test.js
deleted file mode 100644
index a4c1335d8..000000000
--- a/ui-react/src/components/dialogs/ManageDictionaries/ManageDictionaries.test.js
+++ /dev/null
@@ -1,462 +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 { mount } from 'enzyme';
-import { render } from 'enzyme';
-import ManageDictionaries from './ManageDictionaries';
-import TemplateMenuService from '../../../api/TemplateService'
-
-const TestDictionaryElements = {
-    name: "test",
-    secondLevelDictionary: 0,
-    subDictionaryType: "", 
-    dictionaryElements: [
-      {
-        shortName: "alertType",
-        name: "Alert Type",
-        description: "Type of Alert",
-        type: "string",
-        subDictionary: "", 
-        createdDate: "2020-06-12T13:58:51.443931Z",
-        updatedDate: "2020-06-13T16:27:57.084870Z",
-        updatedBy: "admin",
-        createdBy: "admin"
-      }
-    ]
-};
-
-const TestDictionaries =
-[
-  {
-    name: "test",
-    secondLevelDictionary: 0,
-    subDictionaryType: "string",
-    dictionaryElements: [ TestDictionaryElements ],
-    createdDate: "2020-06-14T21:00:33.231166Z",
-    updatedDate: "2020-06-14T21:00:33.231166Z",
-    updatedBy: "admin",
-    createdBy: "admin"
-  },
-  {
-    name: "testSub1",
-    secondLevelDictionary: 1,
-    subDictionaryType: "string",
-    dictionaryElements: [
-      {
-        shortName: "subElem",
-        name: "Sub Element",
-        description: "Sub Element Description",
-        type: "string",
-        createdDate: "2020-06-14T21:04:44.402287Z",
-        updatedDate: "2020-06-14T21:04:44.402287Z",
-        updatedBy: "admin",
-        createdBy: "admin"
-      }
-    ],
-    createdDate: "2020-06-14T21:01:16.390250Z",
-    updatedDate: "2020-06-14T21:01:16.390250Z",
-    updatedBy: "admin",
-    createdBy: "admin"
-  }
-];
-
-
-const historyMock = { push: jest.fn() };
-
-let errorMessage = '';
-
-window.alert = jest.fn().mockImplementation((mesg) => { errorMessage = mesg ; return });
-
-TemplateMenuService.getDictionary = jest.fn().mockImplementation(() => {
-	return Promise.resolve(TestDictionaries);
-});
-
-TemplateMenuService.insDictionary = jest.fn().mockImplementation(() => {
-	return Promise.resolve({ ok: true, status: 200 });
-});
-
-TemplateMenuService.deleteDictionary = jest.fn().mockImplementation(() => {
-	return Promise.resolve("200");
-});
-
-TemplateMenuService.getDictionaryElements = jest.fn().mockImplementation(() => {
-	return Promise.resolve(TestDictionaryElements);
-});
-
-TemplateMenuService.deleteDictionaryElements = jest.fn().mockImplementation(() => {
-	return Promise.resolve("200");
-});
-
-TemplateMenuService.insDictionaryElements = jest.fn().mockImplementation(() => {
-	return Promise.resolve("200");
-});
-
-
-describe('Verify ManageDictionaries', () => {
-
-	beforeEach(() => {
-		fetch.resetMocks();
-	});
-
-	it('Test API Successful', () => {
-		fetch.mockImplementationOnce(() => {
-			return Promise.resolve({
-				ok: true,
-				status: 200,
-				json: () => {
-					return Promise.resolve({
-						"name": "vtest",
-						"secondLevelDictionary": 1,
-						"subDictionaryType": "string",
-						"updatedBy": "test",
-						"updatedDate": "05-07-2019 19:09:42"
-					});
-				}
-			});
-		});
-		const component = shallow(<ManageDictionaries />);
-		expect(component).toMatchSnapshot();
-	});
-
-	it('Test API Exception', () => {
-		fetch.mockImplementationOnce(() => {
-			return Promise.resolve({
-				ok: false,
-				status: 500,
-				json: () => {
-					return Promise.resolve({
-						"name": "vtest",
-						"secondLevelDictionary": 1,
-						"subDictionaryType": "string",
-						"updatedBy": "test",
-						"updatedDate": "05-07-2019 19:09:42"
-					});
-				}
-			});
-		});
-		const component = shallow(<ManageDictionaries />);
-	});
-
-	it('Test Table icons', () => {
-
-		const component = mount(<ManageDictionaries />);
-		expect(component.find('[className="MuiSelect-icon MuiTablePagination-selectIcon"]')).toBeTruthy();
-	});
-
-	test('Test add/replace and delete dictionary requests', async () => {
-
-		const component = shallow(<ManageDictionaries history={historyMock}/>)
-		const instance = component.instance();
-
-		const flushPromises = () => new Promise(setImmediate);
-
-		instance.addReplaceDictionaryRequest({name: "newdict", secondLevelDictionary: 0, subDictionaryType: "string"});
-		instance.deleteDictionaryRequest("test");
-
-		await flushPromises();
-
-		expect(component.state('currentSelectedDictionary')).toEqual(null);
-		expect(component.state('dictionaries')).toEqual(TestDictionaries);
-	});
-
-	test('Test update dictionary row', async () => {
-
-		const component = shallow(<ManageDictionaries history={historyMock}/>)
-		const instance = component.instance();
-		const rowData = { name: "newdict", secondLevelDictionary: 0, subDictionaryType: "string" };
-
-		await expect(instance.updateDictionaryRow(rowData, rowData)).resolves.toEqual(undefined);
-
-	}, 2000);
-
-	test('Test add dictionary row', async () => {
-
-		const addReplaceRequest = jest.spyOn(ManageDictionaries.prototype,'addReplaceDictionaryRequest');
-		const component = shallow(<ManageDictionaries />)
-		const instance = component.instance();
-		const rowData = { name: "newdict", secondLevelDictionary: 0, subDictionaryType: "string" };
-
-		await instance.addDictionaryRow(rowData);
-                expect(addReplaceRequest).toHaveBeenCalledWith(rowData);
-
-	}, 2000);
-
-	test('Test add dictionary row with errors name already exists', async () => {
-
-		const component = shallow(<ManageDictionaries />)
-		const instance = component.instance();
-		let  rowData = { name: "test", secondLevelDictionary: 0, subDictionaryType: "" };
-
-		await expect(instance.addDictionaryRow(rowData)).rejects.toEqual(undefined);
-
-	}, 2000);
-
-	test('Test add dictionary row with errors illegal chars in name', async () => {
-
-		const component = shallow(<ManageDictionaries />)
-		const instance = component.instance();
-		let  rowData = { name: "test@@", secondLevelDictionary: 0, subDictionaryType: "" };
-
-		await expect(instance.addDictionaryRow(rowData)).rejects.toEqual(undefined);
-
-	}, 2000);
-
-	test('Test update dictionary row with errors illegal chars in name', async () => {
-
-		const component = shallow(<ManageDictionaries />)
-		const instance = component.instance();
-		let  rowData = { name: "test@@", secondLevelDictionary: 0, subDictionaryType: "" };
-
-		await expect(instance.updateDictionaryRow(rowData)).rejects.toEqual(undefined);
-	});
-
-
-	test('Test add dictionary row with errors (illegal chars)', async () => {
-
-		const addReplaceRequest = jest.spyOn(ManageDictionaries.prototype,'addReplaceDictionaryRequest');
-		const component = shallow(<ManageDictionaries />)
-		const instance = component.instance();
-		let  rowData = { name: "test@@", secondLevelDictionary: 0, subDictionaryType: "" };
-
-		await expect(instance.addDictionaryRow(rowData)).rejects.toEqual(undefined);
-
-	}, 2000);
-
-
-	test('Test delete dictionary row', async () => {
-
-		const deleteRequest = jest.spyOn(ManageDictionaries.prototype,'deleteDictionaryRequest');
-		const component = shallow(<ManageDictionaries />)
-		const instance = component.instance();
-		const rowData = { name: "newdict", secondLevelDictionary: 0, subDictionaryType: "string" };
-
-		await instance.deleteDictionaryRow(rowData);
-                expect(deleteRequest).toHaveBeenCalledWith("newdict");
-
-	}, 2000);
-
-	test('Test handle select dictionary row click', async () => {
-
-		const component = shallow(<ManageDictionaries />)
-		const instance = component.instance();
-		const rowData = { name: "newdict", secondLevelDictionary: 0, subDictionaryType: "string" };
-
-		instance.handleDictionaryRowClick("event", rowData);
-		expect(component.state('currentSelectedDictionary')).toEqual("newdict");
-	}, 2000);
-
-	test('Test dictionary element row add, update, delete', async () => {
-
-		const rowData = {
-			createdBy: "admin",
-			createdDate: "2020-06-15T13:59:20.467381Z",
-			description: "Description",
-			name: "Some Elem",
-			shortName: "someElem",
-			type: "string",
-			updatedBy: "admin",
-			updatedDate: "2020-06-15T13:59:20.467381Z"
-		};
-
-		const component = shallow(<ManageDictionaries/>)
-		const instance = component.instance();
-
-		const badRowData = {
-			description: "Description",
-			name: "Some Elem",
-			shortName: "someElem",
-			type: "string"
-		};
-
-                await instance.clickHandler();
-                await instance.getDictionaryElements("test");
-
-		await expect(instance.addDictionaryElementRow(rowData)).resolves.toEqual(undefined);
-		await expect(instance.updateDictionaryElementRow(rowData, rowData)).resolves.toEqual(undefined);
-		await expect(instance.deleteDictionaryElementRow(rowData)).resolves.toEqual(undefined);
-	});
-
-	test('Test dictionary element row add with errors', async () => {
-
-		const badRowData = {
-			description: "",
-			name: "",
-			shortName: "some#Elem",
-			type: ""
-		};
-
-		const component = shallow(<ManageDictionaries/>)
-		const instance = component.instance();
-
-		await expect(instance.addDictionaryElementRow(badRowData)).rejects.toEqual("");
-	});
-
-	test('Test dictionary element update with error illegal name', async () => {
-
-		const badRowData = {
-			description: "",
-			name: "test@@",
-			shortName: "some#Elem",
-			type: ""
-		};
-
-		const component = shallow(<ManageDictionaries/>)
-		const instance = component.instance();
-
-		await expect(instance.updateDictionaryElementRow(badRowData)).rejects.toEqual(undefined);
-	});
-
-	test('Test dictionary element addition with duplicate name error', async () => {
-
-		const badRowData = {
-			description: "description",
-			name: "Alert Type",
-			shortName: "alertType",
-			type: "string"
-		};
-
-		const component = shallow(<ManageDictionaries/>)
-		const instance = component.instance();
-
-		component.setState({ currentSelectedDictionary: 'test' });
-
-		await instance.getDictionaryElements();
-		await expect(instance.addDictionaryElementRow(badRowData)).rejects.toEqual("");
-	});
-
-	test('Test dictionary element addition with empty name error', async () => {
-
-		const badRowData = {
-			description: "description",
-			name: "Alert Type",
-			shortName: "",
-			type: "string"
-		};
-
-		const component = shallow(<ManageDictionaries/>)
-		const instance = component.instance();
-
-		component.setState({ currentSelectedDictionary: 'test' });
-
-		await instance.getDictionaryElements();
-		await expect(instance.addDictionaryElementRow(badRowData)).rejects.toEqual("");
-	});
-
-
-	it('Test Import CSV Sunny Day', async () => {
-
-                TemplateMenuService.insDictionaryElements = jest.fn().mockImplementation(() => {
-                        return Promise.resolve({ ok: true, status: 200 });
-                });
-
-                let rawCsvData = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-                rawCsvData += '"alertType","Alert Type","Alert Type Description","string","","admin","2020-06-11T13:56:14.927437Z"';
-
-                let expectedResult = [
-                                {
-                                        description: "Alert Type Description",
-                                        name: "Alert Type",
-                                        shortName: "alertType",
-                                        subDictionary: "",
-                                        type: "string"
-                                }
-		];
-
-		const updateDictionaryElementsRequest = jest.spyOn(ManageDictionaries.prototype,'updateDictionaryElementsRequest');
-
-		const component = shallow(<ManageDictionaries />)
-		const instance = component.instance();
-
-		await expect(instance.importCsvData(rawCsvData)).toEqual('');
-                expect(updateDictionaryElementsRequest).toHaveBeenCalledWith(expectedResult);
-	});
-
-	it('Test Import CSV Mandatory Field Check Errors', () => {
-
-                let rawCsvData = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-                rawCsvData += '"","","","","","",""';
-
-		// The empty values for all the fields in row 1 of the rawCsvData will trigger a bunch of errors.
-		// Getting Enzyme to properly match them with embedded newlines turned out to be impossible
-		// and maybe not desirable anyway; so our test for "success" here is simply that the
-		// routine returns a non-empty error string.
-
-		const component = shallow(<ManageDictionaries />)
-		const instance = component.instance();
-		expect(instance.importCsvData(rawCsvData)).not.toEqual('');
-	});
-
-	it('Test Import CSV Errors in Row Data', async () => {
-
-                TemplateMenuService.insDictionaryElements = jest.fn().mockImplementation(() => {
-                        return Promise.resolve({ ok: true, status: 200 });
-                });
-
-                let rawCsvData = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-                rawCsvData += '"alert@Type","Alert Type","Alert Type Description","strin","subby","admin","2020-06-11T13:56:14.927437Z"';
-
-                let expectedResult = [
-                                {
-                                        description: "Alert Type Description",
-                                        name: "Alert Type",
-                                        shortName: "alertType",
-                                        subDictionary: "",
-                                        type: "string"
-                                }
-		];
-
-		const updateDictionaryElementsRequest = jest.spyOn(ManageDictionaries.prototype,'updateDictionaryElementsRequest');
-
-		const component = shallow(<ManageDictionaries />)
-		const instance = component.instance();
-
-		await expect(instance.importCsvData(rawCsvData)).not.toEqual('');
-	});
-
-
-	it('Test handleClose', () => {
-		fetch.mockImplementationOnce(() => {
-			return Promise.resolve({
-				ok: true,
-				status: 200,
-				json: () => {
-					return Promise.resolve({
-						"name": "vtest",
-						"secondLevelDictionary": 1,
-						"subDictionaryType": "string",
-						"updatedBy": "test",
-						"updatedDate": "05-07-2019 19:09:42"
-					});
-				}
-			});
-		});
-		const handleClose = jest.spyOn(ManageDictionaries.prototype,'handleClose');
-		const component = shallow(<ManageDictionaries 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();
-	});
-});
diff --git a/ui-react/src/components/dialogs/ManageDictionaries/__snapshots__/ManageDictionaries.test.js.snap b/ui-react/src/components/dialogs/ManageDictionaries/__snapshots__/ManageDictionaries.test.js.snap
deleted file mode 100644
index 6b583632f..000000000
--- a/ui-react/src/components/dialogs/ManageDictionaries/__snapshots__/ManageDictionaries.test.js.snap
+++ /dev/null
@@ -1,196 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify ManageDictionaries Test API Successful 1`] = `
-<Styled(Modal)
-  backdrop="static"
-  keyboard={false}
-  onHide={[Function]}
-  show={true}
-  size="xl"
->
-  <ModalHeader
-    closeButton={true}
-    closeLabel="Close"
-  >
-    <ModalTitle>
-      Manage Dictionaries
-    </ModalTitle>
-  </ModalHeader>
-  <ModalBody>
-    <WithStyles(Component)
-      columns={
-        Array [
-          Object {
-            "cellStyle": Object {
-              "border": "1px solid black",
-            },
-            "editable": "onAdd",
-            "field": "name",
-            "headerStyle": Object {
-              "backgroundColor": "#ddd",
-              "border": "2px solid black",
-            },
-            "title": "Dictionary Name",
-          },
-          Object {
-            "cellStyle": Object {
-              "border": "1px solid black",
-            },
-            "field": "secondLevelDictionary",
-            "headerStyle": Object {
-              "backgroundColor": "#ddd",
-              "border": "2px solid black",
-            },
-            "lookup": Object {
-              "0": "No",
-              "1": "Yes",
-            },
-            "title": "Sub Dictionary ?",
-          },
-          Object {
-            "cellStyle": Object {
-              "border": "1px solid black",
-            },
-            "field": "subDictionaryType",
-            "headerStyle": Object {
-              "backgroundColor": "#ddd",
-              "border": "2px solid black",
-            },
-            "lookup": Object {
-              "number": "number",
-              "string": "string",
-            },
-            "title": "Dictionary Type",
-          },
-          Object {
-            "cellStyle": Object {
-              "border": "1px solid black",
-            },
-            "editable": "never",
-            "field": "updatedBy",
-            "headerStyle": Object {
-              "backgroundColor": "#ddd",
-              "border": "2px solid black",
-            },
-            "title": "Updated By",
-          },
-          Object {
-            "cellStyle": Object {
-              "border": "1px solid black",
-            },
-            "editable": "never",
-            "field": "updatedDate",
-            "headerStyle": Object {
-              "backgroundColor": "#ddd",
-              "border": "2px solid black",
-            },
-            "title": "Last Updated Date",
-          },
-        ]
-      }
-      editable={
-        Object {
-          "onRowAdd": [Function],
-          "onRowDelete": [Function],
-          "onRowUpdate": [Function],
-        }
-      }
-      icons={
-        Object {
-          "Add": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "Check": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "Clear": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "Delete": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "DetailPanel": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "Edit": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "Export": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "Filter": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "FirstPage": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "LastPage": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "NextPage": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "PreviousPage": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "ResetSearch": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "Search": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "SortArrow": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "ThirdStateCheck": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "ViewColumn": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-        }
-      }
-      onRowClick={[Function]}
-      options={
-        Object {
-          "headerStyle": Object {
-            "backgroundColor": "#ddd",
-            "border": "1px solid black",
-            "fontSize": "15pt",
-            "text": "bold",
-          },
-        }
-      }
-      title="Dictionary List"
-    />
-  </ModalBody>
-  <ModalFooter>
-    <Button
-      active={false}
-      disabled={false}
-      onClick={[Function]}
-      type="null"
-      variant="secondary"
-    >
-      Close
-    </Button>
-  </ModalFooter>
-</Styled(Modal)>
-`;
diff --git a/ui-react/src/components/dialogs/PerformActions.js b/ui-react/src/components/dialogs/PerformActions.js
deleted file mode 100644
index f6001e21f..000000000
--- a/ui-react/src/components/dialogs/PerformActions.js
+++ /dev/null
@@ -1,95 +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';
-
-
-export default class PerformActions extends React.Component {
-	state = {
-		loopName: this.props.loopCache.getLoopName(),
-		loopAction: this.props.loopAction
-	};
-
-	constructor(props, context) {
-		super(props, context);
-		this.refreshStatus = this.refreshStatus.bind(this);
-	}
-
-	componentWillReceiveProps(newProps) {
-		this.setState({
-			loopName: newProps.loopCache.getLoopName(),
-			loopAction: newProps.loopAction
-		});
-	}
-
-	componentDidMount() {
-		const action = this.state.loopAction;
-		const loopName = this.state.loopName;
-
-		if (action === 'delete') {
-			if (window.confirm('You are about to remove Control Loop Model "' + loopName +
-					'". Select OK to continue with deletion or Cancel to keep the model.') === false) {
-				return;
-			}
-		}
-
-		this.props.setBusyLoading(); // Alert top level to start block user clicks
-
-		LoopActionService.performAction(loopName, action)
-		.then(pars => {
-			this.props.showSucAlert("Action " + action + " successfully performed");
-			if (action === 'delete') {
-				this.props.updateLoopFunction(null);
-				this.props.history.push('/');
-			} else {
-				// refresh status and update loop logs
-				this.refreshStatus(loopName);
-			}
-		})
-		.catch(error => {
-			this.props.showFailAlert("Action " + action + " failed");
-			// refresh status and update loop logs
-			this.refreshStatus(loopName);
-		})
-		.finally(() => this.props.clearBusyLoading());
-	}
-
-	refreshStatus(loopName) {
-
-		this.props.setBusyLoading();
-
-		LoopActionService.refreshStatus(loopName)
-		.then(data => {
-			this.props.updateLoopFunction(data);
-			this.props.history.push('/');
-		})
-		.catch(error => {
-			this.props.history.push('/');
-		})
-		.finally(() => this.props.clearBusyLoading());
-	}
-
-	render() {
-		return null;
-	}
-}
diff --git a/ui-react/src/components/dialogs/PerformActions.test.js b/ui-react/src/components/dialogs/PerformActions.test.js
deleted file mode 100644
index c91c2f675..000000000
--- a/ui-react/src/components/dialogs/PerformActions.test.js
+++ /dev/null
@@ -1,90 +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 PerformActions from './PerformActions';
-import LoopCache from '../../api/LoopCache';
-import LoopActionService from '../../api/LoopActionService';
-
-describe('Verify PerformActions', () => {
-
-	const loopCache = new LoopCache({
-		"name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca"
-	});
-
-	it('Test the render method action failed', async () => {
-		const flushPromises = () => new Promise(setImmediate);
-		const historyMock = { push: jest.fn() };
-		const updateLoopFunction = jest.fn();
-		const showSucAlert = jest.fn();
-		const showFailAlert = jest.fn();
-		const setBusyLoading = jest.fn();
-		const clearBusyLoading = jest.fn();
-		
-		LoopActionService.refreshStatus = jest.fn().mockImplementation(() => {
-			return Promise.resolve({
-				ok: true,
-				status: 200,
-				json: () => {}
-			});
-		});
-		const component = shallow(<PerformActions loopCache={loopCache} 
-					loopAction="submit" history={historyMock} updateLoopFunction={updateLoopFunction} showSucAlert={showSucAlert} showFailAlert={showFailAlert} setBusyLoading={setBusyLoading} clearBusyLoading={clearBusyLoading}/>)
-		await flushPromises();
-		component.update();
-
-		expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
-	});
-
-	it('Test the render method action 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 setBusyLoading = jest.fn();
-		const clearBusyLoading = jest.fn();
-
-		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(<PerformActions loopCache={loopCache} 
-						loopAction="submit" history={historyMock} updateLoopFunction={updateLoopFunction} showSucAlert={showSucAlert} showFailAlert={showFailAlert} setBusyLoading={setBusyLoading} clearBusyLoading={clearBusyLoading}/>)
-		await flushPromises();
-		component.update();
-
-		expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
-	});
-
-});
diff --git a/ui-react/src/components/dialogs/Policy/PolicyEditor.js b/ui-react/src/components/dialogs/Policy/PolicyEditor.js
deleted file mode 100644
index f20650e26..000000000
--- a/ui-react/src/components/dialogs/Policy/PolicyEditor.js
+++ /dev/null
@@ -1,217 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP POLICY-CLAMP
- * ================================================================================
- * Copyright (C) 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 PolicyToscaService from '../../../api/PolicyToscaService';
-import { JSONEditor }  from '@json-editor/json-editor/dist/nonmin/jsoneditor.js';
-import "@fortawesome/fontawesome-free/css/all.css"
-import styled from 'styled-components';
-import Button from 'react-bootstrap/Button';
-import TextField from '@material-ui/core/TextField';
-import Alert from 'react-bootstrap/Alert';
-import PolicyService from '../../../api/PolicyService';
-import OnapUtils from '../../../utils/OnapUtils';
-import uuid from 'react-uuid';
-
-//const JSONEditor = require("@json-editor/json-editor").JSONEditor;
-const DivWhiteSpaceStyled = styled.div`
-    white-space: pre;
-`
-
-const JsonEditorDiv = styled.div`
-    margin-top: 20px;
-    background-color: ${props => props.theme.loopViewerBackgroundColor};
-    text-align: justify;
-    font-size: ${props => props.theme.policyEditorFontSize};
-    border: 1px solid #C0C0C0;
-`
-const PanelDiv = styled.div`
-    margin-top: 20px;
-    text-align: justify;
-    font-size: ${props => props.theme.policyEditorFontSize};
-    background-color: ${props => props.theme.loopViewerBackgroundColor};
-`
-
-export default class PolicyEditor extends React.Component {
-
-   state = {
-        policyModelType: this.props.policyModelType,
-        policyModelTypeVersion: this.props.policyModelTypeVersion,
-        policyName: (typeof this.props.policyName !== "undefined") ? this.props.policyName : "org.onap.policy.new",
-        policyVersion: (typeof this.props.policyVersion !== "undefined") ? this.props.policyVersion : "0.0.1",
-        policyProperties: this.props.policyProperties,
-        showSuccessAlert: false,
-        showFailAlert: false,
-        jsonEditor: null,
-        jsonEditorDivId: uuid(),
-   }
-
-   constructor(props, context) {
-        super(props, context);
-        this.createJsonEditor = this.createJsonEditor.bind(this);
-        this.getToscaModelForPolicy = this.getToscaModelForPolicy.bind(this);
-        this.disableAlert = this.disableAlert.bind(this);
-        this.handleCreateNewVersion = this.handleCreateNewVersion.bind(this);
-        this.handleChangePolicyName = this.handleChangePolicyName.bind(this);
-        this.handleChangePolicyVersion = this.handleChangePolicyVersion.bind(this);
-   }
-
-    disableAlert() {
-        this.setState ({ showSuccessAlert: false, showFailAlert: false });
-    }
-
-    customValidation(editorData) {
-        // method for sub-classes to override with customized validation
-        return [];
-    }
-
-    handleCreateNewVersion() {
-        var editorData = this.state.jsonEditor.getValue();
-        var errors = this.state.jsonEditor.validate();
-        errors = errors.concat(this.customValidation(editorData));
-
-        if (errors.length !== 0) {
-            console.error("Errors detected during policy data validation ", errors);
-            this.setState({
-                showFailAlert: true,
-                showMessage: 'Errors detected during policy data validation:\n' + OnapUtils.jsonEditorErrorFormatter(errors)
-            });
-            return;
-        } else {
-            console.info("NO validation errors found in policy data");
-            PolicyService.createNewPolicy(this.state.policyModelType, this.state.policyModelTypeVersion,
-                this.state.policyName, this.state.policyVersion, editorData).then(respPolicyCreation => {
-                if (typeof(respPolicyCreation) === "undefined") {
-                    //it indicates a failure
-                    this.setState({
-                        showFailAlert: true,
-                        showMessage: 'Policy Creation Failure'
-                    });
-                } else {
-                    this.setState({
-                        showSuccessAlert: true,
-                        showMessage: 'Policy '+ this.state.policyName + '/' + this.state.policyVersion + ' created successfully'
-                    });
-                    this.props.policyUpdateFunction();
-                }
-            })
-        }
-    }
-
-    bumpVersion(versionToBump) {
-        let semVer = versionToBump.split(".");
-        return parseInt(semVer[0])+1 + "." + semVer[1] + "." + semVer[2];
-    }
-
-   getToscaModelForPolicy() {
-        PolicyToscaService.getToscaPolicyModel(this.state.policyModelType, this.state.policyModelTypeVersion).then(respJsonPolicyTosca => {
-            if (respJsonPolicyTosca !== {}) {
-                this.setState({
-                                jsonSchemaPolicyTosca: respJsonPolicyTosca,
-                                jsonEditor: this.createJsonEditor(respJsonPolicyTosca, this.state.policyProperties),
-                            })
-            }
-        });
-   }
-
-   componentDidMount() {
-        this.getToscaModelForPolicy();
-   }
-
-   createJsonEditor(toscaModel, editorData) {
-        /*JSONEditor.defaults.themes.myBootstrap4 = JSONEditor.defaults.themes.bootstrap4.extend({
-                getTab: function(text,tabId) {
-                    var liel = document.createElement('li');
-                    liel.classList.add('nav-item');
-                    var ael = document.createElement("a");
-                    ael.classList.add("nav-link");
-                    ael.setAttribute("style",'padding:10px;max-width:160px;');
-                    ael.setAttribute("href", "#" + tabId);
-                    ael.setAttribute('data-toggle', 'tab');
-                    text.setAttribute("style",'word-wrap:break-word;');
-                    ael.appendChild(text);
-                    liel.appendChild(ael);
-                    return liel;
-                }
-            });*/
-
-        return new JSONEditor(document.getElementById(this.state.jsonEditorDivId),
-        {
-              schema: toscaModel,
-              startval: editorData,
-              //theme: 'myBootstrap4',
-              theme: 'bootstrap4',
-              iconlib: 'fontawesome5',
-              object_layout: 'grid',
-              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
-        })
-   }
-
-    handleChangePolicyName(event) {
-         this.setState({
-                  policyName: event.target.value,
-                });
-    }
-
-    handleChangePolicyVersion(event) {
-         this.setState({
-                  policyVersion: event.target.value,
-                });
-    }
-
-   render() {
-       return (
-                    <PanelDiv>
-                      <Alert variant="success" show={this.state.showSuccessAlert} onClose={this.disableAlert} dismissible>
-                          <DivWhiteSpaceStyled>
-                              {this.state.showMessage}
-                          </DivWhiteSpaceStyled>
-                      </Alert>
-                      <Alert variant="danger" show={this.state.showFailAlert} onClose={this.disableAlert} dismissible>
-                          <DivWhiteSpaceStyled>
-                              {this.state.showMessage}
-                          </DivWhiteSpaceStyled>
-                      </Alert>
-                      <TextField required id="policyName" label="Required" defaultValue={this.state.policyName}
-                        onChange={this.handleChangePolicyName} variant="outlined" size="small"/>
-                      <TextField required id="policyVersion" label="Required" defaultValue={this.state.policyVersion}
-                        onChange={this.handleChangePolicyVersion} size="small" variant="outlined"/>
-                      <Button variant="secondary" title="Create a new policy version from the defined parameters"
-                        onClick={this.handleCreateNewVersion}>Create New Version</Button>
-                      <JsonEditorDiv id={this.state.jsonEditorDivId} title="Policy Properties"/>
-                    </PanelDiv>
-       );
-   }
-}
\ No newline at end of file
diff --git a/ui-react/src/components/dialogs/Policy/PolicyModal.js b/ui-react/src/components/dialogs/Policy/PolicyModal.js
deleted file mode 100644
index 2fa0b5432..000000000
--- a/ui-react/src/components/dialogs/Policy/PolicyModal.js
+++ /dev/null
@@ -1,360 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP POLICY-CLAMP
- * ================================================================================
- * Copyright (C) 2020-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 Button from 'react-bootstrap/Button';
-import Form from 'react-bootstrap/Form';
-import Col from 'react-bootstrap/Col';
-import Row from 'react-bootstrap/Row';
-import Select from 'react-select';
-import Modal from 'react-bootstrap/Modal';
-import styled from 'styled-components';
-import LoopService from '../../../api/LoopService';
-import LoopCache from '../../../api/LoopCache';
-import { JSONEditor }  from '@json-editor/json-editor/dist/jsoneditor.js';
-import "@fortawesome/fontawesome-free/css/all.css"
-import Alert from 'react-bootstrap/Alert';
-import OnapConstant from '../../../utils/OnapConstants';
-import OnapUtils from '../../../utils/OnapUtils';
-
-const ModalStyled = styled(Modal)`
-    background-color: transparent;
-`
-
-const DivWhiteSpaceStyled = styled.div`
-    white-space: pre;
-`
-
-export default class PolicyModal extends React.Component {
-
-    state = {
-        show: true,
-        loopCache: this.props.loopCache,
-        jsonEditor: null,
-        policyName: this.props.match.params.policyName,
-        // This is to indicate whether it's an operational or config policy (in terms of loop instance)
-        policyInstanceType: this.props.match.params.policyInstanceType,
-        pdpGroup: null,
-        pdpGroupList: [],
-        pdpSubgroupList: [],
-        chosenPdpGroup: '',
-        chosenPdpSubgroup: '',
-        showSucAlert: false,
-        showFailAlert: false
-    };
-
-    constructor(props, context) {
-        super(props, context);
-        this.handleClose = this.handleClose.bind(this);
-        this.handleSave = this.handleSave.bind(this);
-        this.renderJsonEditor = this.renderJsonEditor.bind(this);
-        this.handlePdpGroupChange = this.handlePdpGroupChange.bind(this);
-        this.handlePdpSubgroupChange = this.handlePdpSubgroupChange.bind(this);
-        this.createJsonEditor = this.createJsonEditor.bind(this);
-        this.handleRefresh = this.handleRefresh.bind(this);
-        this.disableAlert =  this.disableAlert.bind(this);
-        this.renderPdpGroupDropDown = this.renderPdpGroupDropDown.bind(this);
-        this.renderOpenLoopMessage = this.renderOpenLoopMessage.bind(this);
-        this.renderModalTitle = this.renderModalTitle.bind(this);
-        this.readOnly = props.readOnly !== undefined ? props.readOnly : false;
-    }
-
-    handleSave() {
-        var editorData = this.state.jsonEditor.getValue();
-        var errors = this.state.jsonEditor.validate();
-        errors = errors.concat(this.customValidation(editorData, this.state.loopCache.getTemplateName()));
-
-        if (errors.length !== 0) {
-            console.error("Errors detected during policy data validation ", errors);
-            this.setState({
-                showFailAlert: true,
-                showMessage: 'Errors detected during policy data validation:\n' + OnapUtils.jsonEditorErrorFormatter(errors)
-            });
-            return;
-        }
-        else {
-            console.info("NO validation errors found in policy data");
-            if (this.state.policyInstanceType === OnapConstant.microServiceType) {
-                this.state.loopCache.updateMicroServiceProperties(this.state.policyName, editorData);
-                this.state.loopCache.updateMicroServicePdpGroup(this.state.policyName, this.state.chosenPdpGroup, this.state.chosenPdpSubgroup);
-                LoopService.setMicroServiceProperties(this.state.loopCache.getLoopName(), this.state.loopCache.getMicroServiceForName(this.state.policyName)).then(resp => {
-                    this.setState({ show: false });
-                    this.props.history.push('/');
-                    this.props.loadLoopFunction(this.state.loopCache.getLoopName());
-                });
-            } else if (this.state.policyInstanceType === OnapConstant.operationalPolicyType) {
-                this.state.loopCache.updateOperationalPolicyProperties(this.state.policyName, editorData);
-                this.state.loopCache.updateOperationalPolicyPdpGroup(this.state.policyName, this.state.chosenPdpGroup, this.state.chosenPdpSubgroup);
-                LoopService.setOperationalPolicyProperties(this.state.loopCache.getLoopName(), this.state.loopCache.getOperationalPolicies()).then(resp => {
-                    this.setState({ show: false });
-                    this.props.history.push('/');
-                    this.props.loadLoopFunction(this.state.loopCache.getLoopName());
-                });
-            }
-        }
-    }
-
-    customValidation(editorData, templateName) {
-        // method for sub-classes to override with customized validation
-        return [];
-    }
-
-    handleClose() {
-        this.setState({ show: false });
-        this.props.history.push('/');
-    }
-
-    componentDidMount() {
-        this.renderJsonEditor();
-    }
-
-    componentDidUpdate() {
-        if (this.state.showSucAlert === true || this.state.showFailAlert === true) {
-            let modalElement = document.getElementById("policyModal")
-            if (modalElement) {
-                modalElement.scrollTo(0, 0);
-            }
-        }
-    }
-
-    createJsonEditor(toscaModel, editorData) {
-        /*JSONEditor.defaults.themes.myBootstrap4 = JSONEditor.defaults.themes.bootstrap4.extend({
-                getTab: function(text,tabId) {
-                    var liel = document.createElement('li');
-                    liel.classList.add('nav-item');
-                    var ael = document.createElement("a");
-                    ael.classList.add("nav-link");
-                    ael.setAttribute("style",'padding:10px;max-width:160px;');
-                    ael.setAttribute("href", "#" + tabId);
-                    ael.setAttribute('data-toggle', 'tab');
-                    text.setAttribute("style",'word-wrap:break-word;');
-                    ael.appendChild(text);
-                    liel.appendChild(ael);
-                    return liel;
-                }
-            });*/
-        return new JSONEditor(document.getElementById("editor"),
-        {   schema: toscaModel,
-              startval: editorData,
-              theme: 'bootstrap4',
-              iconlib: 'fontawesome5',
-              object_layout: 'grid',
-              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
-        })
-    }
-
-    renderJsonEditor() {
-        console.debug("Rendering PolicyModal ", this.state.policyName);
-        var toscaModel = {};
-        var editorData = {};
-        var pdpGroupValues = {};
-        var chosenPdpGroupValue, chosenPdpSubgroupValue;
-        if (this.state.policyInstanceType === OnapConstant.microServiceType) {
-            toscaModel = this.state.loopCache.getMicroServiceJsonRepresentationForName(this.state.policyName);
-            editorData = this.state.loopCache.getMicroServicePropertiesForName(this.state.policyName);
-            pdpGroupValues = this.state.loopCache.getMicroServiceSupportedPdpGroup(this.state.policyName);
-            chosenPdpGroupValue = this.state.loopCache.getMicroServicePdpGroup(this.state.policyName);
-            chosenPdpSubgroupValue = this.state.loopCache.getMicroServicePdpSubgroup(this.state.policyName);
-        } else if (this.state.policyInstanceType === OnapConstant.operationalPolicyType) {
-            toscaModel = this.state.loopCache.getOperationalPolicyJsonRepresentationForName(this.state.policyName);
-            editorData = this.state.loopCache.getOperationalPolicyPropertiesForName(this.state.policyName);
-            pdpGroupValues = this.state.loopCache.getOperationalPolicySupportedPdpGroup(this.state.policyName);
-            chosenPdpGroupValue = this.state.loopCache.getOperationalPolicyPdpGroup(this.state.policyName);
-            chosenPdpSubgroupValue = this.state.loopCache.getOperationalPolicyPdpSubgroup(this.state.policyName);
-        }
-
-        if (toscaModel == null) {
-            return;
-        }
-
-        var pdpSubgroupValues = [];
-        if (typeof(chosenPdpGroupValue) !== "undefined") {
-            var selectedPdpGroup =    pdpGroupValues.filter(entry => (Object.keys(entry)[0] === chosenPdpGroupValue));
-            pdpSubgroupValues = selectedPdpGroup[0][chosenPdpGroupValue].map((pdpSubgroup) => { return { label: pdpSubgroup, value: pdpSubgroup } });
-        }
-        this.setState({
-                        jsonEditor: this.createJsonEditor(toscaModel,editorData),
-                        pdpGroup: pdpGroupValues,
-                        pdpGroupList: pdpGroupValues.map(entry => {
-                                                      return { label: Object.keys(entry)[0], value: Object.keys(entry)[0] };
-                                              }),
-                        pdpSubgroupList: pdpSubgroupValues,
-                        chosenPdpGroup: chosenPdpGroupValue,
-                        chosenPdpSubgroup: chosenPdpSubgroupValue
-                    })
-    }
-
-    handlePdpGroupChange(e) {
-        var selectedPdpGroup =    this.state.pdpGroup.filter(entry => (Object.keys(entry)[0] === e.value));
-        const pdpSubgroupValues = selectedPdpGroup[0][e.value].map((pdpSubgroup) => { return { label: pdpSubgroup, value: pdpSubgroup } });
-        if (this.state.chosenPdpGroup !== e.value) {
-            this.setState({
-                chosenPdpGroup: e.value,
-                chosenPdpSubgroup: '',
-                pdpSubgroupList: pdpSubgroupValues
-            });
-        }
-    }
-
-    handlePdpSubgroupChange(e) {
-        this.setState({ chosenPdpSubgroup: e.value });
-    }
-
-    handleRefresh() {
-        var newLoopCache, toscaModel, editorData;
-        if (this.state.policyInstanceType === OnapConstant.microServiceType) {
-            LoopService.refreshMicroServicePolicyJson(this.state.loopCache.getLoopName(),this.state.policyName).then(data => {
-                newLoopCache =  new LoopCache(data);
-                toscaModel = newLoopCache.getMicroServiceJsonRepresentationForName(this.state.policyName);
-                editorData = newLoopCache.getMicroServicePropertiesForName(this.state.policyName);
-                document.getElementById("editor").innerHTML = "";
-                this.setState({
-                    loopCache: newLoopCache,
-                    jsonEditor: this.createJsonEditor(toscaModel,editorData),
-                    showSucAlert: true,
-                    showMessage: "Successfully refreshed"
-                });
-            })
-            .catch(error => {
-                console.error("Error while refreshing the Operational Policy Json Representation");
-                this.setState({
-                    showFailAlert: true,
-                    showMessage: "Refreshing of UI failed"
-                });
-            });
-        } else if (this.state.policyInstanceType === OnapConstant.operationalPolicyType) {
-            LoopService.refreshOperationalPolicyJson(this.state.loopCache.getLoopName(),this.state.policyName).then(data => {
-                var newLoopCache =  new LoopCache(data);
-                toscaModel = newLoopCache.getOperationalPolicyJsonRepresentationForName(this.state.policyName);
-                editorData = newLoopCache.getOperationalPolicyPropertiesForName(this.state.policyName);
-                document.getElementById("editor").innerHTML = "";
-                this.setState({
-                    loopCache: newLoopCache,
-                    jsonEditor: this.createJsonEditor(toscaModel,editorData),
-                    showSucAlert: true,
-                    showMessage: "Successfully refreshed"
-                });
-            })
-            .catch(error => {
-                console.error("Error while refreshing the Operational Policy Json Representation");
-                this.setState({
-                    showFailAlert: true,
-                    showMessage: "Refreshing of UI failed"
-                });
-            });
-        }
-    }
-
-    disableAlert() {
-        this.setState ({ showSucAlert: false, showFailAlert: false });
-    }
-
-    renderPdpGroupDropDown() {
-        if(this.state.policyInstanceType !== OnapConstant.operationalPolicyType || !this.state.loopCache.isOpenLoopTemplate()) {
-            return (
-                <Form.Group as={Row} controlId="formPlaintextEmail">
-                    <Form.Label column sm="2">Pdp Group Info</Form.Label>
-                    <Col sm="3">
-                        <Select value={{ label: this.state.chosenPdpGroup, value: this.state.chosenPdpGroup }} onChange={this.handlePdpGroupChange} options={this.state.pdpGroupList} />
-                    </Col>
-                    <Col sm="3">
-                        <Select value={{ label: this.state.chosenPdpSubgroup, value: this.state.chosenPdpSubgroup }} onChange={this.handlePdpSubgroupChange} options={this.state.pdpSubgroupList} />
-                    </Col>
-                </Form.Group>
-            );
-        }
-    }
-
-    renderOpenLoopMessage() {
-        if(this.state.policyInstanceType === OnapConstant.operationalPolicyType && this.state.loopCache.isOpenLoopTemplate()) {
-            return (
-                   "Operational Policy cannot be configured as only Open Loop is supported for this Template!"
-               );
-           }
-    }
-
-    renderModalTitle() {
-        return (
-                <Modal.Title>Edit the policy</Modal.Title>
-        );
-    }
-
-    renderButton() {
-        var allElement = [(<Button variant="secondary" onClick={this.handleClose}>
-                                                   Close
-                         </Button>)];
-        if(this.state.policyInstanceType !== OnapConstant.operationalPolicyType || !this.state.loopCache.isOpenLoopTemplate()) {
-             allElement.push((
-                <Button variant="primary" disabled={this.readOnly} onClick={this.handleSave}>
-                                Save Changes
-                </Button>
-             ));
-             allElement.push((
-                <Button variant="primary" disabled={this.readOnly} onClick={this.handleRefresh}>
-                                Refresh
-                </Button>
-             ));
-        }
-        return allElement;
-    }
-
-    render() {
-        return (
-            <ModalStyled size="xl" backdrop="static" keyboard={false} show={this.state.show} onHide={this.handleClose}>
-                <Modal.Header closeButton>
-                    {this.renderModalTitle()}
-                </Modal.Header>
-                                <Alert variant="success" show={this.state.showSucAlert} onClose={this.disableAlert} dismissible>
-                                        <DivWhiteSpaceStyled>
-                                                {this.state.showMessage}
-                                        </DivWhiteSpaceStyled>
-                                </Alert>
-                                <Alert variant="danger" show={this.state.showFailAlert} onClose={this.disableAlert} dismissible>
-                                        <DivWhiteSpaceStyled>
-                                                {this.state.showMessage}
-                                        </DivWhiteSpaceStyled>
-                                </Alert>
-                <Modal.Body>
-                    {this.renderOpenLoopMessage()}
-                    <div id="editor" />
-                    {this.renderPdpGroupDropDown()}
-                </Modal.Body>
-                <Modal.Footer>
-                    {this.renderButton()}
-                </Modal.Footer>
-            </ModalStyled>
-        );
-    }
-}
diff --git a/ui-react/src/components/dialogs/Policy/PolicyModal.test.js b/ui-react/src/components/dialogs/Policy/PolicyModal.test.js
deleted file mode 100644
index cb0a32020..000000000
--- a/ui-react/src/components/dialogs/Policy/PolicyModal.test.js
+++ /dev/null
@@ -1,128 +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 PolicyModal from './PolicyModal';
-import LoopCache from '../../../api/LoopCache';
-import LoopService from '../../../api/LoopService';
-import OnapConstant from '../../../utils/OnapConstants';
-
-describe('Verify PolicyModal', () => {
-    beforeEach(() => {
-        fetch.resetMocks();
-        fetch.mockImplementation(() => {
-            return Promise.resolve({
-                ok: true,
-                status: 200,
-                text: () => "OK"
-            });
-        });
-    })
-    const loopCacheStr = {
-            "name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca",
-            "operationalPolicies": [{
-                "name": "OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca",
-                "configurationsJson": {
-                    "operational_policy": {
-                        "controlLoop": {},
-                        "policies": []
-                    }
-                },
-                "policyModel": {"policyPdpGroup": {"supportedPdpGroups":[{"monitoring": ["xacml"]}]}},
-                "jsonRepresentation" : {"schema": {}}
-             }]
-    };
-    const loopCache = new LoopCache(loopCacheStr);
-    const historyMock = { push: jest.fn() };
-    const flushPromises = () => new Promise(setImmediate);
-    const match = {params: {policyName:"OPERATIONAL_h2NMX_v1_0_ResourceInstanceName1_tca", policyInstanceType: OnapConstant.operationalPolicyType}}
-        
-    it('Test handleClose', () => {
-      const handleClose = jest.spyOn(PolicyModal.prototype,'handleClose');
-      const component = mount(<PolicyModal history={historyMock} match={match} loopCache={loopCache}/>)
-
-      component.find('[variant="secondary"]').prop('onClick')();
-
-      expect(handleClose).toHaveBeenCalledTimes(1);
-      expect(component.state('show')).toEqual(false);
-      expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
-    });
-
-    it('Test handleSave', async () => {
-        const loadLoopFunction = jest.fn();
-        const handleSave = jest.spyOn(PolicyModal.prototype,'handleSave');
-        const component = mount(<PolicyModal history={historyMock} 
-                          loopCache={loopCache} match={match} loadLoopFunction={loadLoopFunction} />)
-
-        component.find('[variant="primary"]').get(0).props.onClick();
-        await flushPromises();
-        component.update();
-
-        expect(handleSave).toHaveBeenCalledTimes(1);
-        expect(component.state('show')).toEqual(false);
-        expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
-    });
-
-    it('Test handleRefresh', async () => {
-        LoopService.refreshOperationalPolicyJson = jest.fn().mockImplementation(() => {
-            return Promise.resolve(loopCacheStr);
-        });
-        const updateLoopFunction = jest.fn();
-        const handleRefresh = jest.spyOn(PolicyModal.prototype,'handleRefresh');
-        const component = mount(<PolicyModal loopCache={loopCache} match={match} updateLoopFunction={updateLoopFunction} />)
-
-        component.find('[variant="primary"]').get(1).props.onClick();
-        await flushPromises();
-        component.update();
-
-        expect(handleRefresh).toHaveBeenCalledTimes(1);
-        expect(component.state('show')).toEqual(true);
-        expect(component.state('showSucAlert')).toEqual(true);
-        expect(component.state('showMessage')).toEqual("Successfully refreshed");
-    });
-
-    it('Test handlePdpGroupChange', () => {
-        const component = mount(<PolicyModal loopCache={loopCache} match={match} />)
-        component.setState({ 
-                "pdpGroup": [{"option1":["subPdp1","subPdp2"]}],
-                "chosenPdpGroup": "option2"
-        });
-        expect(component.state('chosenPdpGroup')).toEqual("option2");
-
-        const instance = component.instance();
-        const event = {label:"option1", value:"option1"}
-        instance.handlePdpGroupChange(event);
-        expect(component.state('chosenPdpGroup')).toEqual("option1");
-        expect(component.state('chosenPdpSubgroup')).toEqual("");
-        expect(component.state('pdpSubgroupList')).toEqual([{label:"subPdp1", value:"subPdp1"}, {label:"subPdp2", value:"subPdp2"}]);
-    });
-
-    it('Test handlePdpSubgroupChange', () => {
-        const component = mount(<PolicyModal loopCache={loopCache} match={match} />)
-
-        const instance = component.instance();
-        const event = {label:"option1", value:"option1"}
-        instance.handlePdpSubgroupChange(event);
-        expect(component.state('chosenPdpSubgroup')).toEqual("option1");
-    });
-});
\ No newline at end of file
diff --git a/ui-react/src/components/dialogs/Policy/ToscaViewer.js b/ui-react/src/components/dialogs/Policy/ToscaViewer.js
deleted file mode 100644
index 06e83164d..000000000
--- a/ui-react/src/components/dialogs/Policy/ToscaViewer.js
+++ /dev/null
@@ -1,67 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP POLICY-CLAMP
- * ================================================================================
- * Copyright (C) 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 PolicyToscaService from '../../../api/PolicyToscaService';
-import styled from 'styled-components';
-import Button from 'react-bootstrap/Button';
-
-const JsonEditorDiv = styled.div`
-    margin-top: 20px;
-    background-color: ${props => props.theme.toscaTextareaBackgroundColor};
-    text-align: justify;
-    font-size: ${props => props.theme.toscaTextareaFontSize};
-    width: 100%;
-    height: 30%;
-`
-
-export default class ToscaViewer extends React.Component {
-
-   state = {
-        toscaData: this.props.toscaData,
-        yamlPolicyTosca: this.getToscaModelYamlFor(this.props.toscaData),
-   }
-
-   constructor(props, context) {
-        super(props, context);
-        this.getToscaModelYamlFor = this.getToscaModelYamlFor.bind(this);
-   }
-
-   getToscaModelYamlFor(toscaData) {
-        PolicyToscaService.getToscaPolicyModelYaml(toscaData["policyModelType"], toscaData["version"]).then(respYamlPolicyTosca => {
-            this.setState({
-                            yamlPolicyTosca: respYamlPolicyTosca,
-                        })
-        });
-   }
-
-   render() {
-       return (
-                    <JsonEditorDiv>
-                        <pre>{this.state.yamlPolicyTosca}</pre>
-                        <Button variant="secondary" title="Create a new policy version from the defined parameters"
-                            onClick={this.handleCreateNewVersion}>Create New Version</Button>
-                    </JsonEditorDiv>
-       );
-   }
-}
\ No newline at end of file
diff --git a/ui-react/src/components/dialogs/Policy/ViewAllPolicies.js b/ui-react/src/components/dialogs/Policy/ViewAllPolicies.js
deleted file mode 100644
index d699f781c..000000000
--- a/ui-react/src/components/dialogs/Policy/ViewAllPolicies.js
+++ /dev/null
@@ -1,422 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP POLICY-CLAMP
- * ================================================================================
- * Copyright (C) 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, { forwardRef } from 'react'
-import Button from 'react-bootstrap/Button';
-import Modal from 'react-bootstrap/Modal';
-import styled from 'styled-components';
-import AddBox from '@material-ui/icons/AddBox';
-import ArrowDownward from '@material-ui/icons/ArrowDownward';
-import Check from '@material-ui/icons/Check';
-import ChevronLeft from '@material-ui/icons/ChevronLeft';
-import ChevronRight from '@material-ui/icons/ChevronRight';
-import Clear from '@material-ui/icons/Clear';
-import DeleteRoundedIcon from '@material-ui/icons/DeleteRounded';
-import Edit from '@material-ui/icons/Edit';
-import FilterList from '@material-ui/icons/FilterList';
-import FirstPage from '@material-ui/icons/FirstPage';
-import LastPage from '@material-ui/icons/LastPage';
-import Remove from '@material-ui/icons/Remove';
-import SaveAlt from '@material-ui/icons/SaveAlt';
-import Search from '@material-ui/icons/Search';
-import ViewColumn from '@material-ui/icons/ViewColumn';
-import DehazeIcon from '@material-ui/icons/Dehaze';
-import ArrowForwardIosIcon from '@material-ui/icons/ArrowForwardIos';
-import AddIcon from '@material-ui/icons/Add';
-import FormControlLabel from '@material-ui/core/FormControlLabel';
-import Switch from '@material-ui/core/Switch';
-import MaterialTable from "material-table";
-import PolicyService from '../../../api/PolicyService';
-import PolicyToscaService from '../../../api/PolicyToscaService';
-import Select from 'react-select';
-import Alert from 'react-bootstrap/Alert';
-import Tabs from 'react-bootstrap/Tabs';
-import Tab from 'react-bootstrap/Tab';
-import PolicyEditor from './PolicyEditor';
-import ToscaViewer from './ToscaViewer';
-
-const DivWhiteSpaceStyled = styled.div`
-    white-space: pre;
-`
-
-const ModalStyled = styled(Modal)`
-    @media (min-width: 1000px) {
-        .modal-xl {
-            max-width: 96%;
-        }
-    }
-    background-color: transparent;
-`
-const DetailedRow = styled.div`
-    margin: 0 auto;
-    background-color: ${props => props.theme.policyEditorBackgroundColor};
-    font-size: ${props => props.theme.policyEditorFontSize};
-    width: 97%;
-    margin-left: auto;
-    margin-right: 0;
-`
-
-
-const standardCellStyle = { backgroundColor: '#039be5', color: '#FFF', border: '1px solid black' };
-const cellPdpGroupStyle = { backgroundColor: '#039be5', color: '#FFF', 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 ViewAllPolicies extends React.Component {
-  state = {
-        show: true,
-        content: 'Please select a policy to display it',
-        selectedRowId: -1,
-        policiesListData: [],
-        toscaModelsListData: [],
-        jsonEditorForPolicy: new Map(),
-        prefixGrouping: false,
-        showSuccessAlert: false,
-        showFailAlert: false,
-        policyColumnsDefinition: [
-            {
-                title: "Policy Name", field: "name",
-                cellStyle: standardCellStyle,
-                headerStyle: headerStyle
-            },
-            {
-                title: "Policy Version", field: "version",
-                cellStyle: standardCellStyle,
-                headerStyle: headerStyle
-            },
-            {
-                title: "Policy Type", field: "type",
-                cellStyle: standardCellStyle,
-                headerStyle: headerStyle
-            },
-            {
-                title: "Policy Type Version", field: "type_version",
-                cellStyle: standardCellStyle,
-                headerStyle: headerStyle
-            },
-            {
-                title: "Deployed in PDP", field: "pdpGroupInfo.pdpGroup",
-                cellStyle: cellPdpGroupStyle,
-                headerStyle: headerStyle,
-                render: rowData => this.renderPdpGroupDropBox(rowData),
-                grouping: false
-            },
-            {
-                title: "PDP Group", field: "pdpGroupInfo.pdpGroup",
-                cellStyle: cellPdpGroupStyle,
-                headerStyle: headerStyle
-            },
-            {
-                title: "PDP SubGroup", field: "pdpGroupInfo.pdpSubGroup",
-                cellStyle: cellPdpGroupStyle,
-                headerStyle: headerStyle
-            }
-        ],
-        toscaColumnsDefinition: [
-            {
-                title: "Policy Model Type", field: "policyModelType",
-                cellStyle: standardCellStyle,
-                headerStyle: headerStyle
-            },
-            {
-                title: "Policy Acronym", field: "policyAcronym",
-                cellStyle: standardCellStyle,
-                headerStyle: headerStyle
-            },
-            {
-                title: "Version", field: "version",
-                cellStyle: standardCellStyle,
-                headerStyle: headerStyle
-            },
-            {
-                title: "Uploaded By", field: "updatedBy",
-                cellStyle: standardCellStyle,
-                headerStyle: headerStyle
-            },
-            {
-                title: "Uploaded Date", field: "updatedDate", editable: 'never',
-                cellStyle: standardCellStyle,
-                headerStyle: headerStyle
-            }
-        ],
-        tableIcons: {
-            Add: forwardRef((props, ref) => <AddBox {...props} ref={ref} />),
-            Check: forwardRef((props, ref) => <Check {...props} ref={ref} />),
-            Clear: forwardRef((props, ref) => <Clear {...props} ref={ref} />),
-            Delete: forwardRef((props, ref) => <DeleteRoundedIcon {...props} ref={ref} />),
-            DetailPanel: forwardRef((props, ref) => <ChevronRight {...props} ref={ref} />),
-            Edit: forwardRef((props, ref) => <Edit {...props} ref={ref} />),
-            Export: forwardRef((props, ref) => <SaveAlt {...props} ref={ref} />),
-            Filter: forwardRef((props, ref) => <FilterList {...props} ref={ref} />),
-            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) => <ArrowDownward {...props} ref={ref} />),
-            ThirdStateCheck: forwardRef((props, ref) => <Remove {...props} ref={ref} />),
-            ViewColumn: forwardRef((props, ref) => <ViewColumn {...props} ref={ref} />)
-        }
-    };
-
-    constructor(props, context) {
-        super(props, context);
-        this.handleClose = this.handleClose.bind(this);
-        this.renderPdpGroupDropBox = this.renderPdpGroupDropBox.bind(this);
-        this.handlePdpGroupChange = this.handlePdpGroupChange.bind(this);
-        this.handlePrefixGrouping = this.handlePrefixGrouping.bind(this);
-        this.handleDeletePolicy = this.handleDeletePolicy.bind(this);
-        this.disableAlert = this.disableAlert.bind(this);
-        this.getAllPolicies = this.getAllPolicies.bind(this);
-        this.getAllToscaModels = this.getAllToscaModels.bind(this);
-        this.getAllPolicies();
-        this.getAllToscaModels();
-    }
-
-    getAllToscaModels() {
-        PolicyToscaService.getToscaPolicyModels().then(toscaModelsList => {
-            this.setState({ toscaModelsListData: toscaModelsList });
-        });
-    }
-
-    handlePdpGroupChange(e) {
-        let pdpSplit = e.value.split("/");
-        let selectedPdpGroup = pdpSplit[0];
-        let selectedSubPdpGroup = pdpSplit[1];
-        if (typeof selectedSubPdpGroup !== "undefined") {
-            let temp = this.state.policiesListData;
-            temp[this.state.selectedRowId]["pdpGroupInfo"] = {"pdpGroup":selectedPdpGroup,"pdpSubGroup":selectedSubPdpGroup};
-            this.setState({policiesListData: temp});
-        } else {
-            delete this.state.policiesListData[this.state.selectedRowId]["pdpGroupInfo"];
-        }
-    }
-
-    renderPdpGroupDropBox(dataRow) {
-        let optionItems = [{label: "NOT DEPLOYED", value: "NOT DEPLOYED"}];
-        let selectedItem = {label: "NOT DEPLOYED", value: "NOT DEPLOYED"};
-        if (typeof dataRow.supportedPdpGroups !== "undefined") {
-            for (const pdpGroup of dataRow["supportedPdpGroups"]) {
-                for (const pdpSubGroup of Object.values(pdpGroup)[0]) {
-                    optionItems.push({ label: Object.keys(pdpGroup)[0]+"/"+pdpSubGroup,
-                    value: Object.keys(pdpGroup)[0]+"/"+pdpSubGroup });
-                }
-            }
-        }
-        if (typeof dataRow.pdpGroupInfo !== "undefined") {
-            selectedItem = {label: dataRow["pdpGroupInfo"]["pdpGroup"]+"/"+dataRow["pdpGroupInfo"]["pdpSubGroup"],
-            value: dataRow["pdpGroupInfo"]["pdpGroup"]+"/"+dataRow["pdpGroupInfo"]["pdpSubGroup"]};
-        }
-        return (<div style={{width: '250px'}}><Select value={selectedItem} options={optionItems} onChange={this.handlePdpGroupChange}/></div>);
-    }
-
-    getAllPolicies() {
-        PolicyService.getPoliciesList().then(allPolicies => {
-            this.setState({ policiesListData: allPolicies["policies"] })
-        });
-    }
-
-    handleClose() {
-        this.setState({ show: false });
-        this.props.history.push('/')
-    }
-
-    handlePrefixGrouping(event) {
-        this.setState({prefixGrouping: event.target.checked});
-    }
-
-    handleDeletePolicy(event, rowData) {
-        PolicyService.deletePolicy(rowData["type"], rowData["type_version"], rowData["name"],rowData["version"]).then(
-            respPolicyDeletion => {
-                if (typeof(respPolicyDeletion) === "undefined") {
-                    //it indicates a failure
-                    this.setState({
-                        showFailAlert: true,
-                        showMessage: 'Policy Deletion Failure'
-                    });
-                } else {
-                    this.setState({
-                        showSuccessAlert: true,
-                        showMessage: 'Policy successfully Deleted'
-                    });
-                }
-                this.getAllPolicies();
-            }
-        )
-    }
-
-    disableAlert() {
-        this.setState ({ showSuccessAlert: false, showFailAlert: false });
-    }
-
-    renderPoliciesTab() {
-        return (
-                <Tab eventKey="policies" title="Policies in Policy Framework">
-                        <Modal.Body>
-                          <FormControlLabel
-                                control={<Switch checked={this.state.prefixGrouping} onChange={this.handlePrefixGrouping} />}
-                                label="Group by prefix"
-                              />
-                           <MaterialTable
-                              title={"Policies"}
-                              data={this.state.policiesListData}
-                              columns={this.state.policyColumnsDefinition}
-                              icons={this.state.tableIcons}
-                              onRowClick={(event, rowData, togglePanel) => togglePanel()}
-                              options={{
-                                  grouping: true,
-                                  exportButton: true,
-                                  headerStyle:rowHeaderStyle,
-                                  rowStyle: rowData => ({
-                                    backgroundColor: (this.state.selectedRowId !== -1 && this.state.selectedRowId === rowData.tableData.id) ? '#EEE' : '#FFF'
-                                  }),
-                                  actionsColumnIndex: -1
-                              }}
-                              detailPanel={[
-                                {
-                                  icon: ArrowForwardIosIcon,
-                                  tooltip: 'Show Configuration',
-                                  render: rowData => {
-                                    return (
-                                        <DetailedRow>
-                                            <PolicyEditor policyModelType={rowData["type"]} policyModelTypeVersion={rowData["type_version"]} policyName={rowData["name"]} policyVersion={rowData["version"]} policyProperties={rowData["properties"]} policyUpdateFunction={this.getAllPolicies} />
-                                        </DetailedRow>
-                                    )
-                                  },
-                                },
-                                {
-                                  icon: DehazeIcon,
-                                  tooltip: 'Show Raw Data',
-                                  render: rowData => {
-                                    return (
-                                        <DetailedRow>
-                                            <pre>{JSON.stringify(rowData, null, 2)}</pre>
-                                        </DetailedRow>
-                                    )
-                                  },
-                                },
-                              ]}
-                              actions={[
-                                  {
-                                    icon: forwardRef((props, ref) => <DeleteRoundedIcon {...props} ref={ref} />),
-                                    tooltip: 'Delete Policy',
-                                    onClick: (event, rowData) => this.handleDeletePolicy(event, rowData)
-                                  }
-                              ]}
-                           />
-                        </Modal.Body>
-                    </Tab>
-        );
-    }
-
-    renderToscaTab() {
-        return (
-                    <Tab eventKey="tosca models" title="Tosca Models in Policy Framework">
-                        <Modal.Body>
-                          <FormControlLabel
-                                control={<Switch checked={this.state.prefixGrouping} onChange={this.handlePrefixGrouping} />}
-                                label="Group by prefix"
-                              />
-                           <MaterialTable
-                              title={"Tosca Models"}
-                              data={this.state.toscaModelsListData}
-                              columns={this.state.toscaColumnsDefinition}
-                              icons={this.state.tableIcons}
-                              onRowClick={(event, rowData, togglePanel) => togglePanel()}
-                              options={{
-                                  grouping: true,
-                                  exportButton: true,
-                                  headerStyle:rowHeaderStyle,
-                                  rowStyle: rowData => ({
-                                    backgroundColor: (this.state.selectedRowId !== -1 && this.state.selectedRowId === rowData.tableData.id) ? '#EEE' : '#FFF'
-                                  }),
-                                  actionsColumnIndex: -1
-                              }}
-                              detailPanel={[
-                                {
-                                  icon: ArrowForwardIosIcon,
-                                  tooltip: 'Show Tosca',
-                                  render: rowData => {
-                                    return (
-                                        <DetailedRow>
-                                            <ToscaViewer toscaData={rowData} />
-                                        </DetailedRow>
-                                    )
-                                  },
-                                },
-                                {
-                                  icon: DehazeIcon,
-                                  tooltip: 'Show Raw Data',
-                                  render: rowData => {
-                                    return (
-                                        <DetailedRow>
-                                            <pre>{JSON.stringify(rowData, null, 2)}</pre>
-                                        </DetailedRow>
-                                    )
-                                  },
-                                },
-                                {
-                                  icon: AddIcon,
-                                  tooltip: 'Create a policy from this model',
-                                  render: rowData => {
-                                    return (
-                                        <DetailedRow>
-                                            <PolicyEditor policyModelType={rowData["policyModelType"]} policyModelTypeVersion={rowData["version"]} policyProperties={{}} policyUpdateFunction={this.getAllPolicies} />
-                                        </DetailedRow>
-                                    )
-                                  },
-                                },
-                              ]}
-                           />
-                        </Modal.Body>
-                    </Tab>
-        );
-    }
-
-    render() {
-    return (
-            <ModalStyled size="xl" show={this.state.show} onHide={this.handleClose} backdrop="static" keyboard={false}>
-                <Modal.Header closeButton>
-                </Modal.Header>
-                <Tabs id="controlled-tab-example" activeKey={this.state.key} onSelect={key => this.setState({ key, selectedRowData: {} })}>
-                    {this.renderPoliciesTab()}
-                    {this.renderToscaTab()}
-                </Tabs>
-                <Alert variant="success" show={this.state.showSuccessAlert} onClose={this.disableAlert} dismissible>
-                    <DivWhiteSpaceStyled>
-                        {this.state.showMessage}
-                    </DivWhiteSpaceStyled>
-                </Alert>
-                <Alert variant="danger" show={this.state.showFailAlert} onClose={this.disableAlert} dismissible>
-                    <DivWhiteSpaceStyled>
-                        {this.state.showMessage}
-                    </DivWhiteSpaceStyled>
-                </Alert>
-                <Modal.Footer>
-                    <Button variant="secondary" onClick={this.handleClose}>Close</Button>
-               </Modal.Footer>
-      </ModalStyled>
-      );
-    }
-  }
\ No newline at end of file
diff --git a/ui-react/src/components/dialogs/RefreshStatus.js b/ui-react/src/components/dialogs/RefreshStatus.js
deleted file mode 100644
index bb0939152..000000000
--- a/ui-react/src/components/dialogs/RefreshStatus.js
+++ /dev/null
@@ -1,65 +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 Spinner from 'react-bootstrap/Spinner';
-import styled from 'styled-components';
-
-const StyledSpinnerDiv = styled.div`
-	justify-content: center !important;
-	display: flex !important;
-`;
-
-export default class RefreshStatus extends React.Component {
-	state = {
-		loopName: this.props.loopCache.getLoopName()
-	};
-
-	componentWillReceiveProps(newProps) {
-		this.setState({
-			loopName: newProps.loopCache.getLoopName()
-		});
-	}
-
-	componentDidMount() {
-		// refresh status and update loop logs
-		LoopActionService.refreshStatus(this.state.loopName).then(data => {
-			this.props.showSucAlert("Status successfully refreshed");
-			this.props.updateLoopFunction(data);
-			this.props.history.push('/');
-		})
-		.catch(error => {
-			this.props.showFailAlert("Status refreshing failed");
-			this.props.history.push('/');
-		});
-	}
-
-	render() {
-		return (
-			<StyledSpinnerDiv>
-				<Spinner animation="border" role="status">
-				</Spinner>
-			</StyledSpinnerDiv>
-		);
-	}
-}
diff --git a/ui-react/src/components/dialogs/RefreshStatus.test.js b/ui-react/src/components/dialogs/RefreshStatus.test.js
deleted file mode 100644
index e08c50d2e..000000000
--- a/ui-react/src/components/dialogs/RefreshStatus.test.js
+++ /dev/null
@@ -1,71 +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 RefreshStatus from './RefreshStatus';
-import LoopCache from '../../api/LoopCache';
-import LoopActionService from '../../api/LoopActionService';
-
-describe('Verify RefreshStatus', () => {
-
-	const loopCache = new LoopCache({
-		"name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca"
-	});
-
-	it('Test refresh status failed', async () => {
-		const flushPromises = () => new Promise(setImmediate);
-		const historyMock = { push: jest.fn() };
-		const showSucAlert = jest.fn();
-		const showFailAlert = jest.fn();
-
-		const component = shallow(<RefreshStatus loopCache={loopCache} history={historyMock} showSucAlert={showSucAlert} showFailAlert={showFailAlert} />)
-		await flushPromises();
-		component.update();
-
-		expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
-	});
-
-	it('Test refresh status successful', async () => {
-		const flushPromises = () => new Promise(setImmediate);
-		const historyMock = { push: jest.fn() };
-		const updateLoopFunction = jest.fn();
-		const showSucAlert = jest.fn();
-		const showFailAlert = jest.fn();
-
-		LoopActionService.refreshStatus = jest.fn().mockImplementation(() => {
-			return Promise.resolve({
-				ok: true,
-				status: 200,
-				json: () => {}
-			});
-		});
-
-		const component = shallow(<RefreshStatus loopCache={loopCache} 
-						loopAction="submit" history={historyMock} updateLoopFunction={updateLoopFunction} showSucAlert={showSucAlert} showFailAlert={showFailAlert} />)
-		await flushPromises();
-		component.update();
-
-		expect(historyMock.push.mock.calls[0]).toEqual([ '/']);
-	});
-
-});
diff --git a/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.js b/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.js
deleted file mode 100644
index eb6e70f3d..000000000
--- a/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.js
+++ /dev/null
@@ -1,163 +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, { forwardRef } from 'react'
-import Button from 'react-bootstrap/Button';
-import Modal from 'react-bootstrap/Modal';
-import styled from 'styled-components';
-import TemplateService from '../../../api/TemplateService';
-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 MaterialTable from "material-table";
-import LoopCache from '../../../api/LoopCache';
-import SvgGenerator from '../../loop_viewer/svg/SvgGenerator';
-
-const ModalStyled = styled(Modal)`
-	background-color: transparent;
-`
-
-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 ViewLoopTemplatesModal extends React.Component {
-  state = {
-        show: true,
-		content: 'Please select a loop template to display it',
-		selectedRow: -1,
-		loopTemplatesData: [],
-		fakeLoopCacheWithTemplate: new LoopCache({}),
-		loopTemplateColumnsDefinition: [
-			{ title: "#", field: "index", render: rowData => rowData.tableData.id + 1,
-				cellStyle: cellStyle,
-				headerStyle: headerStyle
-			},
-			{ title: "Template Name", field: "name",
-				cellStyle: cellStyle,
-				headerStyle: headerStyle
-			},
-			{ title: "Service Model Name", field: "modelService.serviceDetails.name",
-				cellStyle: cellStyle,
-				headerStyle: headerStyle
-			},
-			{ title: "Loop Type Allowed", field: "allowedLoopType",
-				cellStyle: cellStyle,
-				headerStyle: headerStyle
-			},
-			{ title: "# Instances Allowed", field: "maximumInstancesAllowed",
-				cellStyle: cellStyle,
-				headerStyle: headerStyle
-			},
-			{ title: "Modified Date", field: "updatedDate", 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.renderSvg = this.renderSvg.bind(this);
-		this.getLoopTemplate = this.getLoopTemplate.bind(this);
-		this.getAllLoopTemplates();
-	}
-
-	getAllLoopTemplates() {
-		TemplateService.getAllLoopTemplates().then(templatesData => {
-			// replace -1 in maximumInstancesAllowed with more meaningful 'No Limit'
-			for (let item in templatesData) {
-				if (templatesData[item].maximumInstancesAllowed === -1) {
-					templatesData[item].maximumInstancesAllowed = 'No Limit';
-				}
-			} 
-			this.setState({ loopTemplatesData: templatesData })
-		});
-	}
-
-	getLoopTemplate(templateIdInDataArray) {
-	    if (typeof templateIdInDataArray !== "undefined") {
-	        this.setState({ fakeLoopCacheWithTemplate:
-                new LoopCache({
-                    "loopTemplate":this.state.loopTemplatesData[templateIdInDataArray],
-                    "name": "fakeLoop"
-                })
-	        })
-		} else {
-          	this.setState({ fakeLoopCacheWithTemplate: new LoopCache({}) })
-        }
-    }
-
-	handleClose() {
-		this.setState({ show: false });
-		this.props.history.push('/')
-	}
-
-	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.Header>
-    			<Modal.Body>
-    			   <MaterialTable
-    				  title={"View Blueprint MicroService Templates"}
-    				  data={this.state.loopTemplatesData}
-					  columns={this.state.loopTemplateColumnsDefinition}
-					  icons={this.state.tableIcons}
-    			      onRowClick={(event, rowData) => {this.getLoopTemplate(rowData.tableData.id);this.setState({selectedRow: rowData.tableData.id})}}
-					  options={{
-					      headerStyle:rowHeaderStyle,
-					      rowStyle: rowData => ({
-					      backgroundColor: (this.state.selectedRow !== -1 && this.state.selectedRow === rowData.tableData.id) ? '#EEE' : '#FFF'
-                          })
-                      }}
-                />
-	            {this.renderSvg()}
-                </Modal.Body>
-                <Modal.Footer>
-                	<Button variant="secondary" onClick={this.handleClose}>Close</Button>
-               </Modal.Footer>
-      </ModalStyled>
-      );
-    }
-  }
diff --git a/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.test.js b/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.test.js
deleted file mode 100644
index 7680ec4b9..000000000
--- a/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.test.js
+++ /dev/null
@@ -1,162 +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 ViewLoopTemplatesModal from './ViewLoopTemplatesModal';
-import { mount } from 'enzyme';
-import { BrowserRouter as Router } from 'react-router-dom';
-
-describe('Verify ViewLoopTemplatesModal', () => {
-	beforeEach(() => {
-		fetch.resetMocks();
-	});
-
-	it('Test API Successful', () => {
-		fetch.mockImplementationOnce(() => {
-			return Promise.resolve({
-				ok: true,
-				status: 200,
-				json: () => {
-					return Promise.resolve({
-						"index": "1",
-						"name": "MTCA version 1",
-						"modelService.serviceDetails.name": "MTCA",
-						"allowedLoopType" : "CLOSED",
-						"maximumInstancesAllowed":1,
-						"updatedDate":"2019-09-06 19:09:42"
-					});
-				}
-			});
-		});
-		const component = shallow(<ViewLoopTemplatesModal/>);
-	});
-  	
-	it('Test API Exception', () => {
-		fetch.mockImplementationOnce(() => {
-			return Promise.resolve({
-				ok: false,
-				status: 500,
-				json: () => {
-					return Promise.resolve({
-						"index": "1",
-						"name": "MTCA version 1",
-						"modelService.serviceDetails.name": "MTCA",
-						"allowedLoopType" : "CLOSED",
-						"maximumInstancesAllowed":1,
-						"updatedDate":"2019-09-06 19:09:42"
-					});
-				}
-			});
-		});
-		const component = shallow(<ViewLoopTemplatesModal/>);
-	});
-
-	it('Test API Rejection', () => {
-		const myMockFunc  = fetch.mockImplementationOnce(() => Promise.reject('error'));
-		setTimeout( () => myMockFunc().catch(e => {
-			console.info(e);
-		}),
-		100
-		);
-		const component = shallow(<ViewLoopTemplatesModal/>);
-		expect(myMockFunc.mock.calls.length).toBe(1);
-	});
-
-	it('Test the tosca model view render method', () => {
-		fetch.mockImplementationOnce(() => {
-			return Promise.resolve({
-				ok: true,
-				status: 200,
-				json: () => {
-					return Promise.resolve({
-						"index": "1",
-						"name": "MTCA version 1",
-						"modelService.serviceDetails.name": "MTCA",
-						"allowedLoopType" : "CLOSED",
-						"maximumInstancesAllowed":1,
-						"updatedDate":"2019-09-06 19:09:42"
-					});
-				}
-			});
-		});
-		const component = shallow(<ViewLoopTemplatesModal/>);
-		component.setState({ loopTemplateData: {
-						"index": "1",
-						"name": "MTCA version 1",
-						"modelService.serviceDetails.name": "MTCA",
-						"allowedLoopType" : "CLOSED",
-						"maximumInstancesAllowed":1,
-						"updatedDate":"2019-09-06 19:09:42"
-		  }
-		});
-		expect(component).toMatchSnapshot();
-	});
-
-	it('Test Table icons', () => {
-			fetch.mockImplementationOnce(() => {
-				return Promise.resolve({
-					ok: true,
-					status: 200,
-					json: () => {
-						return Promise.resolve({
-						"index": "1",
-						"name": "MTCA version 1",
-						"modelService.serviceDetails.name": "MTCA",
-						"allowedLoopType" : "CLOSED",
-						"maximumInstancesAllowed":1,
-						"updatedDate":"2019-09-06 19:09:42"
-						});
-					}
-				});
-			});
-			const component = mount(<Router><ViewLoopTemplatesModal/></Router>);
-			expect(component.find('[className="MuiSelect-icon MuiTablePagination-selectIcon"]')).toBeTruthy();
-		});
-		
-		it('Test handleClose', () => {
-			fetch.mockImplementationOnce(() => {
-				return Promise.resolve({
-					ok: true,
-					status: 200,
-					json: () => {
-						return Promise.resolve({
-						"index": "1",
-						"name": "MTCA version 1",
-						"modelService.serviceDetails.name": "MTCA",
-						"allowedLoopType" : "CLOSED",
-						"maximumInstancesAllowed":1,
-						"updatedDate":"2019-09-06 19:09:42"
-						});
-					}
-				});
-			});
-			const historyMock = { push: jest.fn() };
-			const handleClose = jest.spyOn(ViewLoopTemplatesModal.prototype,'handleClose');
-			const component = shallow(<ViewLoopTemplatesModal 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();
-		});
-	});
diff --git a/ui-react/src/components/dialogs/Tosca/__snapshots__/ViewLoopTemplatesModal.test.js.snap b/ui-react/src/components/dialogs/Tosca/__snapshots__/ViewLoopTemplatesModal.test.js.snap
deleted file mode 100644
index 73f659606..000000000
--- a/ui-react/src/components/dialogs/Tosca/__snapshots__/ViewLoopTemplatesModal.test.js.snap
+++ /dev/null
@@ -1,157 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify ViewLoopTemplatesModal Test the tosca model view render method 1`] = `
-<Styled(Modal)
-  backdrop="static"
-  keyboard={false}
-  onHide={[Function]}
-  show={true}
-  size="xl"
->
-  <ModalHeader
-    closeButton={true}
-    closeLabel="Close"
-  />
-  <ModalBody>
-    <WithStyles(Component)
-      columns={
-        Array [
-          Object {
-            "cellStyle": Object {
-              "border": "1px solid black",
-            },
-            "field": "index",
-            "headerStyle": Object {
-              "backgroundColor": "#ddd",
-              "border": "2px solid black",
-            },
-            "render": [Function],
-            "title": "#",
-          },
-          Object {
-            "cellStyle": Object {
-              "border": "1px solid black",
-            },
-            "field": "name",
-            "headerStyle": Object {
-              "backgroundColor": "#ddd",
-              "border": "2px solid black",
-            },
-            "title": "Template Name",
-          },
-          Object {
-            "cellStyle": Object {
-              "border": "1px solid black",
-            },
-            "field": "modelService.serviceDetails.name",
-            "headerStyle": Object {
-              "backgroundColor": "#ddd",
-              "border": "2px solid black",
-            },
-            "title": "Service Model Name",
-          },
-          Object {
-            "cellStyle": Object {
-              "border": "1px solid black",
-            },
-            "field": "allowedLoopType",
-            "headerStyle": Object {
-              "backgroundColor": "#ddd",
-              "border": "2px solid black",
-            },
-            "title": "Loop Type Allowed",
-          },
-          Object {
-            "cellStyle": Object {
-              "border": "1px solid black",
-            },
-            "field": "maximumInstancesAllowed",
-            "headerStyle": Object {
-              "backgroundColor": "#ddd",
-              "border": "2px solid black",
-            },
-            "title": "# Instances Allowed",
-          },
-          Object {
-            "cellStyle": Object {
-              "border": "1px solid black",
-            },
-            "editable": "never",
-            "field": "updatedDate",
-            "headerStyle": Object {
-              "backgroundColor": "#ddd",
-              "border": "2px solid black",
-            },
-            "title": "Modified Date",
-          },
-        ]
-      }
-      data={Array []}
-      icons={
-        Object {
-          "FirstPage": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "LastPage": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "NextPage": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "PreviousPage": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "ResetSearch": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "Search": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-          "SortArrow": Object {
-            "$$typeof": Symbol(react.forward_ref),
-            "render": [Function],
-          },
-        }
-      }
-      onRowClick={[Function]}
-      options={
-        Object {
-          "headerStyle": Object {
-            "backgroundColor": "#ddd",
-            "border": "1px solid black",
-            "fontSize": "15pt",
-            "text": "bold",
-          },
-          "rowStyle": [Function],
-        }
-      }
-      title="View Blueprint MicroService Templates"
-    />
-    <withRouter(SvgGenerator)
-      clickable={false}
-      generatedFrom="TEMPLATE"
-      loopCache={
-        LoopCache {
-          "loopJsonCache": Object {},
-        }
-      }
-    />
-  </ModalBody>
-  <ModalFooter>
-    <Button
-      active={false}
-      disabled={false}
-      onClick={[Function]}
-      variant="secondary"
-    >
-      Close
-    </Button>
-  </ModalFooter>
-</Styled(Modal)>
-`;
diff --git a/ui-react/src/components/dialogs/UserInfoModal.js b/ui-react/src/components/dialogs/UserInfoModal.js
deleted file mode 100644
index 4b779dece..000000000
--- a/ui-react/src/components/dialogs/UserInfoModal.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 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 UserService from '../../api/UserService';
-
-const ModalStyled = styled(Modal)`
-	background-color: transparent;
-`
-
-export default class UserInfoModal extends React.Component {
-
-	constructor(props, context) {
-		super(props, context);
-
-		this.handleClose = this.handleClose.bind(this);
-	    this.renderPermissions = this.renderPermissions.bind(this);
-		this.renderUserName = this.renderUserName.bind(this);
-		this.state = {
-			show: true,
-			userInfo: {}
-		};
-	}
-	componentWillMount() {
-		UserService.getUserInfo().then(userInfo => {
-			this.setState({ userInfo: userInfo })
-		});
-	}
-
-	handleClose() {
-			this.props.history.push('/');
-	}
-	renderPermissions() {
-          if (this.state.userInfo["allPermissions"]) {
-	        var listOfPermissions = this.state.userInfo["allPermissions"].map(function(perm) {
-	            return <Form.Control plaintext readOnly defaultValue={perm} />;
-	        })
-		    return listOfPermissions;
-		  } else {
-		    return;
-		  }
- 	}
-	renderUserName() {
-		if (this.state.userInfo["userName"]) {
-			return <Form.Control plaintext readOnly defaultValue={this.state.userInfo["userName"]} />
-		} else  {
-			return;
-		}
-	}
-	renderVersion() {
-		if (this.state.userInfo["cldsVersion"]) {
-			return <Form.Control plaintext readOnly defaultValue={this.state.userInfo["cldsVersion"]} />
-		} else  {
-			return;
-		}
-	}
-	render() {
-		return (
-			<ModalStyled size="lg"  show={this.state.show} onHide={this.handleClose}>
-				<Modal.Header closeButton>
-					<Modal.Title>User Info</Modal.Title>
-				</Modal.Header>
-				<Modal.Body>
-					<Form.Group as={Row} controlId="userName">
-						<Form.Label column sm="3">Current User:</Form.Label>
-						<Col>{this.renderUserName()}</Col>
-					</Form.Group>
-					<Form.Group as={Row} controlId="cldsVersion">
-						<Form.Label column sm="3">CLDS Version:</Form.Label>
-						<Col>{this.renderVersion()}</Col>
-					</Form.Group>
-					<Form.Group as={Row} controlId="userPermissions">
-						<Form.Label column sm="3">User Permissions:</Form.Label>
-						<Col>
-							{this.renderPermissions()}
-						</Col>
-					</Form.Group>
-				</Modal.Body>
-				<Modal.Footer>
-					<Button variant="secondary" type="null" onClick={this.handleClose}>Cancel</Button>
-				</Modal.Footer>
-			</ModalStyled>
-		);
-	}
-}
diff --git a/ui-react/src/components/dialogs/UserInfoModal.test.js b/ui-react/src/components/dialogs/UserInfoModal.test.js
deleted file mode 100644
index f5ed0ae10..000000000
--- a/ui-react/src/components/dialogs/UserInfoModal.test.js
+++ /dev/null
@@ -1,78 +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 UserInfoModal from './UserInfoModal';
-
-describe('Verify UserInfoModal', () => {
-
-	beforeEach(() => {
-		fetch.resetMocks();
-		fetch.mockImplementation(() => {
-			return Promise.resolve({
-				ok: true,
-				status: 200,
-				json: () => {
-					return Promise.resolve({
-						"userName": "test",
-						"cldsVersion": "1.0.0"
-					});
-			}});
-		});
-	})
-
-	it('Test the render method full permission', () => {
-		const component = shallow(<UserInfoModal />)
-		component.setState({ userInfo: {
-			"userName": "test",
-			"cldsVersion": "1.0.0",
-			"allPermissions": ["permission1","permission2"]
-		}});
-		expect(component).toMatchSnapshot();
-	});
-
-	it('Test the render method no permission', () => {
-		const component = shallow(<UserInfoModal />)
-		component.setState({ userInfo: {}
-		});
-
-		expect(component.find('FormControl').length).toEqual(0);
-	});
-
-	it('Test the render method read permission', () => {
-		const component = shallow(<UserInfoModal />)
-		component.setState({ userInfo: {
-			"userName": "test",
-			"cldsVersion": "1.0.0",
-			"allPermissions": ["permission1","permission2"]
-		}});
-
-		expect(component.find('FormControl').length).toEqual(4);
-
-		const forms = component.find('FormControl');
-		expect(forms.get(0).props.defaultValue).toEqual("test");
-		expect(forms.get(1).props.defaultValue).toEqual("1.0.0");
-		expect(forms.get(2).props.defaultValue).toEqual("permission1");
-		expect(forms.get(3).props.defaultValue).toEqual("permission2");
-	});
-});
diff --git a/ui-react/src/components/dialogs/__snapshots__/UserInfoModal.test.js.snap b/ui-react/src/components/dialogs/__snapshots__/UserInfoModal.test.js.snap
deleted file mode 100644
index 7c725bc42..000000000
--- a/ui-react/src/components/dialogs/__snapshots__/UserInfoModal.test.js.snap
+++ /dev/null
@@ -1,117 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify UserInfoModal Test the render method full permission 1`] = `
-<Styled(Modal)
-  onHide={[Function]}
-  show={true}
-  size="lg"
->
-  <ModalHeader
-    closeButton={true}
-    closeLabel="Close"
-  >
-    <ModalTitle>
-      User Info
-    </ModalTitle>
-  </ModalHeader>
-  <ModalBody>
-    <FormGroup
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "defaultProps": Object {
-            "noGutters": false,
-          },
-          "render": [Function],
-        }
-      }
-      controlId="userName"
-    >
-      <FormLabel
-        column={true}
-        sm="3"
-        srOnly={false}
-      >
-        Current User:
-      </FormLabel>
-      <Col>
-        <FormControl
-          defaultValue="test"
-          plaintext={true}
-          readOnly={true}
-        />
-      </Col>
-    </FormGroup>
-    <FormGroup
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "defaultProps": Object {
-            "noGutters": false,
-          },
-          "render": [Function],
-        }
-      }
-      controlId="cldsVersion"
-    >
-      <FormLabel
-        column={true}
-        sm="3"
-        srOnly={false}
-      >
-        CLDS Version:
-      </FormLabel>
-      <Col>
-        <FormControl
-          defaultValue="1.0.0"
-          plaintext={true}
-          readOnly={true}
-        />
-      </Col>
-    </FormGroup>
-    <FormGroup
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "defaultProps": Object {
-            "noGutters": false,
-          },
-          "render": [Function],
-        }
-      }
-      controlId="userPermissions"
-    >
-      <FormLabel
-        column={true}
-        sm="3"
-        srOnly={false}
-      >
-        User Permissions:
-      </FormLabel>
-      <Col>
-        <FormControl
-          defaultValue="permission1"
-          plaintext={true}
-          readOnly={true}
-        />
-        <FormControl
-          defaultValue="permission2"
-          plaintext={true}
-          readOnly={true}
-        />
-      </Col>
-    </FormGroup>
-  </ModalBody>
-  <ModalFooter>
-    <Button
-      active={false}
-      disabled={false}
-      onClick={[Function]}
-      type="null"
-      variant="secondary"
-    >
-      Cancel
-    </Button>
-  </ModalFooter>
-</Styled(Modal)>
-`;
diff --git a/ui-react/src/components/loop_viewer/logs/LoopLogs.js b/ui-react/src/components/loop_viewer/logs/LoopLogs.js
deleted file mode 100644
index b3f052626..000000000
--- a/ui-react/src/components/loop_viewer/logs/LoopLogs.js
+++ /dev/null
@@ -1,97 +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 Table from 'react-bootstrap/Table';
-import LoopCache from '../../../api/LoopCache';
-import styled from 'styled-components';
-
-const LoopLogsHeaderDivStyled = styled.div`
-	background-color: ${props => props.theme.loopLogsHeaderBackgroundColor};
-	padding: 10px 10px;
-	color: ${props => props.theme.loopLogsHeaderFontColor};
-`
-const TableStyled = styled(Table)`
-    
-    overflow: auto;
-`
-const TableRow = ({ logRow }) => (
-	<tr>
-		<td>{logRow.logInstant}</td>
-		<td>{logRow.logType}</td>
-		<td>{logRow.logComponent}</td>
-		<td>{logRow.message}</td>
-	</tr>
-
-)
-
-export default class LoopLogs extends React.Component {
-
-	state = {
-		loopCache: new LoopCache({})
-	}
-	constructor(props) {
-		super(props);
-		this.renderLogs = this.renderLogs.bind(this);
-		this.state.loopCache = props.loopCache;
-	}
-
-	shouldComponentUpdate(nextProps, nextState) {
-		return this.state.loopCache !== nextState.loopCache;
-	}
-
-	componentWillReceiveProps(newProps) {
-		this.setState({
-			loopCache: newProps.loopCache
-		});
-	}
-
-	renderLogs() {
-		if (this.state.loopCache.getLoopLogsArray() != null) {
-			return (
-				this.state.loopCache.getLoopLogsArray().map(row => <TableRow logRow={row} />)
-			)
-		}
-	}
-
-	render() {
-		return (
-			<LoopLogsHeaderDivStyled>
-				<label>Loop Logs</label>
-				<TableStyled striped hover variant responsive>
-					<thead>
-						<tr>
-							<th><span align="left">Date</span></th>
-							<th><span align="left">Type</span></th>
-							<th><span align="left">Component</span></th>
-							<th><span align="right">Log</span></th>
-						</tr>
-					</thead>
-					<tbody>
-						{this.renderLogs()}
-					</tbody>
-				</TableStyled>
-			</LoopLogsHeaderDivStyled>
-
-		);
-	}
-}
diff --git a/ui-react/src/components/loop_viewer/logs/LoopLogs.test.js b/ui-react/src/components/loop_viewer/logs/LoopLogs.test.js
deleted file mode 100644
index 3b7fd413a..000000000
--- a/ui-react/src/components/loop_viewer/logs/LoopLogs.test.js
+++ /dev/null
@@ -1,70 +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 LoopLogs from './LoopLogs';
-import LoopCache from '../../../api/LoopCache';
-
-describe('Verify LoopLogs', () => {
-
-	const loopCache = new LoopCache({
-		"name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca",
-			"loopLogs": [
-			{
-				"id": 1,
-				"logType": "INFO",
-				"logComponent": "CLAMP",
-				"message": "Operational policies UPDATED",
-				"logInstant": "2019-07-08T09:44:37Z"
-			}
-		]
-	});
-
-	it('Test the render method', () => {
-		const component = shallow(<LoopLogs loopCache={loopCache}/>)
-		expect(component).toMatchSnapshot();
-
-		const loopCacheUpdated = new LoopCache({
-		"name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca",
-			"loopLogs": [
-			{
-				"id": 1,
-				"logType": "INFO",
-				"logComponent": "CLAMP",
-				"message": "Operational policies UPDATED",
-				"logInstant": "2019-07-08T09:44:37Z"
-			},
-			{
-				"id": 2,
-				"logType": "INFO",
-				"logComponent": "CLAMP",
-				"message": "Operational policies UPDATED",
-				"logInstant": "2019-07-08T09:44:50Z"
-			}
-			]
-		});
-
-		component.setProps({ loopCache: loopCacheUpdated });
-		expect(component.find('TableRow').length).toEqual(2);
-	});
-});
\ No newline at end of file
diff --git a/ui-react/src/components/loop_viewer/logs/__snapshots__/LoopLogs.test.js.snap b/ui-react/src/components/loop_viewer/logs/__snapshots__/LoopLogs.test.js.snap
deleted file mode 100644
index 75b817bab..000000000
--- a/ui-react/src/components/loop_viewer/logs/__snapshots__/LoopLogs.test.js.snap
+++ /dev/null
@@ -1,61 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify LoopLogs Test the render method 1`] = `
-<styled.div>
-  <label>
-    Loop Logs
-  </label>
-  <Styled(Component)
-    hover={true}
-    responsive={true}
-    striped={true}
-    variant={true}
-  >
-    <thead>
-      <tr>
-        <th>
-          <span
-            align="left"
-          >
-            Date
-          </span>
-        </th>
-        <th>
-          <span
-            align="left"
-          >
-            Type
-          </span>
-        </th>
-        <th>
-          <span
-            align="left"
-          >
-            Component
-          </span>
-        </th>
-        <th>
-          <span
-            align="right"
-          >
-            Log
-          </span>
-        </th>
-      </tr>
-    </thead>
-    <tbody>
-      <TableRow
-        logRow={
-          Object {
-            "id": 1,
-            "logComponent": "CLAMP",
-            "logInstant": "2019-07-08T09:44:37Z",
-            "logType": "INFO",
-            "message": "Operational policies UPDATED",
-          }
-        }
-      />
-    </tbody>
-  </Styled(Component)>
-</styled.div>
-`;
diff --git a/ui-react/src/components/loop_viewer/status/LoopStatus.js b/ui-react/src/components/loop_viewer/status/LoopStatus.js
deleted file mode 100644
index d960c31e6..000000000
--- a/ui-react/src/components/loop_viewer/status/LoopStatus.js
+++ /dev/null
@@ -1,105 +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 Table from 'react-bootstrap/Table';
-import styled from 'styled-components';
-import LoopCache from '../../../api/LoopCache';
-
-const LoopStatusViewDivStyled = styled.div`
-	background-color: ${props => props.theme.loopViewerHeaderBackgroundColor};
-	padding: 10px 10px;
-	color: ${props => props.theme.loopViewerHeaderFontColor};
-`
-
-const TableStyled = styled(Table)`
-    overflow: auto;
-`
-
-const TableRow = ({ statusRow }) => (
-	<tr>
-		<td>{statusRow.componentName}</td>
-		<td>{statusRow.stateName}</td>
-		<td>{statusRow.description}</td>
-	</tr>
-
-)
-
-export default class LoopStatus extends React.Component {
-	state = {
-		loopCache: new LoopCache({})
-	}
-
-	constructor(props) {
-		super(props);
-		this.renderStatus = this.renderStatus.bind(this);
-		this.state.loopCache = props.loopCache;
-	}
-
-
-	renderStatus() {
-		if (this.state.loopCache.getComponentStates() != null) {
-			return Object.keys(this.state.loopCache.getComponentStates()).map((key) => {
-				console.debug("Adding status for: ",key);
-				var res={}
-				res[key]=this.state.loopCache.getComponentStates()[key];
-				return (<TableRow statusRow={{'componentName':key,'stateName':this.state.loopCache.getComponentStates()[key].componentState.stateName,'description':this.state.loopCache.getComponentStates()[key].componentState.description}} />)
-			})
-
-		}
-	}
-
-	shouldComponentUpdate(nextProps, nextState) {
-		return this.state.loopCache !== nextState.loopCache;
-	}
-
-	componentWillReceiveProps(newProps) {
-		this.setState({
-			loopCache: newProps.loopCache
-		});
-	}
-
-	render() {
-		return (
-			<LoopStatusViewDivStyled>
-				<label>Loop Status: {this.state.loopCache.getComputedState()}
-				</label>
-
-				<div >
-					<TableStyled striped hover variant responsive>
-						<thead>
-							<tr>
-								<th><span align="left">Component Name</span></th>
-								<th><span align="left">Component State</span></th>
-								<th><span align="right">Description</span></th>
-							</tr>
-						</thead>
-						<tbody>
-							{this.renderStatus()}
-						</tbody>
-					</TableStyled>
-				</div>
-			</LoopStatusViewDivStyled>
-		);
-	}
-}
-
diff --git a/ui-react/src/components/loop_viewer/status/LoopStatus.test.js b/ui-react/src/components/loop_viewer/status/LoopStatus.test.js
deleted file mode 100644
index 8d0448796..000000000
--- a/ui-react/src/components/loop_viewer/status/LoopStatus.test.js
+++ /dev/null
@@ -1,78 +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 LoopStatus from './LoopStatus';
-import LoopCache from '../../../api/LoopCache';
-
-describe('Verify LoopStatus', () => {
-
-	const loopCache = new LoopCache({
-		"name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca",
-		"lastComputedState": "DESIGN",
-		"components": {
-			"POLICY": {
-				"componentState": {
-					"stateName": "NOT_SENT",
-					"description": "The policies defined have NOT yet been created on the policy engine"
-				}
-			},
-			"DCAE": {
-				"componentState": {
-					"stateName": "BLUEPRINT_DEPLOYED",
-					"description": "The DCAE blueprint has been found in the DCAE inventory but not yet instancianted for this loop"
-				}
-			}
-		}
-	});
-
-	it('Test the render method', () => {
-		const component = shallow(<LoopStatus loopCache={loopCache}/>)
-
-		expect(component).toMatchSnapshot();
-		
-		const loopCacheUpdated = new LoopCache({
-			"name": "LOOP_Jbv1z_v1_0_ResourceInstanceName1_tca",
-			"lastComputedState": "SUBMIT",
-			"components": {
-				"POLICY": {
-					"componentState": {
-						"stateName": "SENT",
-						"description": "The policies defined have NOT yet been created on the policy engine"
-					}
-				},
-				"DCAE": {
-					"componentState": {
-						"stateName": "BLUEPRINT_DEPLOYED",
-						"description": "The DCAE blueprint has been found in the DCAE inventory but not yet instancianted for this loop"
-					}
-				}
-			}
-		});
-		component.setProps({ loopCache: loopCacheUpdated });
-
-		const forms = component.find('TableRow');
-		expect(forms.get(0).props.statusRow.stateName).toEqual("SENT");
-		expect(component.find('label').text()).toContain('SUBMIT');
-	});
-});
\ No newline at end of file
diff --git a/ui-react/src/components/loop_viewer/status/__snapshots__/LoopStatus.test.js.snap b/ui-react/src/components/loop_viewer/status/__snapshots__/LoopStatus.test.js.snap
deleted file mode 100644
index 73da5fff1..000000000
--- a/ui-react/src/components/loop_viewer/status/__snapshots__/LoopStatus.test.js.snap
+++ /dev/null
@@ -1,64 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify LoopStatus Test the render method 1`] = `
-<styled.div>
-  <label>
-    Loop Status: 
-    DESIGN
-  </label>
-  <div>
-    <Styled(Component)
-      hover={true}
-      responsive={true}
-      striped={true}
-      variant={true}
-    >
-      <thead>
-        <tr>
-          <th>
-            <span
-              align="left"
-            >
-              Component Name
-            </span>
-          </th>
-          <th>
-            <span
-              align="left"
-            >
-              Component State
-            </span>
-          </th>
-          <th>
-            <span
-              align="right"
-            >
-              Description
-            </span>
-          </th>
-        </tr>
-      </thead>
-      <tbody>
-        <TableRow
-          statusRow={
-            Object {
-              "componentName": "POLICY",
-              "description": "The policies defined have NOT yet been created on the policy engine",
-              "stateName": "NOT_SENT",
-            }
-          }
-        />
-        <TableRow
-          statusRow={
-            Object {
-              "componentName": "DCAE",
-              "description": "The DCAE blueprint has been found in the DCAE inventory but not yet instancianted for this loop",
-              "stateName": "BLUEPRINT_DEPLOYED",
-            }
-          }
-        />
-      </tbody>
-    </Styled(Component)>
-  </div>
-</styled.div>
-`;
diff --git a/ui-react/src/components/loop_viewer/svg/SvgGenerator.js b/ui-react/src/components/loop_viewer/svg/SvgGenerator.js
deleted file mode 100644
index f5f5047ba..000000000
--- a/ui-react/src/components/loop_viewer/svg/SvgGenerator.js
+++ /dev/null
@@ -1,246 +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 styled from 'styled-components';
-import { withRouter } from "react-router-dom";
-import LoopCache from '../../../api/LoopCache';
-import OnapConstant from '../../../utils/OnapConstants';
-
-const DivStyled = styled.div`
-	overflow-x: scroll;
-	  display: flex;
-    width: 100%;
-    height: 100%;
-`
-
-const emptySvg = (<svg> <text x="60" y="40">No LOOP (SVG)</text> </svg>);
-
-class SvgGenerator extends React.Component {
-    boxWidth = 200;
-    boxHeight = 100;
-    boxSpace = 50;
-
-    static GENERATED_FROM_INSTANCE = "INSTANCE";
-    static GENERATED_FROM_TEMPLATE = "TEMPLATE";
-
-	state = {
-		loopCache: new LoopCache({}),
-		clickable: false,
-		generatedFrom: SvgGenerator.GENERATED_FROM_INSTANCE, // INSTANCE / TEMPLATE
-	}
-
-	constructor(props) {
-		super(props);
-		this.state.loopCache = props.loopCache;
-		this.state.clickable = props.clickable;
-		this.state.generatedFrom = props.generatedFrom;
-		this.handleSvgClick = this.handleSvgClick.bind(this);
-		this.renderSvg = this.renderSvg.bind(this);
-	}
-
-	shouldComponentUpdate(nextProps, nextState) {
-		return this.state.loopCache !== nextState.loopCache;
-	}
-
-	componentWillReceiveProps(newProps) {
-		if (this.state.loopCache !== newProps.loopCache) {
-			this.setState({
-				loopCache: newProps.loopCache,
-			});
-		}
-	}
-
-	handleSvgClick(event) {
-		console.debug("svg click event received");
-		if (this.state.clickable) {
-			var elementName = event.target.parentNode.getAttribute('policyId');
-			console.info("SVG element clicked", elementName);
-			// Only allow movement to policy editing IF there busyLoadingCOunt is 0,
-			// meaning we are not waiting for refreshStatus to complete, for example
-			if (elementName !== null && !this.props.isBusyLoading()) {
-				this.props.history.push("/policyModal/"+event.target.parentNode.getAttribute('policyType')+"/"+elementName);
-			}
-		}
-	}
-
-    createVesBox (xPos) {
-        return this.createOneBox(xPos,null,null,'VES Collector','VES',null);
-    }
-
-    createOneArrow(xPos) {
-        return (
-         <svg width={this.boxSpace} height={this.boxHeight} x={xPos}>
-           <defs>
-            		<marker viewBox="0 0 20 20" markerWidth="20" markerHeight="20" orient="auto" refX="8.5" refY="5" id="arrow">
-            			<path d="m 1 5 l 0 -3 l 7 3 l -7 3 z"
-            				stroke-width= "1" stroke-linecap= "butt" stroke-dasharray= "10000, 1"
-            				fill="#000000" stroke="#000000" />
-            		</marker>
-           </defs>
-           <line x1="0" y1="50%" x2="100%" y2="50%" stroke-width="2" color="black" stroke="black" marker-end="url(#arrow)"/>
-         </svg>
-        );
-    }
-
-    createBeginCircle(xPos, text) {
-            return (
-            <svg width={this.boxWidth} height={this.boxHeight} x={xPos}>
-                <circle cx={this.boxWidth-30} cy="50%" r="30" stroke-width="1" color="black" stroke="black" fill="#27ae60"/>
-                <text x={this.boxWidth-30} y="50%" text-anchor="middle" dominant-baseline="middle" textLength="20%" lengthAdjust="spacingAndGlyphs" >{text}</text>
-            </svg>
-            );
-    }
-
-    createEndCircle(xPos, text) {
-            return (
-            <svg width={this.boxWidth} height={this.boxHeight} x={xPos}>
-                <circle cx={30} cy="50%" r="30" stroke-width="2" color="black" stroke="black" fill="#27ae60"/>
-                <text x={30} y="50%" text-anchor="middle" dominant-baseline="middle" textLength="20%" lengthAdjust="spacingAndGlyphs" >{text}</text>
-            </svg>
-            );
-    }
-
-    createOneBox(xPos, policyId, loopElementModelId , name, title, policyType) {
-        return (
-        <svg width={this.boxWidth} height={this.boxHeight} x={xPos} title="test">
-            <g policyId={policyId} loopElementModelId={loopElementModelId} policyType={policyType}>
-                <rect width="100%" height="100%" stroke-width="2" color="black" stroke="black" fill="#1abc9c"/>
-                <text x="50%" y="15%" color="white" fill="white" dominant-baseline="middle" text-anchor="middle" textLength="50%" lengthAdjust="spacingAndGlyphs">{title}</text>
-                <text x="50%" y="50%" text-anchor="middle" dominant-baseline="middle" textLength="80%" lengthAdjust="spacingAndGlyphs" >{name}</text>
-                <text x="50%" y="80%" text-anchor="middle" dominant-baseline="middle" textLength="110%" lengthAdjust="spacingAndGlyphs" >{policyId}</text>
-            </g>
-        </svg>
-        );
-    }
-
-    createSvgFromTemplate() {
-        const allElements = [];
-        var xPos = 0;
-
-        allElements.push(this.createBeginCircle(xPos,"Start"))
-        xPos+=(this.boxWidth+this.boxSpace);
-
-        allElements.push(this.createOneArrow(xPos-this.boxSpace));
-
-        allElements.push(this.createVesBox(xPos));
-        xPos+=(this.boxWidth+this.boxSpace);
-
-        allElements.push(this.createOneArrow(xPos-this.boxSpace));
-        //createOneBox(xPos, policyId, loopElementModelId , name, title, policyType)
-        for (var loopElement of this.state.loopCache.getAllLoopElementModels()) {
-
-            allElements.push(this.createOneBox(xPos,
-                loopElement['name'],
-                loopElement['name'],
-                loopElement['shortName'],
-                loopElement['loopElementType'],
-                loopElement['loopElementType']))
-            xPos+=(this.boxWidth+this.boxSpace);
-            allElements.push(this.createOneArrow(xPos-this.boxSpace));
-        }
-
-        allElements.push(this.createEndCircle(xPos, "End"))
-        xPos+=(this.boxWidth+this.boxSpace);
-
-        return allElements;
-    }
-
-    createSvgFromInstance() {
-        const allElements = [];
-        var xPos = 0;
-
-        allElements.push(this.createBeginCircle(xPos,"Start"))
-        xPos+=(this.boxWidth+this.boxSpace);
-
-        allElements.push(this.createOneArrow(xPos-this.boxSpace));
-
-        allElements.push(this.createVesBox(xPos));
-        xPos+=(this.boxWidth+this.boxSpace);
-
-        allElements.push(this.createOneArrow(xPos-this.boxSpace));
-
-        for (var msPolicy in this.state.loopCache.getMicroServicePolicies()) {
-            var loopElementModelName =  this.state.loopCache.getMicroServicePolicies()[msPolicy]['loopElementModel'];
-            if (loopElementModelName !== undefined) {
-                loopElementModelName = loopElementModelName['name'];
-            }
-            allElements.push(this.createOneBox(xPos,
-                this.state.loopCache.getMicroServicePolicies()[msPolicy]['name'],
-                loopElementModelName,
-                this.state.loopCache.getMicroServicePolicies()[msPolicy]['policyModel']['policyAcronym'],
-                'microservice',
-                OnapConstant.microServiceType))
-            xPos+=(this.boxWidth+this.boxSpace);
-            allElements.push(this.createOneArrow(xPos-this.boxSpace));
-        }
-
-        for (var opPolicy in this.state.loopCache.getOperationalPolicies()) {
-            loopElementModelName =  this.state.loopCache.getOperationalPolicies()[opPolicy]['loopElementModel'];
-            if (loopElementModelName !== undefined) {
-                loopElementModelName = loopElementModelName['name'];
-            }
-            allElements.push(this.createOneBox(xPos,
-                this.state.loopCache.getOperationalPolicies()[opPolicy]['name'],
-                loopElementModelName,
-                this.state.loopCache.getOperationalPolicies()[opPolicy]['policyModel']['policyAcronym'],
-                'operational',
-                OnapConstant.operationalPolicyType))
-            xPos+=(this.boxWidth+this.boxSpace);
-            allElements.push(this.createOneArrow(xPos-this.boxSpace));
-        }
-
-        allElements.push(this.createEndCircle(xPos, "End"))
-        xPos+=(this.boxWidth+this.boxSpace);
-
-        return allElements;
-    }
-
-    renderSvg() {
-        if (this.state.loopCache.getLoopName() === undefined) {
-            return [emptySvg];
-        }
-        if (this.state.generatedFrom === SvgGenerator.GENERATED_FROM_INSTANCE) {
-            return this.createSvgFromInstance();
-        } else if (this.state.generatedFrom === SvgGenerator.GENERATED_FROM_TEMPLATE) {
-            return this.createSvgFromTemplate();
-        }
-    }
-
-    render() {
-        var allTheElements = this.renderSvg();
-        var svgWidth = this.boxWidth*allTheElements.length;
-        var svgHeight = this.boxHeight+50;
-        return (
-
-            <DivStyled onClick={this.handleSvgClick} >
-                <svg height={svgHeight} width={svgWidth}  viewBox="0,0,{svgWidth},{svgHeight}" preserveAspectRatio="none">
-									<svg x="-50" y="25">
-                    {allTheElements}
-									</svg>
-                </svg>
-            </DivStyled>
-        );
-    }
-}
-
-export default withRouter(SvgGenerator);
diff --git a/ui-react/src/components/menu/MenuBar.js b/ui-react/src/components/menu/MenuBar.js
deleted file mode 100644
index 995db9e16..000000000
--- a/ui-react/src/components/menu/MenuBar.js
+++ /dev/null
@@ -1,123 +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 Nav from 'react-bootstrap/Nav';
-import Navbar from 'react-bootstrap/Navbar';
-import NavDropdown from 'react-bootstrap/NavDropdown';
-import OnapConstants from '../../utils/OnapConstants';
-import 'bootstrap-css-only/css/bootstrap.min.css';
-import styled from 'styled-components';
-import { Link } from 'react-router-dom';
-
-const StyledLink = styled(Link)`
-    color: ${props => props.theme.menuFontColor};
-    background-color: ${props => props.theme.menuBackgroundColor};
-    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: ${props => props.theme.menuHighlightedBackgroundColor};
-        color:  ${props => props.theme.menuHighlightedFontColor};
-    }
-`;
-const StyledNavLink = styled(Nav.Link)`
-    color: ${props => props.theme.menuFontColor};
-    background-color: ${props => props.theme.menuBackgroundColor};
-    font-weight: normal;
-    padding: .25rem 1.5rem;
-    :hover {
-        background-color: ${props => props.theme.menuHighlightedBackgroundColor};
-        color:  ${props => props.theme.menuHighlightedFontColor};
-    }
-`;
-
-const StyledNavDropdown = styled(NavDropdown)`
-    color: ${props => props.theme.menuFontColor};
-    & .dropdown-toggle {
-    color: ${props => props.theme.menuFontColor};
-    background-color: ${props => props.theme.backgroundColor};
-    font-weight: normal;
-        :hover {
-                font-weight: bold;
-        }
-    }
-`;
-
-export default class MenuBar extends React.Component {
-    state = {
-        loopName: this.props.loopName,
-        disabled: true
-    };
-
-    componentWillReceiveProps(newProps) {
-        if (newProps.loopName !== OnapConstants.defaultLoopName) {
-            this.setState({ disabled: false });
-        } else {
-            this.setState({ disabled: true });
-        }
-    }
-
-    render () {
-        return (
-                <Navbar.Collapse>
-                    <StyledNavDropdown title="POLICY Framework">
-                            <NavDropdown.Item as={StyledLink} to="/viewAllPolicies">View All Policies</NavDropdown.Item>
-                    </StyledNavDropdown>
-                    <StyledNavDropdown title="CLAMP Options">
-                            <NavDropdown.Item as={StyledLink} to="/manageDictionaries">Tosca Metadata Dictionaries</NavDropdown.Item>
-                            <NavDropdown.Divider />
-                            <NavDropdown.Item as={StyledLink} to="/viewLoopTemplatesModal">View All Loop Templates</NavDropdown.Item>
-                    </StyledNavDropdown>
-                    <StyledNavDropdown title="LOOP Instance">
-                            <NavDropdown.Item as={StyledLink} to="/createLoop">Create</NavDropdown.Item>
-                            <NavDropdown.Item as={StyledLink} to="/openLoop">Open</NavDropdown.Item>
-                            <NavDropdown.Item as={StyledLink} to="/closeLoop" disabled={this.state.disabled}>Close</NavDropdown.Item>
-                            <NavDropdown.Item as={StyledLink} to="/modifyLoop" disabled={this.state.disabled}>Modify</NavDropdown.Item>
-                            <NavDropdown.Divider />
-                            <NavDropdown.Item as={StyledLink} to="/loopProperties" disabled={this.state.disabled}>Properties</NavDropdown.Item>
-                            <NavDropdown.Item as={StyledLink} to="/refreshStatus" disabled={this.state.disabled}>Refresh Status</NavDropdown.Item>
-                    </StyledNavDropdown>
-                    <StyledNavDropdown title="LOOP Operations">
-                            <NavDropdown.Item as={StyledLink} to="/submit" disabled={this.state.disabled}>Create and deploy to Policy Framework (SUBMIT)</NavDropdown.Item>
-                            <NavDropdown.Item as={StyledLink} to="/stop" disabled={this.state.disabled}>Undeploy from Policy Framework (STOP)</NavDropdown.Item>
-                            <NavDropdown.Item as={StyledLink} to="/restart" disabled={this.state.disabled}>ReDeploy to Policy Framework (RESTART)</NavDropdown.Item>
-                            <NavDropdown.Item as={StyledLink} to="/delete" disabled={this.state.disabled}>Delete loop instance (DELETE)</NavDropdown.Item>
-                            <NavDropdown.Divider />
-                            <NavDropdown.Item as={StyledLink} to="/deploy" disabled={this.state.disabled}>Deploy to DCAE (DEPLOY)</NavDropdown.Item>
-                            <NavDropdown.Item as={StyledLink} to="/undeploy" disabled={this.state.disabled}>UnDeploy to DCAE (UNDEPLOY)</NavDropdown.Item>
-                    </StyledNavDropdown>
-                    <StyledNavDropdown title="Help">
-                            <StyledNavLink href="https://wiki.onap.org/" target="_blank">Wiki</StyledNavLink>
-                            <StyledNavLink href="mailto:onap-discuss@lists.onap.org?subject=CLAMP&body=Please send us suggestions or feature enhancements or defect. If possible, please send us the steps to replicate any defect.">Contact Us</StyledNavLink>
-                            <NavDropdown.Item as={StyledLink} to="/userInfo">User Info</NavDropdown.Item>
-                    </StyledNavDropdown>
-                </Navbar.Collapse>
-        );
-    }
-}
diff --git a/ui-react/src/components/menu/MenuBar.test.js b/ui-react/src/components/menu/MenuBar.test.js
deleted file mode 100644
index 3e96dbf38..000000000
--- a/ui-react/src/components/menu/MenuBar.test.js
+++ /dev/null
@@ -1,46 +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 MenuBar from './MenuBar';
-
-describe('Verify MenuBar', () => {
-
-	it('Test the render method', () => {
-		const component = shallow(<MenuBar />)
-
-		expect(component).toMatchSnapshot();
-	});
-
-	it('Update loopName', () => {
-		const component = shallow(<MenuBar />)
-		component.setProps({ loopName: "newLoop" });
-		expect(component.state('disabled')).toBe(false);
-	});
-
-	it('Default loopName', () => {
-		const component = shallow(<MenuBar />)
-		component.setProps({ loopName: "Empty (NO loop loaded yet)" });
-		expect(component.state('disabled')).toBe(true);
-	});
-});
diff --git a/ui-react/src/components/menu/__snapshots__/MenuBar.test.js.snap b/ui-react/src/components/menu/__snapshots__/MenuBar.test.js.snap
deleted file mode 100644
index ba19097e5..000000000
--- a/ui-react/src/components/menu/__snapshots__/MenuBar.test.js.snap
+++ /dev/null
@@ -1,1070 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Verify MenuBar Test the render method 1`] = `
-<NavbarCollapse>
-  <Styled(NavDropdown)
-    title="POLICY Framework"
-  >
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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="/viewAllPolicies"
-    >
-      View All Policies
-    </DropdownItem>
-  </Styled(NavDropdown)>
-  <Styled(NavDropdown)
-    title="CLAMP Options"
-  >
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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="/manageDictionaries"
-    >
-      Tosca Metadata Dictionaries
-    </DropdownItem>
-    <DropdownDivider
-      role="separator"
-    />
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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="/viewLoopTemplatesModal"
-    >
-      View All Loop Templates
-    </DropdownItem>
-  </Styled(NavDropdown)>
-  <Styled(NavDropdown)
-    title="LOOP Instance"
-  >
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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="/createLoop"
-    >
-      Create
-    </DropdownItem>
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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="/openLoop"
-    >
-      Open
-    </DropdownItem>
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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={true}
-      to="/closeLoop"
-    >
-      Close
-    </DropdownItem>
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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={true}
-      to="/modifyLoop"
-    >
-      Modify
-    </DropdownItem>
-    <DropdownDivider
-      role="separator"
-    />
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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={true}
-      to="/loopProperties"
-    >
-      Properties
-    </DropdownItem>
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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={true}
-      to="/refreshStatus"
-    >
-      Refresh Status
-    </DropdownItem>
-  </Styled(NavDropdown)>
-  <Styled(NavDropdown)
-    title="LOOP Operations"
-  >
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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={true}
-      to="/submit"
-    >
-      Create and deploy to Policy Framework (SUBMIT)
-    </DropdownItem>
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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={true}
-      to="/stop"
-    >
-      Undeploy from Policy Framework (STOP)
-    </DropdownItem>
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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={true}
-      to="/restart"
-    >
-      ReDeploy to Policy Framework (RESTART)
-    </DropdownItem>
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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={true}
-      to="/delete"
-    >
-      Delete loop instance (DELETE)
-    </DropdownItem>
-    <DropdownDivider
-      role="separator"
-    />
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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={true}
-      to="/deploy"
-    >
-      Deploy to DCAE (DEPLOY)
-    </DropdownItem>
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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={true}
-      to="/undeploy"
-    >
-      UnDeploy to DCAE (UNDEPLOY)
-    </DropdownItem>
-  </Styled(NavDropdown)>
-  <Styled(NavDropdown)
-    title="Help"
-  >
-    <Styled(NavLink)
-      href="https://wiki.onap.org/"
-      target="_blank"
-    >
-      Wiki
-    </Styled(NavLink)>
-    <Styled(NavLink)
-      href="mailto:onap-discuss@lists.onap.org?subject=CLAMP&body=Please send us suggestions or feature enhancements or defect. If possible, please send us the steps to replicate any defect."
-    >
-      Contact Us
-    </Styled(NavLink)>
-    <DropdownItem
-      as={
-        Object {
-          "$$typeof": Symbol(react.forward_ref),
-          "attrs": Array [],
-          "componentStyle": e {
-            "baseHash": 1014106698,
-            "baseStyle": undefined,
-            "componentId": "sc-bdfBwQ",
-            "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-bdfBwQ",
-          "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="/userInfo"
-    >
-      User Info
-    </DropdownItem>
-  </Styled(NavDropdown)>
-</NavbarCollapse>
-`;
diff --git a/ui-react/src/index.js b/ui-react/src/index.js
deleted file mode 100644
index dd83096ea..000000000
--- a/ui-react/src/index.js
+++ /dev/null
@@ -1,38 +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 ReactDOM from 'react-dom';
-import OnapClamp from './OnapClamp';
-import { Route, MemoryRouter } from 'react-router-dom'
-
-
-const routing = (
-	<MemoryRouter forceRefresh={false}>
-		<Route path="/" component={OnapClamp}/>
-	</MemoryRouter>
-);
-
-export var mainClamp = ReactDOM.render(
-	routing,
-	document.getElementById('root')
-)
diff --git a/ui-react/src/logo.png b/ui-react/src/logo.png
deleted file mode 100644
index c6f6857a5..000000000
--- a/ui-react/src/logo.png
+++ /dev/null
diff --git a/ui-react/src/setupTests.js b/ui-react/src/setupTests.js
deleted file mode 100644
index f5535835c..000000000
--- a/ui-react/src/setupTests.js
+++ /dev/null
@@ -1,28 +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 { configure } from 'enzyme';
-import Adapter from 'enzyme-adapter-react-17-updated';
-
-configure({ adapter: new Adapter() });
-global.fetch = require('jest-fetch-mock');
\ No newline at end of file
diff --git a/ui-react/src/theme/globalStyle.js b/ui-react/src/theme/globalStyle.js
deleted file mode 100644
index 1e316d20b..000000000
--- a/ui-react/src/theme/globalStyle.js
+++ /dev/null
@@ -1,98 +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 { createGlobalStyle } from 'styled-components';
-
-export const GlobalClampStyle = createGlobalStyle`
-	body {
-		padding: 0;
-		margin: 0;
-		font-family: ${props => props.theme.fontFamily};
-		font-size: ${props => props.theme.fontSize};
-		font-weight: normal;
-	}
-
-	span {
-		font-family: ${props => props.theme.fontFamily};
-		font-size: ${props => props.theme.fontSize};
-		font-weight: bold;
-	}
-
-	a {
-		font-family: ${props => props.theme.fontFamily};
-		font-size: ${props => props.theme.fontSize};
-		font-weight: bold;
-	}
-
-	div {
-		font-family: ${props => props.theme.fontFamily};
-		font-size: ${props => props.theme.fontSize};
-		border-radius: 4px;
-		margin-top: 1px;
-	}
-
-	label {
-		font-family: ${props => props.theme.fontFamily};
-		font-size: ${props => props.theme.fontSize};
-		font-weight: bold;
-	}
-
-	button {
-		font-family: ${props => props.theme.fontFamily};
-		font-size: ${props => props.theme.fontSize};
-		font-weight: bold;
-	}
-
-`
-
-export const DefaultClampTheme = {
-	fontDanger: '#eb238e',
-	fontWarning: '#eb238e',
-	fontLight: '#ffffff',
-	fontDark: '#888888',
-	fontHighlight: '#ffff00',
-	fontNormal: 'black',
-
-	backgroundColor: '#eeeeee',
-	fontFamily: 'Arial, Sans-serif',
-	fontSize: '16px',
-
-	loopViewerBackgroundColor: 'white',
-	loopViewerFontColor: 'yellow',
-	loopViewerHeaderBackgroundColor: '#337ab7',
-	loopViewerHeaderFontColor: 'white',
-
-    loopLogsHeaderBackgroundColor:  'white',
-    loopLogsHeaderFontColor: 'black',
-
-	menuBackgroundColor: 'white',
-	menuFontColor: 'black',
-	menuHighlightedBackgroundColor: '#337ab7',
-	menuHighlightedFontColor: 'white',
-
-	toscaTextareaBackgroundColor: 'white',
-	toscaTextareaFontSize: '13px',
-
-	policyEditorBackgroundColor: 'white',
-	policyEditorFontSize: '13px'
-};
diff --git a/ui-react/src/utils/CsvToJson.js b/ui-react/src/utils/CsvToJson.js
deleted file mode 100644
index 5ec19c9e2..000000000
--- a/ui-react/src/utils/CsvToJson.js
+++ /dev/null
@@ -1,204 +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============================================
- * ===================================================================
- *
- */
-
-export default function CsvToJson(rawCsvData, delimiter, internalDelimiter, csvHeaderNames, jsonKeyNames, mandatory) {
-
-	let printDictKeys = '';
-	let result = { jsonObjArray: [], errorMessages: '' };
-
-	// Validate that all parallel arrays passed in have same number of elements;
-	// this would be a developer error.
-
-	let checkLength = csvHeaderNames.length;
-
-	if (checkLength !== jsonKeyNames.length || checkLength !== mandatory.length) {
-		result.errorMessages = 'interanl error: csvHeaderNames, jsonKeyNames, and mandatory arrays parameters are not the same length';
-		return result;
-	}
-
-	if (checkLength < 1) {
-		result.errorMessages = 'interanl error: csvHeaderNames, jsonKeyNames, and mandatory arrays have no entries';
-		return result;
-	}
-
-	// Make a nice string to print in the error case to tell user what is the
-	//  required heaer row format
-
-	for (let i=0; i < csvHeaderNames.length; ++i) {
-		if (i === 0) {
-			printDictKeys = csvHeaderNames[i];
-		} else {
-			printDictKeys += ',' +  csvHeaderNames[i];
-		}
-	}
-
-	let dictElems = rawCsvData.split('\n');
-	let numColumns = 0;
-	let filteredDictElems = [];
-
-	// The task of the following loop is to convert raw CSV rows into easily parseable
-	// and streamlined versions of the rows with an internalDelimiter replacing the standard
-	// comma; it is presumed (and checked) that the internalDelimiter cannot exist as a valid
-	// sequence of characters in the user's data.
-
-	// This conversion process also strips leading and trailing whitespace from each row,
-	// discards empty rows, correctly interprets and removes all double quotes that programs like
-	// Excel use to support user columns that contain special characters, most notably, the comma
-	// delimiter. A double-quote that is contained within a double-quoted column value 
-	// must appear in this raw data as a sequence of two double quotes. Furthermore, any column
-	// value in the raw CSV data that does not contain a delimiter may or may not be enclosed in
-	// double quotes. It is the Excel convention to not use double qoutes unless necessary, and
-	// there is no reasonable way to tell Excel to surround every column value with double quotes. 
-	// Any files that were directly "exported" by CLAMP itself from the Managing Dictionaries
-	// capability, surround all columns with double quotes.
-
-	for (let i = 0; i < dictElems.length; i++) {
-
-		let oneRow = dictElems[i].trim();
-		let j = 0;
-		let inQuote = false
-		let nextChar = undefined;
-		let prevChar = null;
-
-		
-		if (oneRow === '') {
-			continue; // Skip blank rows
-		} else if (oneRow.indexOf(internalDelimiter) !== -1) {
-			result.errorMessages += '\nRow #' + i + ' contains illegal sequence of characters (' + internalDelimiter + ')';
-			break;
-		} else {
-			nextChar = oneRow[1];
-		}
-
-		let newStr = '';
-		numColumns = 1;
-
-		// This "while loop" performs the very meticulous task of removing double quotes that
-		// are used by Excel to encase special characters as user string value data,
-		// and manages to correctly identify columns that are defined with or without
-		// double quotes and to process the comma delimiter correctly when encountered
-		// as a user value within a column. Such a column would have to be encased in
-		// double quotes; a comma found outside double quotes IS a delimiter.
-
-		while (j < oneRow.length) {
-		 	if (oneRow[j] === '"') {
-		 		if (inQuote === false) {
-					if (prevChar !== delimiter && prevChar !== null) {
-						result.errorMessages += '\nMismatched double quotes or illegal whitespace around delimiter at row #' + (i + 1) + ' near column #' + numColumns;
-						break;
-					} else {
-						inQuote = true;
-					}
-				} else {
-					if (nextChar === '"') {
-						newStr += '"';
-						++j;
-					} else if ((nextChar !== delimiter) && (nextChar !== undefined)) {
-						result.errorMessages += '\nRow #' + (i + 1) + ' is badly formatted at column #' + numColumns + '. Perhaps an unescaped double quote.';
-						break;
-					} else if (nextChar === delimiter) {
-						++numColumns;
-						inQuote = false;
-						newStr += internalDelimiter;
-						prevChar = delimiter;
-						j += 2;
-						nextChar = oneRow[j+1];
-						continue;
-					} else {
-						++numColumns;
-						inQuote = false;
-						break;
-					}
-				}
-			} else {
-				if (oneRow[j] === delimiter && inQuote === false) {
-					newStr += internalDelimiter;
-					++numColumns;
-				} else {
-					newStr += oneRow[j];
-				}
-			}
-			prevChar = oneRow[j];
-			++j;
-			nextChar = oneRow[j+1]; // can result in undefined at the end
-		}
-
-		if (result.errorMessages === '' && inQuote !== false) {
-			result.errorMessages += '\nMismatched double quotes at row #' + (i + 1);
-			break;
-		} else if (result.errorMessages === '' && numColumns < jsonKeyNames.length) {
-			result.errorMessages += '\nNot enough columns (' + jsonKeyNames.length + ') at row #' + (i + 1);
-			break;
-		}
-
-		filteredDictElems.push(newStr);
-	}
-
-	if (result.errorMessages !== '') {
-		return result;
-	}
-
-	// Perform further checks on data that is now in JSON form
-	if (filteredDictElems.length < 2) {
-		result.errorMessages += '\nNot enough row data found in import file. Need at least a header row and one row of data';
-		return result;
-	}
-
-	// Now that we have something reliably parsed into sanitized columns lets run some checks
-	// and convert it all into an array of JSON objects to push to the back end if all the
-	// checks pass.
-
-	let headers = filteredDictElems[0].split(internalDelimiter);
-
-	// check that headers are included in proper order
-	for (let i=0; i < jsonKeyNames.length; ++i) {
-		if (csvHeaderNames[i] !== headers[i]) {
-			result.errorMessages += 'Row 1 header key at column #' + (i + 1) + ' is a mismatch. Expected row header must contain at least:\n' + printDictKeys; 
-			return result;
-		}
-	}
-
-	// Convert the ASCII rows of data into an array of JSON obects that omit the header
-	// row which is not sent to the back end.
-
-	for (let i = 1; i < filteredDictElems.length; i++) {
-		let data = filteredDictElems[i].split(internalDelimiter);
-		let obj = {};
-		for (let j = 0; j < data.length && j < jsonKeyNames.length; j++) {
-			let value = data[j].trim();
-			if (mandatory[j] === true && value === '') {
-				result.errorMessages += '\n' + csvHeaderNames[j] + ' at row #' + (i+1) + ' is empty but requires a value.';
-			}
-			obj[jsonKeyNames[j]] = value;
-		}
-		result.jsonObjArray.push(obj);
-	}
-
-	if (result.errorMessages !== '') {
-		// If we have errors, return empty parse result even though some things
-		// may have parsed properly. We do not want to encourage the caller
-		// to think the data is good for use.
-		result.jsonObjArray = [];
-	}
-
-	return result;
-}
diff --git a/ui-react/src/utils/CsvToJson.test.js b/ui-react/src/utils/CsvToJson.test.js
deleted file mode 100644
index 88fa7a472..000000000
--- a/ui-react/src/utils/CsvToJson.test.js
+++ /dev/null
@@ -1,268 +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 CsvToJson from './CsvToJson'
-
-describe('Verify CsvToJson', () => {
-
-	const hdrNames= [ 
-		"Element Short Name",
-		"Element Name",
-		"Element Description",
-		"Element Type",
-		"Sub-Dictionary"
-	];
-
-	const jsonKeyNames = [
-		"shortName",
-		"name",
-		"description",
-		"type",
-		"subDictionary"
-	];
-
-	const mandatory = [ true, true, true, true, false ];
-
-	it('Test CsvToJson No Error Case, Quoted Columns', () => {
-
-		let rawCsv = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += '"alertType","Alert Type","Type of Alert","string","","admin","2020-06-11T13:56:14.927437Z"';
-				
-		let expectedResult = {
-			 errorMessages: '',
-			 jsonObjArray: [
-				{
-					description: "Type of Alert",
-					name: "Alert Type",
-					shortName: "alertType",
-					subDictionary: "",
-					type: "string"
-				}
-			]
-		};
-
-		expect(CsvToJson(rawCsv, ',', '|', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson No Error Case, Unquoted Columns', () => {
-
-		let rawCsv = 'Element Short Name,Element Name,Element Description,Element Type,Sub-Dictionary\n';
-		rawCsv += 'alertType,Alert Type,Type of Alert,string,,admin,2020-06-11T13:56:14.927437Z';
-				
-		let expectedResult = {
-			 errorMessages: '',
-			 jsonObjArray: [
-				{
-					description: "Type of Alert",
-					name: "Alert Type",
-					shortName: "alertType",
-					subDictionary: "",
-					type: "string"
-				}
-			]
-		};
-
-		expect(CsvToJson(rawCsv, ',', '|', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson Properly Escaped Double Quote and Delimiter', () => {
-
-		let rawCsv = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += '"alertType","Alert ""Type""","Type of Alert, Varies","string","","admin","2020-06-11T13:56:14.927437Z"';
-		
-		let errorMessage = '';
-				
-		let expectedResult = {
-			errorMessages: errorMessage,
-			jsonObjArray: [
-				{
-					description: "Type of Alert, Varies",
-					name: 'Alert "Type"',
-					shortName: 'alertType',
-					subDictionary: "",
-					type: "string",
-				}
-
-			]
-		};
-
-		expect(CsvToJson(rawCsv, ',', '|', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-
-
-	it('Test CsvToJson Error Header Mismatch Error Case', () => {
-
-		let rawCsv = '"Element Short Names","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += '"alertType","Alert Type","Type of Alert","string","","admin","2020-06-11T13:56:14.927437Z"';
-		
-		let errorMessage = 'Row 1 header key at column #1 is a mismatch. Expected row header must contain at least:\n';
-		errorMessage += 'Element Short Name,Element Name,Element Description,Element Type,Sub-Dictionary';
-				
-		let expectedResult = {
-			 errorMessages: errorMessage,
-			 jsonObjArray: []
-		};
-
-		expect(CsvToJson(rawCsv, ',', '|', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson Error Mismatched Double Quotes in Column', () => {
-
-		let rawCsv = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += '"alert"Type","Alert Type","Type of Alert","string","","admin","2020-06-11T13:56:14.927437Z"';
-		
-		let errorMessage = '\nRow #2 is badly formatted at column #1. Perhaps an unescaped double quote.'
-				
-		let expectedResult = {
-			 errorMessages: errorMessage,
-			 jsonObjArray: []
-		};
-
-		expect(CsvToJson(rawCsv, ',', '|', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson Error Illegal Whitespace', () => {
-
-		let rawCsv = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += 'alertType ,  "Alert Type","Type of Alert","string","","admin","2020-06-11T13:56:14.927437Z"';
-		
-		let errorMessage = '\nMismatched double quotes or illegal whitespace around delimiter at row #2 near column #2';
-				
-		let expectedResult = {
-			 errorMessages: errorMessage,
-			 jsonObjArray: []
-		};
-
-		expect(CsvToJson(rawCsv, ',', '|', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson Error Too Few Data Columns', () => {
-
-		let rawCsv = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += '"alertType","Alert Type","Type of Alert"';
-		
-		let errorMessage = '\nNot enough columns (5) at row #2';
-				
-		let expectedResult = {
-			errorMessages: errorMessage,
-			jsonObjArray: []
-		};
-
-		expect(CsvToJson(rawCsv, ',', '|', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson Error Wrong Header Column Order', () => {
-
-		let rawCsv = '"Element Name","Element Short Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += '"alertType","Alert Type","Type of Alert","string","","admin","2020-06-11T13:56:14.927437Z"';
-		
-		let errorMessage = 'Row 1 header key at column #1 is a mismatch. Expected row header must contain at least:\n';
-		errorMessage += 'Element Short Name,Element Name,Element Description,Element Type,Sub-Dictionary';
-				
-		let expectedResult = {
-			errorMessages: errorMessage,
-			jsonObjArray: []
-		};
-
-		expect(CsvToJson(rawCsv, ',', '|', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson Error Not Enough Rows', () => {
-
-		let rawCsv = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		
-		let errorMessage = '\nNot enough row data found in import file. Need at least a header row and one row of data';
-				
-		let expectedResult = {
-			errorMessages: errorMessage,
-			jsonObjArray: []
-		};
-
-		expect(CsvToJson(rawCsv, ',', '|', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson Error Mandatory Field Is Empty', () => {
-
-		let rawCsv = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += '"","Alert Type","Type of Alert","string","","admin","2020-06-11T13:56:14.927437Z"';
-				
-		let expectedResult = {
-			 errorMessages: '\nElement Short Name at row #2 is empty but requires a value.',
-			 jsonObjArray: []
-		};
-
-		expect(CsvToJson(rawCsv, ',', '|', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson Error Mismatched Double Quotes At End', () => {
-
-		let rawCsv = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += '"alertType","Alert Type","Alert Type Description","string","admin","2020-06-11T13:56:14.927437Z';
-				
-		let expectedResult = {
-			 errorMessages: '\nMismatched double quotes at row #2',
-			 jsonObjArray: []
-		};
-
-		expect(CsvToJson(rawCsv, ',', '||', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson Error Mismatched Mandatory Array Parameters', () => {
-
-		let rawCsv = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += '"alertType","Alert Type","Alert Type Description","string","admin","2020-06-11T13:56:14.927437Z';
-				
-		let expectedResult = {
-			 errorMessages: 'interanl error: csvHeaderNames, jsonKeyNames, and mandatory arrays parameters are not the same length',
-			 jsonObjArray: []
-		};
-
-		expect(CsvToJson(rawCsv, ',', '||', hdrNames, jsonKeyNames, [ true ])).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson Error Empty Mandatory Array Parameters', () => {
-
-		let rawCsv = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += '"alertType","Alert Type","Alert Type Description","string","admin","2020-06-11T13:56:14.927437Z';
-				
-		let expectedResult = {
-			 errorMessages: 'interanl error: csvHeaderNames, jsonKeyNames, and mandatory arrays have no entries',
-			 jsonObjArray: []
-		};
-
-		expect(CsvToJson(rawCsv, ',', '||', [], [], [])).toEqual(expectedResult);
-	});
-
-	it('Test CsvToJson Error Illegal Data Contains Internal Delimiter', () => {
-
-		let rawCsv = '"Element Short Name","Element Name","Element Description","Element Type","Sub-Dictionary"\n';
-		rawCsv += '"alertType","Alert Type","Alert Type||Description","string","admin","2020-06-11T13:56:14.927437Z';
-
-		let expectedResult = {
-			 errorMessages: '\nRow #1 contains illegal sequence of characters (||)',
-			 jsonObjArray: []
-		};
-
-		expect(CsvToJson(rawCsv, ',', '||', hdrNames, jsonKeyNames, mandatory)).toEqual(expectedResult);
-	});
-})
diff --git a/ui-react/src/utils/OnapConstants.js b/ui-react/src/utils/OnapConstants.js
deleted file mode 100644
index 8460340d1..000000000
--- a/ui-react/src/utils/OnapConstants.js
+++ /dev/null
@@ -1,32 +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============================================
- * ===================================================================
- *
- */
-
-// Maintain a list of ONAP CLAMP UI "constants" that can be used by any componenet within CLAMP
-
-const OnapConstants = {
-	defaultLoopName: "Empty (NO loop loaded yet)",
-	microServiceType: "MICRO-SERVICE-POLICY",
-	operationalPolicyType: "OPERATIONAL_POLICY_TYPE"
-};
-
-export default OnapConstants;
diff --git a/ui-react/src/utils/OnapUtils.js b/ui-react/src/utils/OnapUtils.js
deleted file mode 100644
index 316a0d65f..000000000
--- a/ui-react/src/utils/OnapUtils.js
+++ /dev/null
@@ -1,65 +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============================================
- * ===================================================================
- *
- */
-
-export default class OnapUtils {
-
-	constructor() {
-		this.clickBlocked = false;
-	}
-
-	static jsonEditorErrorFormatter(errors) {
-
-		let messages = [];
-		let messagesOutputString = null;
-
-		// errors is an array of JSON Editor "error" objects, where each
-		// object looks like this:
-
-		//	{
-		//		message: "Please populate the required property "Threshold""
-		//		path: "root.signatures.0"
-		//		property: "required"
-		//	}
-
-		// In this function we concatenate all the messages, removing any duplicates,
-		// and adding a newline between each message. The result returned is a single
-		// string that can be displayed to the user in an alert message
-
-		if (!Array.isArray(errors)) {
-			console.error('jsoneEditorErrorFormatter was passed a non-array argument');
-		} else {
-			for (let ii=0; ii < errors.length; ++ii) {
-				if (!messages.includes(errors[ii].message)) {
-					messages.push(errors[ii].message);
-					if (messagesOutputString) {
-						messagesOutputString += '\n' + errors[ii].message;
-					} else {
-						messagesOutputString = errors[ii].message;
-					}
-				}
-			}
-		}
-
-		return messagesOutputString;
-	}
-}