Add error handling and refactoring

Added error for when common or instance props can't be retrieved
Added error for monitoring when control loops can't be retrieved
Made node templates collapsed by default when editing properties
Added single service function to get common or instance properties

Issue-ID: POLICY-3439
Change-Id: I74560a06aae1a820862f977d5e7ac86597a093c0
Signed-off-by: saul.gill <saul.gill@est.tech>

1 files changed, 37 insertions, 8 deletions

diff --git a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstanceModal.js b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstanceModal.js
index 7a66812..0380fa6 100644
--- a/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstanceModal.js
+++ b/gui-clamp/ui-react/src/components/dialogs/ControlLoop/InstanceModal.js
@@ -42,6 +42,10 @@ const DivWhiteSpaceStyled = styled.div`
   text-align: center;
 `
 
+const AlertStyled = styled(Alert)`
+  margin-top: 10px;
+`
+
 const templateName = "ToscaServiceTemplateSimple";
 const templateVersion = "1.0.0";
 let tempJsonEditor = null;
@@ -54,13 +58,32 @@ const InstanceModal = (props) => {
   const [toscaJsonSchema, setToscaJsonSchema] = useState({});
   const [jsonEditor, setJsonEditor] = useState(null);
   const [alertMessage, setAlertMessage] = useState(null);
+  const [instancePropertiesGlobal, setInstancePropertiesGlobal] = useState({});
+  const [serviceTemplateResponseOk, setServiceTemplateResponseOk] = useState(true);
+  const [instancePropertiesResponseOk, setInstancePropertiesResponseOk] = useState(true);
 
   useEffect(async () => {
-    const toscaInstanceProperties = await ControlLoopService.getInstanceProperties(templateName, templateVersion, windowLocationPathname).catch(error => error.message);
+    const toscaInstanceProperties = await ControlLoopService.getCommonOrInstanceProperties(templateName, templateVersion, windowLocationPathname, false).catch(error => error.message);
+
+    const toscaTemplateResponse = await ControlLoopService.getToscaTemplate(templateName, templateVersion, windowLocationPathname).catch(error => error.message);
+
+    if (!toscaInstanceProperties.ok) {
+      const errorResponse = await toscaInstanceProperties.json()
+      console.log(errorResponse)
+      setInstancePropertiesGlobal(errorResponse);
+      setInstancePropertiesResponseOk(false);
+    }
 
-    const toscaSchemaResponse = await ControlLoopService.getToscaTemplate(templateName, templateVersion, windowLocationPathname).catch(error => error.message);
+    if (!toscaTemplateResponse.ok) {
+      const errorResponse = await toscaTemplateResponse.json()
+      console.log(errorResponse)
+      setToscaFullTemplate(errorResponse)
+      setServiceTemplateResponseOk(false);
+    }
 
-    await parseJsonSchema(toscaSchemaResponse, toscaInstanceProperties);
+    if (toscaTemplateResponse.ok && toscaInstanceProperties.ok) {
+      await parseJsonSchema(toscaTemplateResponse, toscaInstanceProperties);
+    }
 
   }, []);
 
@@ -113,9 +136,8 @@ const InstanceModal = (props) => {
     newSchemaObject.type = "object";
     newSchemaObject.properties = {};
 
-    const newSchemaObjectArray = [];
     instancePropsArray.forEach(([key, value]) => {
-      const templateObj = {};
+
       const propertiesObject = {};
 
       Object.entries(value.properties).forEach(([pKey, pValue]) => {
@@ -125,6 +147,9 @@ const InstanceModal = (props) => {
       });
 
       newSchemaObject.properties[key] = {
+        options: {
+          "collapsed": true
+        },
         properties: propertiesObject
       }
     });
@@ -143,7 +168,7 @@ const InstanceModal = (props) => {
       case "object":
         return "object";
       default:
-        return "string";
+        return "object";
 
     }
   }
@@ -186,8 +211,8 @@ const InstanceModal = (props) => {
 
     instanceDataProperties.forEach(([key, value]) => {
       const nodeTemplatesKey = nodeTemplates[key]
-      Object.entries(value).forEach((pKey, pValue) => {
-        nodeTemplatesKey.properties[pKey] = pValue;
+      Object.entries(value).forEach(([pKey, pValue]) => {
+        nodeTemplatesKey.properties[pKey] = pValue
       });
     });
 
@@ -245,6 +270,10 @@ const InstanceModal = (props) => {
       <div style={ { padding: '5px 5px 0 5px' } }>
         <Modal.Body>
           <div id="editor"/>
+          <AlertStyled show={ !serviceTemplateResponseOk }
+                       variant="danger">Can't get service template:<br/>{ JSON.stringify(toscaFullTemplate, null, 2) }</AlertStyled>
+          <AlertStyled show={ !instancePropertiesResponseOk }
+                       variant="danger">Can't get instance properties:<br/>{ JSON.stringify(instancePropertiesGlobal, null, 2) }</AlertStyled>
         </Modal.Body>
         <DivWhiteSpaceStyled>
           { alertMessage }