#2046 Miscellaneous improvements to sample apps (#2047)

Signed-off-by: CTomlyn <[email protected]>
elyra-ai · Jul 1, 2024 · 07e6fd5 · 07e6fd5
1 parent e4fe975
commit 07e6fd5
Show file tree

Hide file tree

Showing 40 changed files with 308 additions and 470 deletions.
diff --git a/canvas_modules/common-canvas/src/common-canvas/constants/canvas-constants.js b/canvas_modules/common-canvas/src/common-canvas/constants/canvas-constants.js
@@ -1,5 +1,5 @@
 /*
- * Copyright 2017-2023 Elyra Authors
+ * Copyright 2017-2024 Elyra Authors
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -31,6 +31,10 @@ export const DEFAULT_NOTIFICATION_HEADER = "Notifications";
 // Used by both toolbar and notification panel.
 export const NOTIFICATION_ICON_CLASS = "notificationCounterIcon";
 
+// Values for enableNodeFormatType config parameter
+export const NODE_FORMAT_VERTICAL = "Vertical";
+export const NODE_FORMAT_HORIZONTAL = "Horizontal";
+
 // Values for enableInteractionType config parameter
 export const INTERACTION_MOUSE = "Mouse";
 export const INTERACTION_TRACKPAD = "Trackpad";
@@ -81,11 +85,21 @@ export const STATE_TAG_NONE = "None";
 export const STATE_TAG_LOCKED = "Locked";
 export const STATE_TAG_READ_ONLY = "ReadOnly";
 
-// Values for enableSaveZoom
+// Values for enableUnderlay config parameter
+export const UNDERLAY_NONE = "None";
+export const UNDERLAY_VARIABLE = "Variable";
+
+// Values for enableSaveZoom config parameter
 export const SAVE_ZOOM_NONE = "None";
 export const SAVE_ZOOM_PIPELINE_FLOW = "Pipelineflow";
 export const SAVE_ZOOM_LOCAL_STORAGE = "LocalStorage";
 
+// Values for enableImageDisplay config parameter
+export const IMAGE_DISPLAY_SVG_INLINE = "SVGInline";
+export const IMAGE_DISPLAY_LOAD_SVG_TO_DEFS = "LoadSVGToDefs";
+export const IMAGE_DISPLAY_SVG_AS_IMAGE = "SVGAsImage";
+
+
 export const ERROR = "error";
 export const WARNING = "warning";
 export const INFO = "info";

diff --git a/canvas_modules/common-canvas/src/object-model/config-utils.js b/canvas_modules/common-canvas/src/object-model/config-utils.js
@@ -19,7 +19,11 @@
 
 import { isMatch, isMatchWith, omit } from "lodash";
 import LayoutDimensions from "./layout-dimensions.js";
-import { ASSOC_STRAIGHT, LINK_SELECTION_NONE } from "../common-canvas/constants/canvas-constants";
+import {
+	ASSOC_STRAIGHT,
+	LINK_SELECTION_NONE,
+	NODE_FORMAT_HORIZONTAL
+} from "../common-canvas/constants/canvas-constants";
 
 export default class ConfigUtils {
 
@@ -51,7 +55,7 @@ export default class ConfigUtils {
 			// TODO Remove this when paletteInitialState is removed from common-canvas.
 			// paletteInitialState: false,
 			enableInteractionType: "Mouse",
-			enableNodeFormatType: "Horizontal",
+			enableNodeFormatType: NODE_FORMAT_HORIZONTAL,
 			enableLinkType: "Curve",
 			enableStraightLinksAsFreeform: false, // TODO - Remove in next major release.
 			enableLinkMethod: "Ports",

diff --git a/canvas_modules/common-canvas/src/object-model/layout-dimensions.js b/canvas_modules/common-canvas/src/object-model/layout-dimensions.js
@@ -19,7 +19,8 @@ import {
 	LINK_METHOD_FREEFORM,
 	LINK_METHOD_PORTS,
 	LINK_TYPE_STRAIGHT,
-	LINK_DIR_LEFT_RIGHT
+	LINK_DIR_LEFT_RIGHT,
+	NODE_FORMAT_VERTICAL
 } from "../common-canvas/constants/canvas-constants";
 
 const portsHorizontalDefaultLayout = {
@@ -860,7 +861,7 @@ export default class LayoutDimensions {
 
 	static getDefaultLayout(config) {
 		let defaultLayout;
-		if (config && config.enableNodeFormatType === "Vertical") {
+		if (config && config.enableNodeFormatType === NODE_FORMAT_VERTICAL) {
 			defaultLayout = portsVerticalDefaultLayout;
 
 		} else {

diff --git a/canvas_modules/harness/src/client/App.js b/canvas_modules/harness/src/client/App.js
@@ -46,17 +46,17 @@ import TablesCanvas from "./components/custom-canvases/tables/tables-canvas";
 import StagesCanvas from "./components/custom-canvases/stages/stages-canvas";
 import StagesCardNodeCanvas from "./components/custom-canvases/stages-card-node/stages-card-node-canvas";
 import LogicCanvas from "./components/custom-canvases/logic/logic-canvas";
-import ReadOnlyCanvas from "./components/custom-canvases/read-only/read-only";
-import ProgressCanvas from "./components/custom-canvases/progress/progress";
+import ReadOnlyCanvas from "./components/custom-canvases/read-only/read-only-canvas";
+import ProgressCanvas from "./components/custom-canvases/progress/progress-canvas";
 import ExplainCanvas from "./components/custom-canvases/explain/explain-canvas";
 import Explain2Canvas from "./components/custom-canvases/explain2/explain2-canvas";
 import StreamsCanvas from "./components/custom-canvases/streams/streams-canvas";
 import JsxIconsCanvas from "./components/custom-canvases/jsx-icons/jsx-icons-canvas";
 import AllPortsCanvas from "./components/custom-canvases/all-ports/all-ports-canvas";
 import ParallaxCanvas from "./components/custom-canvases/parallax/parallax-canvas";
 import NetworkCanvas from "./components/custom-canvases/network/network-canvas";
-import ReactNodesCarbonCanvas from "./components/custom-canvases/react-nodes-carbon/react-nodes-carbon";
-import ReactNodesMappingCanvas from "./components/custom-canvases/react-nodes-mapping/react-nodes-mapping";
+import ReactNodesCarbonCanvas from "./components/custom-canvases/react-nodes-carbon/react-nodes-carbon-canvas";
+import ReactNodesMappingCanvas from "./components/custom-canvases/react-nodes-mapping/react-nodes-mapping-canvas";
 
 import Breadcrumbs from "./components/breadcrumbs.jsx";
 import Console from "./components/console/console.jsx";
@@ -97,12 +97,6 @@ import {
 	SIDE_PANEL_MODAL,
 	SIDE_PANEL_API,
 	CHOOSE_FROM_LOCATION,
-	INTERACTION_MOUSE,
-	VERTICAL_FORMAT,
-	NONE_SAVE_ZOOM,
-	IMAGE_DISPLAY_SVG_INLINE,
-	ASSOC_STRAIGHT,
-	UNDERLAY_NONE,
 	EXAMPLE_APP_NONE,
 	EXAMPLE_APP_FLOWS,
 	EXAMPLE_APP_STAGES,
@@ -121,15 +115,12 @@ import {
 	EXAMPLE_APP_REACT_NODES_CARBON,
 	EXAMPLE_APP_REACT_NODES_MAPPING,
 	CUSTOM,
-	PALETTE_FLYOUT,
 	PROPERTIES_FLYOUT,
-	NONE_DRAG,
 	INPUT_PORT,
 	OUTPUT_PORT,
 	NOTIFICATION_MESSAGE_TYPE,
 	PARAMETER_DEFS,
 	PRIMARY,
-	TOOLBAR_LAYOUT_TOP,
 	TOOLBAR_TYPE_DEFAULT,
 	TOOLBAR_TYPE_SUB_AREAS,
 	TOOLBAR_TYPE_SINGLE_BAR,
@@ -139,14 +130,23 @@ import {
 	TOOLBAR_TYPE_CUSTOM_ACTIONS,
 	TOOLBAR_TYPE_OVERRIDE_AUTO_ENABLE_DISABLE,
 	CATEGORY_VIEW_ACCORDIONS
-} from "./constants/constants.js";
+} from "./constants/harness-constants.js";
 
 import {
+	NODE_FORMAT_VERTICAL,
+	INTERACTION_MOUSE,
+	SNAP_TO_GRID_NONE,
+	SAVE_ZOOM_NONE,
 	STATE_TAG_NONE,
 	LINK_TYPE_CURVE,
 	LINK_DIR_LEFT_RIGHT,
 	LINK_METHOD_PORTS,
-	LINK_SELECTION_NONE
+	LINK_SELECTION_NONE,
+	ASSOC_STRAIGHT,
+	IMAGE_DISPLAY_SVG_INLINE,
+	UNDERLAY_NONE,
+	PALETTE_LAYOUT_FLYOUT,
+	TOOLBAR_LAYOUT_TOP
 } from "../../../common-canvas/src/common-canvas/constants/canvas-constants.js";
 
 import EXTERNAL_SUB_FLOW_CANVAS_1 from "../../test_resources/diagrams/externalSubFlowCanvas1.json";
@@ -188,14 +188,14 @@ class App extends React.Component {
 			selectedAssocLinkCreation: false,
 			selectedMarkdownInComments: false,
 			selectedContextToolbar: false,
-			selectedSnapToGridType: NONE_DRAG,
+			selectedSnapToGridType: SNAP_TO_GRID_NONE,
 			enteredSnapToGridX: "",
 			enteredSnapToGridY: "",
 			selectedInteractionType: INTERACTION_MOUSE,
-			selectedNodeFormatType: VERTICAL_FORMAT,
+			selectedNodeFormatType: NODE_FORMAT_VERTICAL,
 			selectedToolbarLayout: TOOLBAR_LAYOUT_TOP,
 			selectedToolbarType: TOOLBAR_TYPE_DEFAULT,
-			selectedSaveZoom: NONE_SAVE_ZOOM,
+			selectedSaveZoom: SAVE_ZOOM_NONE,
 			selectedZoomIntoSubFlows: false,
 			selectedSingleOutputPortDisplay: false,
 			selectedImageDisplay: IMAGE_DISPLAY_SVG_INLINE,
@@ -209,7 +209,7 @@ class App extends React.Component {
 			selectedAssocLinkType: ASSOC_STRAIGHT,
 			selectedCanvasUnderlay: UNDERLAY_NONE,
 			selectedExampleApp: EXAMPLE_APP_NONE,
-			selectedPaletteLayout: PALETTE_FLYOUT,
+			selectedPaletteLayout: PALETTE_LAYOUT_FLYOUT,
 			selectedStateTag: STATE_TAG_NONE,
 			selectedTipConfig: {
 				"palette": {