#949 Opening right flyout with many nodes in canvas is slow (#950)

elyra-ai · Mar 3, 2022 · 244afe1 · 244afe1
1 parent b2b5501
commit 244afe1
Show file tree

Hide file tree

Showing 2 changed files with 76 additions and 36 deletions.
diff --git a/canvas_modules/common-canvas/src/object-model/api-pipeline.js b/canvas_modules/common-canvas/src/object-model/api-pipeline.js
@@ -607,26 +607,16 @@ export default class APIPipeline {
 	}
 
 	getNodes() {
-		const pipeline = this.objectModel.getCanvasInfoPipeline(this.pipelineId);
-		if (pipeline) {
-			return pipeline.nodes;
-		}
-		return [];
+		return this.store.getNodes(this.pipelineId);
 	}
 
 	// Returns the IDs of all nodes in the pipeline.
 	getNodeIds() {
-		const pipeline = this.objectModel.getCanvasInfoPipeline(this.pipelineId);
-		if (pipeline) {
-			return pipeline.nodes.map((node) => node.id);
-		}
-		return [];
+		return this.getNodes().map((n) => n.id);
 	}
 
 	getNode(nodeId) {
-		return this.getNodes().find((node) => {
-			return (node.id === nodeId);
-		});
+		return this.store.getNode(nodeId, this.pipelineId);
 	}
 
 	getSupernodes() {
@@ -1058,18 +1048,11 @@ export default class APIPipeline {
 	}
 
 	getComments() {
-		const pipeline = this.objectModel.getCanvasInfoPipeline(this.pipelineId);
-		if (pipeline) {
-			return pipeline.comments;
-		}
-		return [];
-
+		return this.store.getComments(this.pipelineId);
 	}
 
 	getComment(commentId) {
-		return this.getComments().find((comment) => {
-			return (comment.id === commentId);
-		});
+		return this.store.getComment(commentId, this.pipelineId);
 	}
 
 	editComment(data) {
@@ -1233,21 +1216,12 @@ export default class APIPipeline {
 	}
 
 	getLinks() {
-		const pipeline = this.objectModel.getCanvasInfoPipeline(this.pipelineId);
-		if (pipeline) {
-			return pipeline.links;
-		}
-		return [];
-
+		return this.store.getLinks(this.pipelineId);
 	}
 
 	// Returns the IDs of all links in the pipeline.
 	getLinkIds() {
-		const pipeline = this.objectModel.getCanvasInfoPipeline(this.pipelineId);
-		if (pipeline) {
-			return pipeline.links.map((link) => link.id);
-		}
-		return [];
+		return this.getLinks().map((l) => l.id);
 	}
 
 	// Returns an array of links from canvas info links which link
@@ -1419,9 +1393,7 @@ export default class APIPipeline {
 	}
 
 	getLink(linkId) {
-		return this.getLinks().find((link) => {
-			return (link.id === linkId);
-		});
+		return this.store.getLink(linkId, this.pipelineId);
 	}
 
 	setLinkProperties(linkId, linkProperties) {

diff --git a/canvas_modules/common-canvas/src/object-model/redux/canvas-store.js b/canvas_modules/common-canvas/src/object-model/redux/canvas-store.js
@@ -105,6 +105,74 @@ export default class CanavasStore {
 		return cloneDeep(this.store.getState().canvasinfo);
 	}
 
+	// This is a service method for retrieving the internal pipeline. It does NOT
+	// clone the pipeline therefore it should NOT be called from outside this
+	// class because we don't want to surface the intenal data in redux to
+	// the outside world.
+	getNonClonedPipeline(pipelineId) {
+		return this.store.getState().canvasinfo.pipelines.find((p) => p.id === pipelineId);
+	}
+
+	getNodes(pipelineId) {
+		const pipeline = this.getNonClonedPipeline(pipelineId);
+		if (pipeline && pipeline.nodes) {
+			return cloneDeep(pipeline.nodes);
+		}
+		return [];
+	}
+
+	getNode(nodeId, pipelineId) {
+		const pipeline = this.getNonClonedPipeline(pipelineId);
+		let node = null;
+		if (pipeline && pipeline.nodes) {
+			const internalNode = pipeline.nodes.find((n) => (n.id === nodeId));
+			if (internalNode) {
+				node = cloneDeep(internalNode);
+			}
+		}
+		return node;
+	}
+
+	getComments(pipelineId) {
+		const pipeline = this.getNonClonedPipeline(pipelineId);
+		if (pipeline && pipeline.comments) {
+			return cloneDeep(pipeline.comments);
+		}
+		return [];
+	}
+
+	getComment(commentId, pipelineId) {
+		const pipeline = this.getNonClonedPipeline(pipelineId);
+		let com = null;
+		if (pipeline && pipeline.comments) {
+			const internalCom = pipeline.comments.find((c) => (c.id === commentId));
+			if (internalCom) {
+				com = cloneDeep(internalCom);
+			}
+		}
+		return com;
+	}
+
+	getLinks(pipelineId) {
+		const pipeline = this.getNonClonedPipeline(pipelineId);
+		if (pipeline && pipeline.links) {
+			return cloneDeep(pipeline.links);
+		}
+		return [];
+	}
+
+	getLink(linkId, pipelineId) {
+		const pipeline = this.getNonClonedPipeline(pipelineId);
+		let link = null;
+		if (pipeline && pipeline.links) {
+			const internalLink = pipeline.links.find((l) => (l.id === linkId));
+			if (internalLink) {
+				link = cloneDeep(internalLink);
+			}
+		}
+		return link;
+	}
+
 	getBreadcrumbs() {
 		return cloneDeep(this.store.getState().breadcrumbs);
 	}