Merge pull request #92 from kbss-cvut/91-scriptpage-request-handling

Fix error handling in Rest API calls and refactor console logs
kbss-cvut · Nov 19, 2024 · c1f68f5 · c1f68f5
2 parents 4db3f3d + 9f6beb7
commit c1f68f5
Show file tree

Hide file tree

Showing 7 changed files with 113 additions and 113 deletions.
diff --git a/src/components/modal/FunctionExecutionModal.jsx b/src/components/modal/FunctionExecutionModal.jsx
@@ -33,17 +33,17 @@ class FunctionExecutionModal extends React.Component {
     this.setState({ functionUri: false, isLoaded: false });
   }
 
-  handleSubmit() {
-    Rest.executeFunction(this.state.functionUri, this.state.params).then((response) => {
+  async handleSubmit() {
+    try {
+      const { functionUri, params } = this.state;
+      const response = await Rest.executeFunction(functionUri, params);
       console.log(response);
-      console.log(response.status);
-      if (response.status === 200) {
-        window.location.href = "/executions";
-      } else {
-        console.log("ERROR during script execution");
-      }
-      this.setState({ isLoaded: false, modalVisible: false });
-    });
+      window.location.href = "/executions";
+    } catch (error) {
+      alert("An error occurred during script execution.");
+      console.error(`An error occurred during script execution: ${error}`);
+    }
+    this.setState({ isLoaded: false, modalVisible: false });
   }
 
   render() {

diff --git a/src/components/modal/MoveModuleModal.jsx b/src/components/modal/MoveModuleModal.jsx
@@ -35,8 +35,8 @@ class MoveModuleModal extends React.Component {
     }
   }
 
-  handleModuleMove(toScript, rename) {
-    Rest.moveModule(this.state.moduleScriptPath, toScript, this.state.moduleURI, rename);
+  async handleModuleMove(toScript, rename) {
+    await Rest.moveModule(this.state.moduleScriptPath, toScript, this.state.moduleURI, rename);
     window.location.href = "?file=" + this.state.sourceScriptPath;
   }
 

diff --git a/src/components/modal/ScriptActionsModuleModal.jsx b/src/components/modal/ScriptActionsModuleModal.jsx
@@ -1,6 +1,7 @@
 import React from "react";
 
 import { Alert, Button, Col, Container, Form, Modal, Row, Table } from "react-bootstrap";
+import Rest from "../../rest/Rest.jsx";
 
 class ScriptActionsModuleModal extends React.Component {
   constructor(props) {
@@ -34,35 +35,39 @@ class ScriptActionsModuleModal extends React.Component {
     }
   }
 
-  handleCreateScript(event) {
+  async handleCreateScript(event) {
     event.preventDefault();
-    console.log(this.state.scriptPath);
-    console.log(this.state.ontologyURI);
-    console.log(this.state.scriptName);
-    Rest.createScript(this.state.ontologyURI, this.state.scriptName, this.state.scriptPath).then((response) => {
-      if (response.status === 200) {
-        this.props.handleRefresh();
-        this.setState({ isLoaded: false, modalVisible: false });
-        this.setState({ isLoaded: false, modalVisible: false, createScriptVisible: false });
-      } else {
-        response.json().then((r) => alert("Can not be created. " + r.message));
-      }
-    });
+    const { scriptPath, ontologyURI, scriptName } = this.state;
+    console.log(scriptPath, ontologyURI, scriptName);
+    try {
+      const response = await Rest.createScript(ontologyURI, scriptName, scriptPath);
+
+      this.props.handleRefresh();
+
+      this.setState({
+        isLoaded: false,
+        modalVisible: false,
+        createScriptVisible: false,
+      });
+    } catch (error) {
+      alert("An error occurred during script creation.");
+      console.error(`An error occurred during script creation: ${error}`);
+    }
   }
 
   handleEditScript() {
     window.location.href = "/script?file=" + this.state.scriptPath;
   }
 
-  handleDeleteScript() {
-    Rest.deleteScript(this.state.scriptPath).then((response) => {
-      if (response.status === 200) {
-        this.props.handleRefresh();
-        this.setState({ isLoaded: false, modalVisible: false });
-      } else {
-        alert("Can not be deleted");
-      }
-    });
+  async handleDeleteScript() {
+    try {
+      await Rest.deleteScript(this.state.scriptPath);
+      this.props.handleRefresh();
+      this.setState({ isLoaded: false, modalVisible: false });
+    } catch (error) {
+      alert("An error occurred during script deletion.");
+      console.error(`An error occurred during script deletion: ${error}`);
+    }
   }
 
   handleClose() {

diff --git a/src/components/modal/ScriptOntologyModal.jsx b/src/components/modal/ScriptOntologyModal.jsx
@@ -30,37 +30,35 @@ class ScriptOntologyModal extends React.Component {
     }
   }
 
-  handleRemoveOntology(ontologyURI) {
-    console.log(this.state.scriptPath + " #### " + ontologyURI);
-    Rest.removeScriptOwnOntology(this.state.scriptPath, ontologyURI).then((response) => {
-      if (response.status === 200) {
-        Rest.getScriptOwnOntology(this.state.scriptPath).then((response2) => {
-          this.setState({
-            scriptPath: this.state.scriptPath,
-            ontologies: response2,
-          });
-        });
-      } else {
-        alert(ontologyURI + " can not be deleted.");
-      }
-    });
+  async handleRemoveOntology(ontologyURI) {
+    try {
+      console.log(this.state.scriptPath + " #### " + ontologyURI);
+      await Rest.removeScriptOwnOntology(this.state.scriptPath, ontologyURI);
+      const response = await Rest.getScriptOwnOntology(this.state.scriptPath);
+      this.setState({
+        scriptPath: this.state.scriptPath,
+        ontologies: response,
+      });
+    } catch (error) {
+      alert("An error occurred while removing the ontology.");
+      console.error(`An error occurred while removing the ontology ${ontologyURI}: ${error}`);
+    }
   }
 
-  handleAddScriptOntology(event) {
-    event.preventDefault();
-    Rest.addScriptOwnOntology(this.state.scriptPath, this.state.newOntologyName).then((response) => {
-      if (response.status === 200) {
-        Rest.getScriptOwnOntology(this.state.scriptPath).then((response2) => {
-          this.setState({
-            scriptPath: this.state.scriptPath,
-            newOntologyName: null,
-            ontologies: response2,
-          });
-        });
-      } else {
-        alert(ontologyURI + " can not be deleted.");
-      }
-    });
+  async handleAddScriptOntology(event) {
+    try {
+      event.preventDefault();
+      await Rest.addScriptOwnOntology(this.state.scriptPath, this.state.newOntologyName);
+      const response = await Rest.getScriptOwnOntology(this.state.scriptPath);
+      this.setState({
+        scriptPath: this.state.scriptPath,
+        newOntologyName: null,
+        ontologies: response,
+      });
+    } catch (error) {
+      alert(`An error occurred while adding the ontology.`);
+      console.error(`An error occurred while adding the ontology: ${error}`);
+    }
   }
 
   handleClose() {

diff --git a/src/components/sform/SFormsFunctionModal.jsx b/src/components/sform/SFormsFunctionModal.jsx
@@ -45,7 +45,7 @@ class SFormsFunctionModal extends React.Component {
     this.setState({ errorMessage: null });
   }
 
-  handleSubmit() {
+  async handleSubmit() {
     let data =
       this.refForm.current.getFormQuestionsData()[0][
         "http://onto.fel.cvut.cz/ontologies/documentation/has_related_question"
@@ -65,18 +65,15 @@ class SFormsFunctionModal extends React.Component {
       }
     });
 
-    Rest.executeFunction(functionUri, params.join("&")).then((response) => {
+    try {
+      const response = await Rest.executeFunction(functionUri, params.join("&"));
       console.log(response);
-      console.log(response.status);
-      if (response.status === 200) {
-        console.log(response);
-        window.location.href = "/executions";
-      } else {
-        console.log("ERROR during script execution");
-        this.setState({ errorMessage: "ERROR during script execution" });
-      }
-      this.setState({ isLoaded: false, modalVisible: false });
-    });
+      window.location.href = "/executions";
+    } catch (error) {
+      this.setState({ errorMessage: "An error occurred during script execution" });
+      console.error(`An error occurred during script execution: ${error}`);
+    }
+    this.setState({ isLoaded: false, modalVisible: false });
   }
 
   render() {

diff --git a/src/components/sform/SFormsModal.jsx b/src/components/sform/SFormsModal.jsx
@@ -49,21 +49,22 @@ class SFormsModal extends React.Component {
     this.setState({ errorMessage: null });
   }
 
-  handleSubmit() {
-    let form = this.state.selectedForm;
-    form["http://onto.fel.cvut.cz/ontologies/documentation/has_related_question"] =
-      this.refForm.current.getFormQuestionsData();
+  async handleSubmit() {
+    try {
+      let form = this.state.selectedForm;
+      form["http://onto.fel.cvut.cz/ontologies/documentation/has_related_question"] =
+        this.refForm.current.getFormQuestionsData();
+
+      this.setState({ isLoading: true, isLoaded: false });
+
+      await Rest.updateScriptForm(this.state.moduleTypeUri, form, this.state.scriptPath);
 
-    this.setState({ isLoading: true, isLoaded: false });
-    Rest.updateScriptForm(this.state.moduleTypeUri, form, this.state.scriptPath).then((response) => {
       this.setState({ isLoading: false });
-      if (response.status === 200) {
-        window.location.reload(false);
-      } else {
-        console.log("ERROR on script update");
-        this.setState({ errorMessage: "ERROR during script execution" });
-      }
-    });
+      window.location.reload(false);
+    } catch (error) {
+      this.setState({ errorMessage: "An error occurred during script update." });
+      console.error(`An error occurred during script update: ${error}`);
+    }
   }
 
   render() {

diff --git a/src/pages/ScriptPage.jsx b/src/pages/ScriptPage.jsx
@@ -365,15 +365,15 @@ class Script extends React.Component {
           content: '<span class="fa fa-trash fa-2x"/>',
           select: (ele) => {
             this.setState({ isLoaded: false });
-            Rest.deleteScriptNode(filepath, ele.data("id")).then((response) => {
-              this.setState({ isLoaded: true });
-              if (response.status === 204) {
+            Rest.deleteScriptNode(filepath, ele.data("id"))
+              .then(() => {
+                this.setState({ isLoaded: true });
                 ele.remove();
-              } else {
-                console.log("Node can not be deleted.");
-                this.setState({ errorMessage: "Node can not be deleted." });
-              }
-            });
+              })
+              .catch((error) => {
+                this.setState({ errorMessage: "An error occurred during node deletion." });
+                console.error(`An error occurred during node deletion: ${error}`);
+              });
           },
         },
         {
@@ -461,15 +461,15 @@ class Script extends React.Component {
             let sourceNode = ele.data("source");
             let targetNode = ele.data("target");
             this.setState({ isLoaded: false });
-            Rest.deleteScriptEdge(filepath, sourceNode, targetNode).then((response) => {
-              this.setState({ isLoaded: true });
-              if (response.status === 204) {
+            Rest.deleteScriptEdge(filepath, sourceNode, targetNode)
+              .then(() => {
+                this.setState({ isLoaded: true });
                 ele.remove();
-              } else {
-                console.log("Edge can not be deleted.");
-                this.setState({ errorMessage: "Edge can not be deleted." });
-              }
-            });
+              })
+              .catch((error) => {
+                this.setState({ errorMessage: "An error occurred during edge deletion." });
+                console.error(`An error occurred during edge deletion: ${error}`);
+              });
           },
         },
       ],
@@ -485,15 +485,14 @@ class Script extends React.Component {
         console.log(targetNode.data("id"));
         if (sourceNode.data("menu") !== undefined && targetNode.data("menu")) {
           this.setState({ isLoaded: false });
-          Rest.addModuleDependency(this.state.file, sourceNode.data("id"), targetNode.data("id")).then((res) => {
-            this.setState({ isLoaded: true });
-            if (res.status === 204) {
-              //TODO reload?
-            } else {
-              console.log("ERROR add edge/dependency");
-              this.setState({ errorMessage: "ERROR add edge/dependency." });
-            }
-          });
+          Rest.addModuleDependency(this.state.file, sourceNode.data("id"), targetNode.data("id"))
+            .then((res) => {
+              this.setState({ isLoaded: true });
+            })
+            .catch((error) => {
+              this.setState({ errorMessage: "An error occurred while adding edge/dependency." });
+              console.error(`An error occurred while adding edge/dependency: ${error}`);
+            });
         } else {
           this.cy.remove("edge[source='" + sourceNode.data("id") + "']");
           this.cy.remove("edge[target='" + targetNode.data("id") + "']");