Fix the loop template view

Fix the loop template view modal as the rest api has been changed + the database model as well
Issue-ID: CLAMP-589

Change-Id: I57521bc1c3afaf4ca5a2acf4c59823df06fd4cd9
Signed-off-by: sebdet <sebastien.determe@intl.att.com>
diff --git a/ui-react/src/LoopUI.js b/ui-react/src/LoopUI.js
index 19b0814..b76f264 100644
--- a/ui-react/src/LoopUI.js
+++ b/ui-react/src/LoopUI.js
@@ -45,7 +45,7 @@
 import LoopService from './api/LoopService';
 import UploadToscaPolicyModal from './components/dialogs/Tosca/UploadToscaPolicyModal';
 import ViewToscaPolicyModal from './components/dialogs/Tosca/ViewToscaPolicyModal';
-import ViewBlueprintMicroServiceTemplatesModal from './components/dialogs/Tosca/ViewBlueprintMicroServiceTemplatesModal';
+import ViewLoopTemplatesModal from './components/dialogs/Tosca/ViewLoopTemplatesModal';
 import PerformAction from './components/dialogs/PerformActions';
 import RefreshStatus from './components/dialogs/RefreshStatus';
 import DeployLoopModal from './components/dialogs/Loop/DeployLoopModal';
@@ -251,7 +251,7 @@
 				<StyledMainDiv id="main_div">
 				<Route path="/uploadToscaPolicyModal" render={(routeProps) => (<UploadToscaPolicyModal {...routeProps} />)} />
 				<Route path="/viewToscaPolicyModal" render={(routeProps) => (<ViewToscaPolicyModal {...routeProps} />)} />
-				<Route path="/viewBlueprintMicroServiceTemplatesModal" render={(routeProps) => (<ViewBlueprintMicroServiceTemplatesModal {...routeProps} />)} />
+				<Route path="/ViewLoopTemplatesModal" render={(routeProps) => (<ViewLoopTemplatesModal {...routeProps} />)} />
 				<Route path="/operationalPolicyModal"
 					render={(routeProps) => (<OperationalPolicyModal {...routeProps} loopCache={this.getLoopCache()} loadLoopFunction={this.loadLoop} updateLoopFunction={this.updateLoopCache} showAlert={this.showAlert}/>)} />
 				<Route path="/configurationPolicyModal/:componentName" render={(routeProps) => (<ConfigurationPolicyModal {...routeProps} loopCache={this.getLoopCache()} loadLoopFunction={this.loadLoop}/>)} />
diff --git a/ui-react/src/__snapshots__/LoopUI.test.js.snap b/ui-react/src/__snapshots__/LoopUI.test.js.snap
index 5f7611b..98f1a46 100644
--- a/ui-react/src/__snapshots__/LoopUI.test.js.snap
+++ b/ui-react/src/__snapshots__/LoopUI.test.js.snap
@@ -13,7 +13,7 @@
     render={[Function]}
   />
   <Route
-    path="/viewBlueprintMicroServiceTemplatesModal"
+    path="/ViewLoopTemplatesModal"
     render={[Function]}
   />
   <Route
diff --git a/ui-react/src/__snapshots__/OnapClamp.test.js.snap b/ui-react/src/__snapshots__/OnapClamp.test.js.snap
index 5961cd2..59a6fd4 100644
--- a/ui-react/src/__snapshots__/OnapClamp.test.js.snap
+++ b/ui-react/src/__snapshots__/OnapClamp.test.js.snap
@@ -38,7 +38,7 @@
       render={[Function]}
     />
     <Route
-      path="/viewBlueprintMicroServiceTemplatesModal"
+      path="/ViewLoopTemplatesModal"
       render={[Function]}
     />
     <Route
