elyra-ai#1601 Allow individual palette nodes to be disabled (elyra-ai…

…#1606)
nmgokhale · Oct 30, 2023 · 1bfbaf9 · 1bfbaf9
1 parent e3f3f87
commit 1bfbaf9
Showing 1 changed file with 22 additions and 6 deletions.
diff --git a/canvas_modules/common-canvas/src/palette/palette-content-list-item.jsx b/canvas_modules/common-canvas/src/palette/palette-content-list-item.jsx
@@ -233,6 +233,21 @@ class PaletteContentListItem extends React.Component {
 		return highlightedElements;
 	}
 
+	// Returns the class to be applied to the main div for this palette
+	// item depending on whether we are displaying search results (or not)
+	// and if there is a special palette class specified (or not).
+	getMainDivClass() {
+		const paletteClass = this.props.nodeTypeInfo?.nodeType?.app_data?.ui_data?.palette_class_name;
+
+		let mainDivClass = this.props.isDisplaySearchResult
+			? "palette-list-item search-result"
+			: "palette-list-item";
+
+		mainDivClass += (paletteClass ? " " + paletteClass : "");
+
+		return mainDivClass;
+	}
+
 	showFullDescription() {
 		this.setState({ showFullDescription: true });
 	}
@@ -241,14 +256,17 @@ class PaletteContentListItem extends React.Component {
 		this.setState({ showFullDescription: false });
 	}
 
-	imageDrag() {
-		return false;
+	// Returns true if this item should be draggable and false if either editing actions
+	// are switched off or the palette item has a field that makes it disabled.
+	isItemDraggable() {
+		const disabled = this.props.nodeTypeInfo.nodeType?.app_data?.ui_data?.palette_disabled;
+		return this.props.isEditingEnabled && !disabled;
 	}
 
 	render() {
 		let itemText = null;
 		let labelText = get(this.props, "nodeTypeInfo.nodeType.app_data.ui_data.label", "");
-		let draggable = this.props.isEditingEnabled ? "true" : "false";
+		let draggable = this.isItemDraggable() ? "true" : "false";
 		let icon = null;
 
 		if (has(this.props.nodeTypeInfo.nodeType, "app_data.ui_data.image")) {
@@ -287,9 +305,7 @@ class PaletteContentListItem extends React.Component {
 			icon = (<Icon type={CANVAS_CARBON_ICONS.WARNING_UNFILLED} className="palette-list-item-icon-warning" draggable="false" />);
 		}
 
-		const mainDivClass = this.props.isDisplaySearchResult
-			? "palette-list-item search-result"
-			: "palette-list-item";
+		const mainDivClass = this.getMainDivClass();
 
 		const categoryLabel = this.props.isDisplaySearchResult
 			? (<div className={"palette-list-item-category-label"}>{this.getHighlightedCategoryLabel()}</div>)