From 9f6beb77dfb1a0c98749d25adbad1ccb26f283ad Mon Sep 17 00:00:00 2001 From: Daniil Palagin Date: Mon, 18 Nov 2024 14:48:54 +0100 Subject: [PATCH] [#91] Fix error handling in Rest API calls and refactor console logs --- .../modal/FunctionExecutionModal.jsx | 20 +++---- src/components/modal/MoveModuleModal.jsx | 4 +- .../modal/ScriptActionsModuleModal.jsx | 49 ++++++++-------- src/components/modal/ScriptOntologyModal.jsx | 56 +++++++++---------- src/components/sform/SFormsFunctionModal.jsx | 21 +++---- src/components/sform/SFormsModal.jsx | 27 ++++----- src/pages/ScriptPage.jsx | 49 ++++++++-------- 7 files changed, 113 insertions(+), 113 deletions(-) diff --git a/src/components/modal/FunctionExecutionModal.jsx b/src/components/modal/FunctionExecutionModal.jsx index 152d7f2..4dc6fa0 100644 --- 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 index 183fe79..a15a2bc 100644 --- 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 index d90c35c..961de24 100644 --- 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 index ad94cc1..fa5bd44 100644 --- 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 index 982d8db..404bd4f 100644 --- 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 index 76e8c94..180bad0 100644 --- 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 index 2fe1046..73152a7 100644 --- a/src/pages/ScriptPage.jsx +++ b/src/pages/ScriptPage.jsx @@ -365,15 +365,15 @@ class Script extends React.Component { content: '', 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") + "']");