diff --git a/ui-react/src/components/dialogs/Tosca/ViewBlueprintMicroServiceTemplatesModal.test.js b/ui-react/src/components/dialogs/Tosca/ViewBlueprintMicroServiceTemplatesModal.test.js
deleted file mode 100644
index 4a8d9c3..0000000
--- a/ui-react/src/components/dialogs/Tosca/ViewBlueprintMicroServiceTemplatesModal.test.js
+++ /dev/null
@@ -1,193 +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 ViewBlueprintMicroServiceTemplatesModal from './ViewBlueprintMicroServiceTemplatesModal';
-import { mount } from 'enzyme';
-
-describe('Verify ViewBlueprintMicroServiceTemplatesModal', () => {
-	beforeEach(() => {
-		fetch.resetMocks();
-		}
-	);
-
-	it('Test API Successful', () => {
-		fetch.mockImplementationOnce(() => {
-			return Promise.resolve({
-				ok: true,
-				status: 200,
-				json: () => {
-					return Promise.resolve({
-						"index": "1",
-						"content": "MTCA version 1",
-						"templateName": "MTCA",
-						"templatePolicy.policyModelId" : "onap.policies.monitoring.docker.mtca.app",
-						"updatedBy":"tester",
-						"templateId":"aaaa_bbbb_cccc",
-						"timestamp":"2019-09-06 19:09:42"
-					});
-				}
-			});
-		});
-		const component = shallow(<ViewBlueprintMicroServiceTemplatesModal/>);
-	});
-  	
-	it('Test API Exception', () => {
-		fetch.mockImplementationOnce(() => {
-			return Promise.resolve({
-				ok: false,
-				status: 500,
-				json: () => {
-					return Promise.resolve({
-						"index": "1",
-						"content": "MTCA version 1",
-						"templateName": "MTCA",
-						"templatePolicy.policyModelId" : "onap.policies.monitoring.docker.mtca.app",
-						"updatedBy":"tester",
-						"templateId":"aaaa_bbbb_cccc",
-						"timestamp":"2019-09-06 19:09:42"
-					});
-				}
-			});
-		});
-		const component = shallow(<ViewBlueprintMicroServiceTemplatesModal/>);
-	});
-
-	it('Test API Rejection', () => {
-		const myMockFunc  = fetch.mockImplementationOnce(() => Promise.reject('error'));
-		setTimeout( () => myMockFunc().catch(e => {
-			console.log(e);
-		}),
-		100
-		);
-		new Promise(resolve => setTimeout(resolve, 200));
-		const component = shallow(<ViewBlueprintMicroServiceTemplatesModal/>);
-		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",
-						"content": "MTCA version 1",
-						"templateName": "MTCA",
-						"templatePolicy.policyModelId" : "onap.policies.monitoring.docker.mtca.app",
-						"updatedBy":"tester",
-						"templateId":"aaaa_bbbb_cccc",
-						"timestamp":"2019-09-06 19:09:42"
-					});
-				}
-			});
-		});
-		const component = shallow(<ViewBlueprintMicroServiceTemplatesModal/>);
-		component.setState({ bpTemplNames: {
-			"index": "1",
-			"content": "MTCA version 1",
-			"templateName": "MTCA",
-			"templatePolicy.policyModelId" : "onap.policies.monitoring.docker.mtca.app",
-			"updatedBy":"tester",
-			"templateId":"aaaa_bbbb_cccc",
-			"timestamp":"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",
-							"content": "MTCA version 1",
-							"templateName": "MTCA",
-							"templatePolicy.policyModelId" : "onap.policies.monitoring.docker.mtca.app",
-							"updatedBy":"tester",
-							"templateId":"aaaa_bbbb_cccc",
-							"timestamp":"2019-09-06 19:09:42"
-						});
-					}
-				});
-			});
-			const component = mount(<ViewBlueprintMicroServiceTemplatesModal/>);
-			expect(component.find('[className="MuiSelect-icon MuiTablePagination-selectIcon"]')).toBeTruthy();
-		});
-
-		it('Test handleYamlContent', () => {
-			fetch.mockImplementationOnce(() => {
-				return Promise.resolve({
-					ok: true,
-					status: 200,
-					json: () => {
-						return Promise.resolve({
-							"index": "1",
-							"content": "MTCA version 1",
-							"templateName": "MTCA",
-							"templatePolicy.policyModelId" : "onap.policies.monitoring.docker.mtca.app",
-							"updatedBy":"tester",
-							"templateId":"aaaa_bbbb_cccc",
-							"timestamp":"2019-09-06 19:09:42"
-						});
-					}
-				});
-			});
-			const yamlContent = 'MTCA Tosca model details';
-			const component = shallow(<ViewBlueprintMicroServiceTemplatesModal/>);
-			component.find('[value="Please select Blue print template to view the details"]').prop('onChange')({ target: { value: yamlContent }});
-			expect(component.state('content')).toEqual(yamlContent);
-		});
-		
-		it('Test handleClose', () => {
-			fetch.mockImplementationOnce(() => {
-				return Promise.resolve({
-					ok: true,
-					status: 200,
-					json: () => {
-						return Promise.resolve({
-							"index": "1",
-							"content": "MTCA version 1",
-							"templateName": "MTCA",
-							"templatePolicy.policyModelId" : "onap.policies.monitoring.docker.mtca.app",
-							"updatedBy":"tester",
-							"templateId":"aaaa_bbbb_cccc",
-							"timestamp":"2019-09-06 19:09:42"
-						});
-					}
-				});
-			});
-			const historyMock = { push: jest.fn() };
-			const handleClose = jest.spyOn(ViewBlueprintMicroServiceTemplatesModal.prototype,'handleClose');
-			const component = shallow(<ViewBlueprintMicroServiceTemplatesModal 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();
-		});
-	});
\ No newline at end of file
diff --git a/ui-react/src/components/dialogs/Tosca/ViewBlueprintMicroServiceTemplatesModal.js b/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.js
similarity index 85%
rename from ui-react/src/components/dialogs/Tosca/ViewBlueprintMicroServiceTemplatesModal.js
rename to ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.js
index adacbc8..a78d454 100644
--- a/ui-react/src/components/dialogs/Tosca/ViewBlueprintMicroServiceTemplatesModal.js
+++ b/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.js
@@ -51,34 +51,34 @@
 const headerStyle = { backgroundColor: '#ddd',	border: '2px solid black'	};
 const rowHeaderStyle = {backgroundColor:'#ddd',  fontSize: '15pt', text: 'bold', border: '1px solid black'};
 
