Make gui-clamp work in Docker image

Change package.json to generate URLs relative to current pathname
Change REST URLs to use window.location.pathname
Remove broken React state variables for window.location.pathname

Issue-ID: POLICY-3600
Signed-off-by: danielhanrahan <daniel.hanrahan@est.tech>
Change-Id: I6951a0a6b3f3bef15d262242df13cc2d20a198c8

diff --git a/gui-clamp/ui-react/package.json b/gui-clamp/ui-react/package.json
index 68199e6..732a6b3 100644 (file)
--- a/gui-clamp/ui-react/package.json
+++ b/gui-clamp/ui-react/package.json
@@ -8,6 +8,7 @@
         "registry": "${npm.publish.url}"
     },
     "main": "index.js",
+    "homepage": ".",
     "proxy": "https://localhost:8443",
     "scripts": {
         "start": "HTTPS=true react-scripts start",

diff --git a/gui-clamp/ui-react/src/api/ControlLoopService.js b/gui-clamp/ui-react/src/api/ControlLoopService.js
index 96eb403..b3d987c 100644 (file)
--- a/gui-clamp/ui-react/src/api/ControlLoopService.js
+++ b/gui-clamp/ui-react/src/api/ControlLoopService.js
@@ -19,17 +19,18 @@
 
 export default class ControlLoopService {
 
-  static async getControlLoopInstantiation(windowLocationPathname) {
+  static async getControlLoopInstantiation() {
 
-    const response = await fetch(windowLocationPathname + '/restservices/clds/v2/toscaControlLoop/getToscaInstantiation');
+    const response = await fetch(window.location.pathname +
+      'restservices/clds/v2/toscaControlLoop/getToscaInstantiation');
 
     return response
   }
 
-  static async createInstanceProperties(instanceName, instancePropertiesTemplate, windowLocationPathname) {
+  static async createInstanceProperties(instanceName, instancePropertiesTemplate) {
 
-    const response = await fetch(windowLocationPathname +
-      '/restservices/clds/v2/toscaControlLoop/postToscaInstanceProperties', {
+    const response = await fetch(window.location.pathname +
+      'restservices/clds/v2/toscaControlLoop/postToscaInstanceProperties', {
       method: 'POST',
       headers: {
         "Content-Type": "application/json"
@@ -41,14 +42,14 @@ export default class ControlLoopService {
     return response
   }
 
-  static async deleteInstantiation(name, version, windowLocationPathName) {
-    console.log(windowLocationPathName);
+  static async deleteInstantiation(name, version) {
     const params = {
       name: name,
       version: version
     }
 
-    const response = await fetch(windowLocationPathName + '/restservices/clds/v2/toscaControlLoop/deleteToscaInstanceProperties?' + (new URLSearchParams(params)), {
+    const response = await fetch(window.location.pathname +
+      'restservices/clds/v2/toscaControlLoop/deleteToscaInstanceProperties?' + (new URLSearchParams(params)), {
       method: 'DELETE',
       credentials: 'same-origin',
     });
@@ -58,20 +59,22 @@ export default class ControlLoopService {
     return data;
   }
 
-  static async getInstanceOrderState(name, version, windowLocationPathName) {
+  static async getInstanceOrderState(name, version) {
     const params = {
       name: name,
       version: version
     }
-    const response = await fetch(windowLocationPathName + '/restservices/clds/v2/toscaControlLoop/getInstantiationOrderState'+ '?' + (new URLSearchParams(params)));
+    const response = await fetch(window.location.pathname +
+      'restservices/clds/v2/toscaControlLoop/getInstantiationOrderState'+ '?' + (new URLSearchParams(params)));
 
     const data = await response;
 
     return data;
   }
 
-  static async changeInstanceOrderState(toscaObject, windowLocationPathName) {
-    const response = await fetch(windowLocationPathName + '/restservices/clds/v2/toscaControlLoop/putToscaInstantiationStateChange', {
+  static async changeInstanceOrderState(toscaObject) {
+    const response = await fetch(window.location.pathname +
+      'restservices/clds/v2/toscaControlLoop/putToscaInstantiationStateChange', {
       method: 'PUT',
       headers: {
         "Content-Type": "application/json"
@@ -83,23 +86,23 @@ export default class ControlLoopService {
     return response
   }
 
-  static async getToscaTemplate(name, version, windowLocationPathname) {
+  static async getToscaTemplate(name, version) {
     const params = {
       name: name,
       version: version
     }
 
-    const response = await fetch(windowLocationPathname +
-      '/restservices/clds/v2/toscaControlLoop/getToscaTemplate' + '?' + (new URLSearchParams(params)));
+    const response = await fetch(window.location.pathname +
+      'restservices/clds/v2/toscaControlLoop/getToscaTemplate' + '?' + (new URLSearchParams(params)));
 
     const data = await response;
 
     return data;
   }
 
-  static async uploadToscaFile(toscaObject, windowLocationPathName) {
-    const response = await fetch(windowLocationPathName +
-      '/restservices/clds/v2/toscaControlLoop/commissionToscaTemplate', {
+  static async uploadToscaFile(toscaObject) {
+    const response = await fetch(window.location.pathname +
+      'restservices/clds/v2/toscaControlLoop/commissionToscaTemplate', {
       method: 'POST',
       headers: {
         "Content-Type": "application/json"
@@ -112,14 +115,14 @@ export default class ControlLoopService {
 
   }
 
-  static async deleteToscaTemplate(name, version, windowLocationPathname) {
+  static async deleteToscaTemplate(name, version) {
     const params = {
       name: name,
       version: version
     }
 
-    const response = await fetch(windowLocationPathname +
-      '/restservices/clds/v2/toscaControlLoop/decommissionToscaTemplate' + '?' + (new URLSearchParams(params)),
+    const response = await fetch(window.location.pathname +
+      'restservices/clds/v2/toscaControlLoop/decommissionToscaTemplate' + '?' + (new URLSearchParams(params)),
       {
         method: 'DELETE'
       });
@@ -129,10 +132,10 @@ export default class ControlLoopService {
     return data;
   }
 
-  static async getToscaControlLoopDefinitions(windowLocationPathname) {
+  static async getToscaControlLoopDefinitions() {
 
-    const response = await fetch(windowLocationPathname +
-      '/restservices/clds/v2/toscaControlLoop/getElementDefinitions');
+    const response = await fetch(window.location.pathname +
+      'restservices/clds/v2/toscaControlLoop/getElementDefinitions');
 
     this.checkResponseForError(response);
 
@@ -141,27 +144,27 @@ export default class ControlLoopService {
     return data;
   }
 
-  static async getCommonOrInstanceProperties(name, version, windowLocationPathName, isCommon) {
+  static async getCommonOrInstanceProperties(name, version, isCommon) {
     const params = {
       name: name,
       version: version,
       common: isCommon
     }
 
-    const response = await fetch(windowLocationPathName +
-      '/restservices/clds/v2/toscaControlLoop/getCommonOrInstanceProperties' + '?' + (new URLSearchParams(params)));
+    const response = await fetch(window.location.pathname +
+      'restservices/clds/v2/toscaControlLoop/getCommonOrInstanceProperties' + '?' + (new URLSearchParams(params)));
 
     return response;
   }
 
-  static async getToscaServiceTemplateSchema(section, windowLocationPathName) {
+  static async getToscaServiceTemplateSchema(section) {
 
     const params = {
       section: section
     }
 
-    const response = await fetch(windowLocationPathName +
-      '/restservices/clds/v2/toscaControlLoop/getJsonSchema' + '?' + (new URLSearchParams(params)));
+    const response = await fetch(window.location.pathname +
+      'restservices/clds/v2/toscaControlLoop/getJsonSchema' + '?' + (new URLSearchParams(params)));
 
     this.checkResponseForError(response);
 

diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/ChangeOrderStateModal.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/ChangeOrderStateModal.js
index 2c6d9aa..d8efd3a 100644 (file)
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/ChangeOrderStateModal.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/ChangeOrderStateModal.js
@@ -48,8 +48,6 @@ const AlertStyled = styled(Alert)`
 
 const ChangeOrderStateModal = (props) => {
   const [show, setShow] = useState(true);
-  const [windowLocationPathnameGet, setWindowLocationPathnameGet] = useState('');
-  const [windowLocationPathNameSave, setWindowLocationPathNameSave] = useState('');
   const [controlLoopIdentifierList, setControlLoopIdentifierList] = useState([]);
   const [orderedState, setOrderedState] = useState('');
   const [toscaOrderStateObject, setToscaOrderStateObject] = useState({});
@@ -58,11 +56,10 @@ const ChangeOrderStateModal = (props) => {
   const [alertMessage, setAlertMessage] = useState(null);
 
   useEffect(async () => {
-    setWindowLocationPathnameGet(window.location.pathname);
 
     const instantiationOrderState = await ControlLoopService.getInstanceOrderState(
       props.location.instantiationName,
-      props.location.instantiationVersion, windowLocationPathnameGet)
+      props.location.instantiationVersion)
       .catch(error => error.message);
 
     const orderStateJson = await instantiationOrderState.json();
@@ -91,11 +88,9 @@ const ChangeOrderStateModal = (props) => {
 
   const handleSave = async () => {
     console.log("handleSave called");
-    setWindowLocationPathNameSave(window.location.pathname);
 
-    const response = await ControlLoopService.changeInstanceOrderState(
-      toscaOrderStateObject,
-      windowLocationPathNameSave).catch(error => error.message);
+    const response = await ControlLoopService.changeInstanceOrderState(toscaOrderStateObject)
+      .catch(error => error.message);
 
     if (response.ok) {
       successAlert();

diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/CommissioningModal.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/CommissioningModal.js
index 9a615d0..fc150ef 100644 (file)
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/CommissioningModal.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/CommissioningModal.js
@@ -47,7 +47,6 @@ const AlertStyled = styled(Alert)`
 `
 
 const CommissioningModal = (props) => {
-  const [windowLocationPathName, setWindowLocationPathName] = useState('');
   const [fullToscaTemplate, setFullToscaTemplate] = useState({});
   const [toscaInitialValues, setToscaInitialValues] = useState({});
   const [commonProperties, setCommonProperties] = useState({})
@@ -62,9 +61,9 @@ const CommissioningModal = (props) => {
   let editorTemp = null
 
   useEffect(async () => {
-    const toscaTemplateResponse = await ControlLoopService.getToscaTemplate(name, version, windowLocationPathName)
+    const toscaTemplateResponse = await ControlLoopService.getToscaTemplate(name, version)
       .catch(error => error.message);
-    const toscaCommonProperties = await ControlLoopService.getCommonOrInstanceProperties(name, version, windowLocationPathName, true)
+    const toscaCommonProperties = await ControlLoopService.getCommonOrInstanceProperties(name, version, true)
       .catch(error => error.message);
 
     if (!toscaCommonProperties.ok) {
@@ -100,12 +99,11 @@ const CommissioningModal = (props) => {
 
 
   const handleCommission = async () => {
-    setWindowLocationPathName(window.location.pathname);
 
-    await ControlLoopService.deleteToscaTemplate('ToscaServiceTemplateSimple', "1.0.0", windowLocationPathName)
+    await ControlLoopService.deleteToscaTemplate('ToscaServiceTemplateSimple', "1.0.0")
       .catch(error => error.message)
 
-    const recommissioningResponse = await ControlLoopService.uploadToscaFile(fullToscaTemplate, windowLocationPathName)
+    const recommissioningResponse = await ControlLoopService.uploadToscaFile(fullToscaTemplate)
       .catch(error => error.message)
 
     await receiveResponseFromCommissioning(recommissioningResponse)

diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/DeleteToscaTemplate.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/DeleteToscaTemplate.js
index c641272..7968fe2 100644 (file)
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/DeleteToscaTemplate.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/DeleteToscaTemplate.js
@@ -24,13 +24,10 @@ import ControlLoopService from "../../../api/ControlLoopService";
 
 const DeleteToscaTemplate = props => {
 
-  const [windowLocationPathName, setWindowLocationPathname] = useState('');
-
   const deleteTemplateHandler = async () => {
     console.log('deleteTemplateHandler called');
-    setWindowLocationPathname(window.location.pathname);
 
-    const response = await ControlLoopService.deleteToscaTemplate(props.templateName, props.templateVersion, windowLocationPathName)
+    const response = await ControlLoopService.deleteToscaTemplate(props.templateName, props.templateVersion)
       .catch(error => error.message);
 
     console.log('Response is ok: ' + response.ok);

diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/GetToscaTemplate.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/GetToscaTemplate.js
index 273957f..ba78b80 100644 (file)
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/GetToscaTemplate.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/GetToscaTemplate.js
@@ -23,13 +23,10 @@ import ControlLoopService from "../../../api/ControlLoopService";
 
 const GetToscaTemplate = (props) => {
 
-  const [windowLocationPathName, setWindowLocationPathname] = useState('');
-
   const getTemplateHandler = async () => {
     console.log('getTemplateHandler called')
-    setWindowLocationPathname(window.location.pathname);
 
-    const response = await ControlLoopService.getToscaTemplate(props.templateName, props.templateVersion, windowLocationPathName)
+    const response = await ControlLoopService.getToscaTemplate(props.templateName, props.templateVersion)
       .catch(error => error.message);
 
     props.onGetToscaServiceTemplate(response);

diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstancePropertiesModal.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstancePropertiesModal.js
index 8343237..8ad855e 100644 (file)
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstancePropertiesModal.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstancePropertiesModal.js
@@ -60,7 +60,6 @@ function Fragment(props) {
 Fragment.propTypes = { children: PropTypes.node };
 const InstancePropertiesModal = (props) => {
   const [show, setShow] = useState(true);
-  const [windowLocationPathname, setWindowLocationPathname] = useState('');
   const [toscaFullTemplate, setToscaFullTemplate] = useState({});
   const [jsonEditor, setJsonEditor] = useState(null);
   const [alertMessage, setAlertMessage] = useState(null);
@@ -71,9 +70,11 @@ const InstancePropertiesModal = (props) => {
   const [isLoading, setIsLoading] = useState(true);
 
   useEffect(async () => {
-    const toscaInstanceProperties = await ControlLoopService.getCommonOrInstanceProperties(templateName, templateVersion, windowLocationPathname, false).catch(error => error.message);
+    const toscaInstanceProperties = await ControlLoopService.getCommonOrInstanceProperties(templateName, templateVersion, false)
+      .catch(error => error.message);
 
-    const toscaTemplateResponse = await ControlLoopService.getToscaTemplate(templateName, templateVersion, windowLocationPathname).catch(error => error.message);
+    const toscaTemplateResponse = await ControlLoopService.getToscaTemplate(templateName, templateVersion)
+      .catch(error => error.message);
 
     if (!toscaInstanceProperties.ok) {
       const errorResponse = await toscaInstanceProperties.json()
@@ -238,11 +239,10 @@ const InstancePropertiesModal = (props) => {
 
     console.log("instanceName to be saved is: " + instanceName)
 
-    setWindowLocationPathname(window.location.pathname);
-
     updateTemplate(jsonEditor.getValue());
 
-    const response = await ControlLoopService.createInstanceProperties(instanceName, toscaFullTemplate, windowLocationPathname).catch(error => error.message);
+    const response = await ControlLoopService.createInstanceProperties(instanceName, toscaFullTemplate)
+      .catch(error => error.message);
 
     if (response.ok) {
       successAlert();

diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstantiationManagementModal.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstantiationManagementModal.js
index a0a849c..6a435e4 100644 (file)
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstantiationManagementModal.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstantiationManagementModal.js
@@ -46,16 +46,12 @@ const DivWhiteSpaceStyled = styled.div`
 `
 const InstantiationManagementModal = (props) => {
   const [show, setShow] = useState(true);
-  const [windowLocationPathName, setWindowLocationPathName] = useState('');
-  const [windowLocationPathNameDelete, setWindowLocationPathNameDelete] = useState('');
-
   const [instantiationList, setInstantiationList] = useState([]);
   const [alertMessage, setAlertMessage] = useState(null);
 
   useEffect(async () => {
-    setWindowLocationPathName(window.location.pathname);
 
-    const response = await ControlLoopService.getControlLoopInstantiation(windowLocationPathName);
+    const response = await ControlLoopService.getControlLoopInstantiation();
 
     const instantiationListJson = await response.json();
 
@@ -83,14 +79,11 @@ const InstantiationManagementModal = (props) => {
 
   const deleteInstantiationHandler = async (instantiation, index) => {
     console.log("deleteInstantiationHandler called");
-    setWindowLocationPathNameDelete(window.location.pathname);
 
     const name = instantiation.name;
     const version = instantiation.version;
 
-    console.log(window.location.pathname);
-
-    const response = await ControlLoopService.deleteInstantiation(name, version, windowLocationPathNameDelete);
+    const response = await ControlLoopService.deleteInstantiation(name, version);
 
     updateList(index);
 

diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/MonitorInstantiation.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/MonitorInstantiation.js
index 6c589b8..dad4185 100644 (file)
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/MonitorInstantiation.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/MonitorInstantiation.js
@@ -36,14 +36,11 @@ const AlertStyled = styled(Alert)`
 const MonitorInstantiation = (props) => {
   const [show, setShow] = useState(true);
   const [controlLoopList, setControlLoopList] = useState([]);
-  const [windowLocationPathname, setWindowLocationPathname] = useState('');
   const [controlLoopInstantiationOk, setControlLoopInstantiationOk] = useState(true);
   const [controlLoopInstantiationError, setControlLoopInstantiationError] = useState({});
 
   useEffect(async () => {
-    setWindowLocationPathname(window.location.pathname);
-
-    const controlLoopInstantiation = await ControlLoopService.getControlLoopInstantiation(windowLocationPathname)
+    const controlLoopInstantiation = await ControlLoopService.getControlLoopInstantiation()
       .catch(error => error.message);
 
     const controlLoopInstantiationJson = await controlLoopInstantiation.json()

diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/UploadToscaFile.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/UploadToscaFile.js
index 6ee6a43..380838e 100644 (file)
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/UploadToscaFile.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/UploadToscaFile.js
@@ -22,14 +22,12 @@ import React, { useState } from "react";
 import ControlLoopService from "../../../api/ControlLoopService";
 
 const UploadToscaFile = (props) => {
-  const [windowLocationPathName, setWindowLocationPathname] = useState('');
 
   const postServiceTemplateHandler = async (event) => {
     event.preventDefault();
     console.log('postServiceTemplateHandler called');
-    setWindowLocationPathname(window.location.pathname);
 
-    const response = await ControlLoopService.uploadToscaFile(props.toscaObject, windowLocationPathName)
+    const response = await ControlLoopService.uploadToscaFile(props.toscaObject)
       .catch(error => error.message);
 
     // const responseMessage = await response.text();