✨ Frontend: wait for backend's confirmation before removing a node

services/static-webserver/client/source/class/osparc/data/model/Node.js

@@ -578,18 +578,6 @@ qx.Class.define("osparc.data.model.Node", {
         });
     },
 
-    __deleteInBackend: function() {
-      // remove node in the backend
-      const params = {
-        url: {
-          studyId: this.getStudy().getUuid(),
-          nodeId: this.getNodeId()
-        }
-      };
-      osparc.data.Resources.fetch("studies", "deleteNode", params)
-        .catch(err => console.error(err));
-    },
-
     __applyPropsForm: function() {
       const checkIsPipelineRunning = () => {
         const isPipelineRunning = this.getStudy().isPipelineRunning();
@@ -1503,8 +1491,28 @@ qx.Class.define("osparc.data.model.Node", {
     },
 
     removeNode: function() {
-      this.__deleteInBackend();
-      this.removeIFrame();
+      return new Promise(resolve => {
+        this.__deleteInBackend()
+          .then(() => {
+            resolve(true);
+            this.removeIFrame();
+          })
+          .catch(err => {
+            console.error(err);
+            resolve(false);
+          });
+      });
+    },
+
+    __deleteInBackend: function() {
+      // remove node in the backend
+      const params = {
+        url: {
+          studyId: this.getStudy().getUuid(),
+          nodeId: this.getNodeId()
+        }
+      };
+      return osparc.data.Resources.fetch("studies", "deleteNode", params);
     },
 
     stopRequestingStatus: function() {

services/static-webserver/client/source/class/osparc/data/model/Workbench.js

@@ -503,34 +503,35 @@ qx.Class.define("osparc.data.model.Workbench", {
       this.fireEvent("pipelineChanged");
     },
 
-    removeNode: function(nodeId) {
+    removeNode: async function(nodeId) {
       if (!osparc.data.Permissions.getInstance().canDo("study.node.delete", true)) {
         return false;
       }
 
-      // remove first the connected edges
-      const connectedEdges = this.getConnectedEdges(nodeId);
-      connectedEdges.forEach(connectedEdgeId => {
-        this.removeEdge(connectedEdgeId);
-      });
-
       let node = this.getNode(nodeId);
       if (node) {
-        node.removeNode();
+        const removed = await node.removeNode();
+        if (removed) {
+          // remove first the connected edges
+          const connectedEdges = this.getConnectedEdges(nodeId);
+          connectedEdges.forEach(connectedEdgeId => {
+            this.removeEdge(connectedEdgeId);
+          });
 
-        const isTopLevel = Object.prototype.hasOwnProperty.call(this.__rootNodes, nodeId);
-        if (isTopLevel) {
-          delete this.__rootNodes[nodeId];
-        }
+          const isTopLevel = Object.prototype.hasOwnProperty.call(this.__rootNodes, nodeId);
+          if (isTopLevel) {
+            delete this.__rootNodes[nodeId];
+          }
 
-        // remove it from slideshow
-        if (this.getStudy()) {
-          this.getStudy().getUi().getSlideshow()
-            .removeNode(nodeId);
-        }
+          // remove it from slideshow
+          if (this.getStudy()) {
+            this.getStudy().getUi().getSlideshow()
+              .removeNode(nodeId);
+          }
 
-        this.fireEvent("pipelineChanged");
-        return true;
+          this.fireEvent("pipelineChanged");
+          return true;
+        }
       }
       return false;
     },

services/static-webserver/client/source/class/osparc/desktop/WorkbenchView.js

@@ -1276,10 +1276,11 @@ qx.Class.define("osparc.desktop.WorkbenchView", {
       }
     },
 
-    __doRemoveNode: function(nodeId) {
+    __doRemoveNode: async function(nodeId) {
       const workbench = this.getStudy().getWorkbench();
       const connectedEdges = workbench.getConnectedEdges(nodeId);
-      if (workbench.removeNode(nodeId)) {
+      const removed = await workbench.removeNode(nodeId);
+      if (removed) {
         // remove first the connected edges
         for (let i = 0; i < connectedEdges.length; i++) {
           const edgeId = connectedEdges[i];