Adding manage dictionary UI feature

[clamp.git] / ui-react / src / LoopUI.js

diff --git a/ui-react/src/LoopUI.js b/ui-react/src/LoopUI.js
index e709c71..bc3f235 100644 (file)
--- a/ui-react/src/LoopUI.js
+++ b/ui-react/src/LoopUI.js
@@ -27,6 +27,7 @@ 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 LoopSvg from './components/loop_viewer/svg/LoopSvg';
 import LoopLogs from './components/loop_viewer/logs/LoopLogs';
@@ -36,13 +37,19 @@ import LoopCache from './api/LoopCache';
 import LoopActionService from './api/LoopActionService';
 
 import { Route } from 'react-router-dom'
-import OpenLoopModal from './components/dialogs/OpenLoop/OpenLoopModal';
+import CreateLoopModal from './components/dialogs/Loop/CreateLoopModal';
+import OpenLoopModal from './components/dialogs/Loop/OpenLoopModal';
+import ModifyLoopModal from './components/dialogs/Loop/ModifyLoopModal';
 import OperationalPolicyModal from './components/dialogs/OperationalPolicy/OperationalPolicyModal';
 import ConfigurationPolicyModal from './components/dialogs/ConfigurationPolicy/ConfigurationPolicyModal';
+import PolicyModal from './components/dialogs/Policy/PolicyModal';
 import LoopPropertiesModal from './components/dialogs/Loop/LoopPropertiesModal';
-import UserInfo from './components/dialogs/UserInfo';
+import UserInfoModal from './components/dialogs/UserInfoModal';
 import LoopService from './api/LoopService';
-import ViewToscaModal from './components/dialogs/ViewToscaModal/ViewToscaModal';
+import UploadToscaPolicyModal from './components/dialogs/Tosca/UploadToscaPolicyModal';
+import ViewToscaPolicyModal from './components/dialogs/Tosca/ViewToscaPolicyModal';
+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';
@@ -98,11 +105,9 @@ const LoopViewBodyDivStyled = styled.div`
 
 export default class LoopUI extends React.Component {
 
-       static defaultLoopName="Empty (NO loop loaded yet)";
-
        state = {
                userName: null,
-               loopName: LoopUI.defaultLoopName,
+               loopName: OnapConstants.defaultLoopName,
                loopCache: new LoopCache({}),
                showAlert: false
        };
@@ -241,20 +246,27 @@ export default class LoopUI extends React.Component {
        }
 
        closeLoop() {
-               this.setState({ loopCache: new LoopCache({}), loopName: LoopUI.defaultLoopName });
+               this.setState({ loopCache: new LoopCache({}), loopName: OnapConstants.defaultLoopName });
                this.props.history.push('/');
        }
 
        render() {
                return (
                                <StyledMainDiv id="main_div">
-                               <Route path="/viewToscaModal" render={(routeProps) => (<ViewToscaModal {...routeProps} />)} />
+                               <Route path="/uploadToscaPolicyModal" render={(routeProps) => (<UploadToscaPolicyModal {...routeProps} />)} />
+                               <Route path="/viewToscaPolicyModal" render={(routeProps) => (<ViewToscaPolicyModal {...routeProps} />)} />
+                               <Route path="/ViewLoopTemplatesModal" render={(routeProps) => (<ViewLoopTemplatesModal {...routeProps} />)} />
+                               <Route path="/ManageDictionaries" render={(routeProps) => (<ManageDictionaries {...routeProps} />)} />
                                <Route path="/operationalPolicyModal"
-                                       render={(routeProps) => (<OperationalPolicyModal {...routeProps} loopCache={this.getLoopCache()} loadLoopFunction={this.loadLoop} showAlert={this.showAlert}/>)} />
-                               <Route path="/configurationPolicyModal/:componentName" render={(routeProps) => (<ConfigurationPolicyModal {...routeProps} loopCache={this.getLoopCache()} loadLoopFunction={this.loadLoop}/>)} />
+                                       render={(routeProps) => (<OperationalPolicyModal {...routeProps} loopCache={this.getLoopCache()} loadLoopFunction={this.loadLoop} updateLoopFunction={this.updateLoopCache} showAlert={this.showAlert}/>)} />
+                               <Route path="/policyModal/:policyInstanceType/:policyName" render={(routeProps) => (<PolicyModal {...routeProps} loopCache={this.getLoopCache()} loadLoopFunction={this.loadLoop}/>)} />
+                               <Route path="/configurationPolicyModal/:policyName" render={(routeProps) => (<ConfigurationPolicyModal {...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="/userInfo" render={(routeProps) => (<UserInfo {...routeProps} />)} />
+                               <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} showAlert={this.showAlert}/>)} />
                                <Route path="/stop" render={(routeProps) => (<PerformAction {...routeProps} loopAction="stop" loopCache={this.getLoopCache()} updateLoopFunction={this.updateLoopCache} showAlert={this.showAlert}/>)} />