2 files changed, 125 insertions, 0 deletions
diff --git a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-links-utils.ts b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-links-utils.ts
index 705367c5f7..6c83810312 100644
--- a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-links-utils.ts
+++ b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-links-utils.ts
@@ -105,6 +105,46 @@ export class CompositionGraphLinkUtils {
         this.createLink(linkObg, cy, component);
     };
 
+    public batchDeleteEdges(cy: Cy.Instance, component: Component, edgesToDelete: Cy.CollectionEdges, alreadyDeleteNodeIds?: Array<string>): void {
+        let toDeleteLinks: Array<RelationshipModel> = new Array<RelationshipModel>();
+        if (alreadyDeleteNodeIds && alreadyDeleteNodeIds.length > 0) {
+            edgesToDelete.each((i: number, link: Cy.CollectionEdges) => {
+                if (alreadyDeleteNodeIds.indexOf(link.data().source) < 0 && alreadyDeleteNodeIds.indexOf(link.data().target) < 0) {
+                    toDeleteLinks.push(link.data().relation);
+                }
+            });
+        }
+        else {
+            edgesToDelete.each((i: number, link: Cy.CollectionEdges) => {
+                toDeleteLinks.push(link.data().relation);
+            });
+        }
+        this.loaderService.showLoader('composition-graph');
+        let onSuccessDeleteRelations = (response: Array<RelationshipModel>) => {
+            console.info('onSuccessDeleteRelations response is ', response);
+            //remove tempSimplePortNodes
+            if (alreadyDeleteNodeIds && alreadyDeleteNodeIds.length > 0) {
+                edgesToDelete.each((i: number, link: Cy.CollectionEdges) => {
+                    if (alreadyDeleteNodeIds.indexOf(link.data().source) < 0 && alreadyDeleteNodeIds.indexOf(link.data().target) < 0) {
+                        cy.remove(edgesToDelete);
+                    }
+                });
+            }
+            else {
+                edgesToDelete.each((i: number, link: Cy.CollectionEdges) => {
+                    cy.remove(edgesToDelete);
+                });
+            }
+        };
+
+        if (toDeleteLinks.length > 0) {
+            this.generalGraphUtils.getGraphUtilsServerUpdateQueue().addBlockingUIActionWithReleaseCallback(
+                () => component.batchDeleteRelation(toDeleteLinks).then(onSuccessDeleteRelations),
+                () => this.loaderService.hideLoader('composition-graph'));
+
+        }
+    };  
+
     public createLinkFromMenu = (cy:Cy.Instance, chosenMatch:Match, component:Component):void => {
 
         if (chosenMatch) {
diff --git a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-nodes-utils.ts b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-nodes-utils.ts
index c6c732b7df..7d08d7f9b5 100644
--- a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-nodes-utils.ts
+++ b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-nodes-utils.ts
@@ -122,6 +122,91 @@ export class CompositionGraphNodesUtils {
     };
 
     /**
+     * Batch delete component instances on server and then removes them from the graph as well
+     * @param cy
+     * @param component
+     * @param nodesToDelete
+     */
+    public batchDeleteNodes(cy:Cy.Instance, component:Component, nodesToDelete:Cy.CollectionNodes):Array<string> {
+        let nodesToDeleteIds:Array<string> = new Array<string>();
+        if(nodesToDelete && nodesToDelete.size() > 0){
+            nodesToDelete.each((i:number, node:Cy.CollectionNodes) => {
+                nodesToDeleteIds.push(node.data('id'));
+            });
+            this.loaderService.showLoader('composition-graph');
+            let componentInstances:Array<ComponentInstance> = component.componentInstances;
+            let onSuccess:(response:any) => void = (deleteFailedIds:any) => {
+                this.removeDeletedNodesOnGraph(cy, nodesToDelete, deleteFailedIds, componentInstances);
+            };
+
+            let onFailed:(response:any) => void = (response:any) => {
+                console.error('batchDeleteNodes failed error is', response);
+            };
+
+            this.GeneralGraphUtils.getGraphUtilsServerUpdateQueue().addBlockingUIActionWithReleaseCallback(
+                () => component.batchDeleteComponentInstance(nodesToDeleteIds).then(onSuccess, onFailed),
+                () => this.loaderService.hideLoader('composition-graph')
+            );
+        }
+
+            return nodesToDeleteIds;
+    };
+
+    private deleteNodeSuccess(cy:Cy.Instance, component:Component, nodeToDelete:Cy.CollectionNodes):void{
+        //if node to delete is a UCPE, remove all children (except UCPE-CPs) and remove their "hostedOn" links
+        if (nodeToDelete.data().isUcpe) {
+            _.each(cy.nodes('[?isInsideGroup]'), (node)=> {
+                this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_REMOVE_NODE_FROM_UCPE, node, nodeToDelete);
+            });
+        }
+
+        //check whether the node is connected to any VLs that only have one other connection. If so, delete that VL as well
+        if (!(nodeToDelete.data() instanceof CompositionCiNodeVl)) {
+            let connectedVls:Array<Cy.CollectionFirstNode> = this.getConnectedVlToNode(nodeToDelete);
+            this.handleConnectedVlsToDelete(connectedVls);
+        }
+
+        // check whether there is a service path going through this node, and if so clean it from the graph.
+        let nodeId = nodeToDelete.data().id;
+        let connectedPathLinks = cy.collection(`[type="${CompositionCiServicePathLink.LINK_TYPE}"][source="${nodeId}"], [type="${CompositionCiServicePathLink.LINK_TYPE}"][target="${nodeId}"]`);
+        _.forEach(connectedPathLinks, (link, key) => {
+            cy.remove(`[pathId="${link.data().pathId}"]`);
+        });
+
+        // update service path list
+        this.serviceService.getComponentCompositionData(component).subscribe((response:ServiceGenericResponse) => {
+            (<Service>component).forwardingPaths = response.forwardingPaths;
+        });
+
+        this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_DELETE_COMPONENT_INSTANCE_SUCCESS, nodeId);
+
+        //update UI
+        cy.remove(nodeToDelete);
+    }
+
+    private removeDeletedNodesOnGraph(cy:Cy.Instance, nodesToDelete:Cy.CollectionNodes, deleteFailedIds:Array<string>, componentInstances:Array<ComponentInstance>):void {
+        nodesToDelete.each((j:number, nodeToDelete:Cy.CollectionNodes) => {
+            if(deleteFailedIds.indexOf(nodeToDelete.data('id')) < 0) {
+                //if node to delete is a UCPE, remove all children (except UCPE-CPs) and remove their "hostedOn" links
+                if (nodeToDelete.data().isUcpe) {
+                    _.each(cy.nodes('[?isInsideGroup]'), (node)=> {
+                        this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_REMOVE_NODE_FROM_UCPE, node , nodeToDelete);
+                    });
+                }
+
+                //check whether the node is connected to any VLs that only have one other connection. If so, delete that VL as well
+                if(!(nodeToDelete.data() instanceof CompositionCiNodeVl)) {
+                    let connectedVls:Array<Cy.CollectionFirstNode> = this.getConnectedVlToNode(nodeToDelete);
+                    this.handleConnectedVlsToDelete(connectedVls);
+                }
+
+
+                cy.remove(nodeToDelete);
+            }
+        });
+    }
+ 
+    /**
      * Finds all VLs connected to a single node
      * @param node
      * @returns {Array<Cy.CollectionFirstNode>}