-export default class ViewBlueprintMicroServiceTemplatesModal extends React.Component {
+export default class ViewLoopTemplatesModal extends React.Component {
   state = {
     show: true,
-		content: 'Please select Blue print template to view the details',
+		content: 'Please select a loop template to display it',
 		selectedRow: -1,
-		bpTemplNames: [],
-		bpTemplColumns: [
+		loopTemplateData: [],
+		loopTemplateColumnsDefinition: [
 			{ title: "#", field: "index", render: rowData => rowData.tableData.id + 1,
 				cellStyle: cellStyle,
 				headerStyle: headerStyle
 			},
-			{ title: "Template Name", field: "templateName",
+			{ title: "Template Name", field: "name",
 				cellStyle: cellStyle,
 				headerStyle: headerStyle
 			},
-			{ title: "Policy Model", field: "templatePolicy[0].policyModelId",
+			{ title: "Service Model Name", field: "modelService.serviceDetails.name",
 				cellStyle: cellStyle,
 				headerStyle: headerStyle
 			},
-			{ title: "Template ID", field: "templateId",
+			{ title: "Loop Type Allowed", field: "allowedLoopType",
 				cellStyle: cellStyle,
 				headerStyle: headerStyle
 			},
-			{ title: "Uploaded By", field: "updatedBy",
+			{ title: "# Instances Allowed", field: "maximumInstancesAllowed",
 				cellStyle: cellStyle,
 				headerStyle: headerStyle
 			},
-			{ title: "Uploaded Date", field: "timestamp", editable: 'never',
+			{ title: "Modified Date", field: "updatedDate", editable: 'never',
 				cellStyle: cellStyle,
 				headerStyle: headerStyle
 			}
@@ -99,15 +99,12 @@
 		this.handleClose = this.handleClose.bind(this);
 		this.getBlueprintMicroServiceTemplates = this.getBlueprintMicroServiceTemplates.bind(this);
 		this.handleYamlContent = this.handleYamlContent.bind(this);
-	}
-
-	componentWillMount() {
 		this.getBlueprintMicroServiceTemplates();
 	}
 
 	getBlueprintMicroServiceTemplates() {
-		TemplateMenuService.getBlueprintMicroServiceTemplates().then(bpTemplNames => {
-		this.setState({ bpTemplNames: bpTemplNames })
+		TemplateMenuService.getBlueprintMicroServiceTemplates().then(loopTemplateData => {
+		this.setState({ loopTemplateData: loopTemplateData })
 		});
 	}
 
@@ -130,10 +127,10 @@
 				<Modal.Body>
           <MaterialTable
             title={"View Blueprint MicroService Templates"}
-            data={this.state.bpTemplNames}
-					  columns={this.state.bpTemplColumns}
+            data={this.state.loopTemplateData}
+					  columns={this.state.loopTemplateColumnsDefinition}
 					  icons={this.state.tableIcons}
-					  onRowClick={(event, rowData) => {this.setState({content: rowData.templateYaml, selectedRow: rowData.tableData.id})}}
+					  onRowClick={(event, rowData) => {this.setState({content: rowData.name, selectedRow: rowData.tableData.id})}}
 					  options={{
 					  headerStyle:rowHeaderStyle,
 					  rowStyle: rowData => ({
diff --git a/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.test.js b/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.test.js
new file mode 100644
index 0000000..94d4acd
--- /dev/null
+++ b/ui-react/src/components/dialogs/Tosca/ViewLoopTemplatesModal.test.js
@@ -0,0 +1,186 @@
+/*-
+ * ============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';
+
+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.log(e);
+		}),
+		100
+		);
+		new Promise(resolve => setTimeout(resolve, 200));
+		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(<ViewLoopTemplatesModal/>);
+			expect(component.find('[className="MuiSelect-icon MuiTablePagination-selectIcon"]')).toBeTruthy();
+		});
+
+		it('Test handleYamlContent', () => {
+			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 yamlContent = 'MTCA version 1';
+			const component = shallow(<ViewLoopTemplatesModal/>);
+			component.find('[value="Please select a loop template to display it"]').prop('onChange')({ target: { value: yamlContent }});
+			expect(component.state('content')).toEqual(yamlContent);
+		});
+		
+		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();
+		});
+	});
\ No newline at end of file
diff --git a/ui-react/src/components/dialogs/Tosca/__snapshots__/ViewBlueprintMicroServiceTemplatesModal.test.js.snap b/ui-react/src/components/dialogs/Tosca/__snapshots__/ViewLoopTemplatesModal.test.js.snap
similarity index 82%
rename from ui-react/src/components/dialogs/Tosca/__snapshots__/ViewBlueprintMicroServiceTemplatesModal.test.js.snap
rename to ui-react/src/components/dialogs/Tosca/__snapshots__/ViewLoopTemplatesModal.test.js.snap
index 7dd4ee0..efec96e 100644
--- a/ui-react/src/components/dialogs/Tosca/__snapshots__/ViewBlueprintMicroServiceTemplatesModal.test.js.snap
+++ b/ui-react/src/components/dialogs/Tosca/__snapshots__/ViewLoopTemplatesModal.test.js.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Verify ViewBlueprintMicroServiceTemplatesModal Test the tosca model view render method 1`] = `
+exports[`Verify ViewLoopTemplatesModal Test the tosca model view render method 1`] = `
 <Styled(Bootstrap(Modal))
   onHide={[Function]}
   show={true}
@@ -30,7 +30,7 @@
             "cellStyle": Object {
               "border": "1px solid black",
             },
-            "field": "templateName",
+            "field": "name",
             "headerStyle": Object {
               "backgroundColor": "#ddd",
               "border": "2px solid black",
@@ -41,58 +41,57 @@
             "cellStyle": Object {
               "border": "1px solid black",
             },
-            "field": "templatePolicy[0].policyModelId",
+            "field": "modelService.serviceDetails.name",
             "headerStyle": Object {
               "backgroundColor": "#ddd",
               "border": "2px solid black",
             },
-            "title": "Policy Model",
+            "title": "Service Model Name",
           },
           Object {
             "cellStyle": Object {
               "border": "1px solid black",
             },
-            "field": "templateId",
+            "field": "allowedLoopType",
             "headerStyle": Object {
               "backgroundColor": "#ddd",
               "border": "2px solid black",
             },
-            "title": "Template ID",
+            "title": "Loop Type Allowed",
           },
           Object {
             "cellStyle": Object {
               "border": "1px solid black",
             },
-            "field": "updatedBy",
+            "field": "maximumInstancesAllowed",
             "headerStyle": Object {
               "backgroundColor": "#ddd",
               "border": "2px solid black",
             },
-            "title": "Uploaded By",
+            "title": "# Instances Allowed",
           },
           Object {
             "cellStyle": Object {
               "border": "1px solid black",
             },
             "editable": "never",
-            "field": "timestamp",
+            "field": "updatedDate",
             "headerStyle": Object {
               "backgroundColor": "#ddd",
               "border": "2px solid black",
             },
-            "title": "Uploaded Date",
+            "title": "Modified Date",
           },
         ]
       }
       data={
         Object {
-          "content": "MTCA version 1",
+          "allowedLoopType": "CLOSED",
           "index": "1",
-          "templateId": "aaaa_bbbb_cccc",
-          "templateName": "MTCA",
-          "templatePolicy.policyModelId": "onap.policies.monitoring.docker.mtca.app",
-          "timestamp": "2019-09-06 19:09:42",
-          "updatedBy": "tester",
+          "maximumInstancesAllowed": 1,
+          "modelService.serviceDetails.name": "MTCA",
+          "name": "MTCA version 1",
+          "updatedDate": "2019-09-06 19:09:42",
         }
       }
       icons={
@@ -144,7 +143,7 @@
     <div>
       <styled.textarea
         onChange={[Function]}
-        value="Please select Blue print template to view the details"
+        value="Please select a loop template to display it"
       />
     </div>
   </ModalBody>
diff --git a/ui-react/src/components/menu/MenuBar.js b/ui-react/src/components/menu/MenuBar.js
index 6fae008..98c7bff 100644
--- a/ui-react/src/components/menu/MenuBar.js
+++ b/ui-react/src/components/menu/MenuBar.js
@@ -90,7 +90,7 @@
 					<StyledNavDropdown title="Template">
 					<NavDropdown.Item as={StyledLink} to="/uploadToscaPolicyModal">Upload Tosca Policy Model</NavDropdown.Item>
 					<NavDropdown.Item as={StyledLink} to="/viewToscaPolicyModal">View Tosca Policy Models</NavDropdown.Item>
-							<NavDropdown.Item as={StyledLink} to="/viewBlueprintMicroServiceTemplatesModal">View Blueprint MicroService Templates</NavDropdown.Item>
+							<NavDropdown.Item as={StyledLink} to="/ViewLoopTemplatesModal">View Loop Templates</NavDropdown.Item>
 					</StyledNavDropdown>
 					<StyledNavDropdown title="Closed Loop">
 							<NavDropdown.Item as={StyledLink} to="/openLoop">Open CL</NavDropdown.Item>
diff --git a/ui-react/src/components/menu/__snapshots__/MenuBar.test.js.snap b/ui-react/src/components/menu/__snapshots__/MenuBar.test.js.snap
index 7ed386f..14030f0 100644
--- a/ui-react/src/components/menu/__snapshots__/MenuBar.test.js.snap
+++ b/ui-react/src/components/menu/__snapshots__/MenuBar.test.js.snap
@@ -154,9 +154,9 @@
         }
       }
       disabled={false}
-      to="/viewBlueprintMicroServiceTemplatesModal"
+      to="/ViewLoopTemplatesModal"
     >
-      View Blueprint MicroService Templates
+      View Loop Templates
     </DropdownItem>
   </Styled(NavDropdown)>
   <Styled(NavDropdown)