ultravisor 1.0.3 → 1.0.8

package/webinterface/source/cards/Ultravisor-CardConfigGenerator.js

@@ -0,0 +1,431 @@
+/**
+ * Ultravisor Card Config Generator
+ *
+ * Converts a task type Definition object into a PictFlowCard config object.
+ * This allows any task type — built-in or user-defined — to automatically
+ * produce a matching flow card without writing a class file.
+ *
+ * Usage:
+ *   const generateCardConfig = require('./Ultravisor-CardConfigGenerator.js');
+ *   let cardConfig = generateCardConfig(taskDefinition, { Width: 220 });
+ *   // cardConfig can be passed directly to `new PictFlowCard(fable, cardConfig)`
+ */
+
+// ── Category color palette ────────────────────────────────────────────
+// Maps lowercase category names to title bar / body style colors.
+// Matches the palette established by the existing hand-crafted card files.
+const _CategoryColors =
+{
+	'flow control': { TitleBarColor: '#78909c', BodyStyle: { fill: '#eceff1', stroke: '#78909c' } },
+	'core':         { TitleBarColor: '#ab47bc', BodyStyle: { fill: '#f3e5f5', stroke: '#ab47bc' } },
+	'control':      { TitleBarColor: '#ab47bc', BodyStyle: { fill: '#f3e5f5', stroke: '#ab47bc' } },
+	'interaction':  { TitleBarColor: '#ef5350', BodyStyle: { fill: '#ffebee', stroke: '#ef5350' } },
+	'data':         { TitleBarColor: '#ff9800', BodyStyle: { fill: '#fff3e0', stroke: '#ff9800' } },
+	'file i/o':     { TitleBarColor: '#42a5f5', BodyStyle: { fill: '#eaf2f8', stroke: '#42a5f5' } },
+	'file-io':      { TitleBarColor: '#42a5f5', BodyStyle: { fill: '#eaf2f8', stroke: '#42a5f5' } },
+	'rest':         { TitleBarColor: '#29b6f6', BodyStyle: { fill: '#e1f5fe', stroke: '#29b6f6' } },
+	'meadow':       { TitleBarColor: '#66bb6a', BodyStyle: { fill: '#e8f5e9', stroke: '#66bb6a' } },
+	'pipeline':     { TitleBarColor: '#ec407a', BodyStyle: { fill: '#fce4ec', stroke: '#ec407a' } },
+	'llm':          { TitleBarColor: '#26a69a', BodyStyle: { fill: '#e0f7fa', stroke: '#26a69a' } },
+	'extension':    { TitleBarColor: '#9c6afe', BodyStyle: { fill: '#ede9fe', stroke: '#9c6afe' } },
+	'content-system': { TitleBarColor: '#42a5f5', BodyStyle: { fill: '#e3f2fd', stroke: '#42a5f5' } }
+};
+
+// ── Capability color palette ─────────────────────────────────────────
+// Maps lowercase Capability names to colors.  Used as a fallback when
+// Category does not have a specific color (e.g. for future task types).
+const _CapabilityColors =
+{
+	'flow control':      { TitleBarColor: '#78909c', BodyStyle: { fill: '#eceff1', stroke: '#78909c' } },
+	'data transform':    { TitleBarColor: '#ff9800', BodyStyle: { fill: '#fff3e0', stroke: '#ff9800' } },
+	'file system':       { TitleBarColor: '#42a5f5', BodyStyle: { fill: '#eaf2f8', stroke: '#42a5f5' } },
+	'shell':             { TitleBarColor: '#ab47bc', BodyStyle: { fill: '#f3e5f5', stroke: '#ab47bc' } },
+	'http client':       { TitleBarColor: '#29b6f6', BodyStyle: { fill: '#e1f5fe', stroke: '#29b6f6' } },
+	'meadow api':        { TitleBarColor: '#66bb6a', BodyStyle: { fill: '#e8f5e9', stroke: '#66bb6a' } },
+	'user interaction':  { TitleBarColor: '#ef5350', BodyStyle: { fill: '#ffebee', stroke: '#ef5350' } },
+	'llm':               { TitleBarColor: '#26a69a', BodyStyle: { fill: '#e0f7fa', stroke: '#26a69a' } },
+	'extension':         { TitleBarColor: '#9c6afe', BodyStyle: { fill: '#ede9fe', stroke: '#9c6afe' } },
+	'contentsystem':     { TitleBarColor: '#42a5f5', BodyStyle: { fill: '#e3f2fd', stroke: '#42a5f5' } }
+};
+
+// Default colors for unknown categories
+const _DefaultColors =
+{
+	TitleBarColor: '#37474f',
+	BodyStyle: { fill: '#eceff1', stroke: '#37474f' }
+};
+
+// ── DataType → PictForm InputType mapping ─────────────────────────────
+const _DataTypeInputMap =
+{
+	'String': 'Text',
+	'Number': 'Text',
+	'Boolean': 'Option',
+	'Array': 'TextArea',
+	'Object': 'TextArea'
+};
+
+
+// ── Helpers ───────────────────────────────────────────────────────────
+
+/**
+ * Capitalize the first letter of each word in a category string.
+ */
+function _titleCase(pString)
+{
+	if (!pString || typeof(pString) !== 'string')
+	{
+		return 'General';
+	}
+	return pString.replace(/\b\w/g, function (pChar) { return pChar.toUpperCase(); });
+}
+
+/**
+ * Get colors for a category (case-insensitive lookup).
+ */
+function _getColorsForCategory(pCategory)
+{
+	if (!pCategory || typeof(pCategory) !== 'string')
+	{
+		return _DefaultColors;
+	}
+
+	let tmpKey = pCategory.toLowerCase().trim();
+
+	if (_CategoryColors[tmpKey])
+	{
+		return _CategoryColors[tmpKey];
+	}
+
+	return _DefaultColors;
+}
+
+// ── Zone geometry lookup tables (mirrors PictProvider-Flow-Geometry) ──
+const _SideToEdge =
+{
+	'left-top': 'left', 'left': 'left', 'left-bottom': 'left',
+	'right-top': 'right', 'right': 'right', 'right-bottom': 'right',
+	'top-left': 'top', 'top': 'top', 'top-right': 'top',
+	'bottom-left': 'bottom', 'bottom': 'bottom', 'bottom-right': 'bottom'
+};
+
+/**
+ * Calculate card dimensions from port arrays.
+ *
+ * Uses the same adaptive zone sizing as PictProvider-Flow-Geometry:
+ * sums the space needed by all occupied zones on each left/right edge.
+ * This produces compact cards whose height scales linearly with total
+ * port count rather than being inflated by fixed 1/3 zone fractions.
+ *
+ * @param {Array} pInputs - Input port objects with Side, Direction
+ * @param {Array} pOutputs - Output port objects with Side, Direction
+ * @returns {{Width: number, Height: number}}
+ */
+function _calculateDimensions(pInputs, pOutputs)
+{
+	let tmpTitleBarHeight = 22;
+	let tmpMinSpacing = 16;
+	let tmpBottomPad = 16;
+	let tmpWidth = 180;
+	let tmpHeight = 80;
+
+	let tmpAllPorts = (pInputs || []).concat(pOutputs || []);
+
+	// Count ports per zone
+	let tmpCountBySide = {};
+	for (let i = 0; i < tmpAllPorts.length; i++)
+	{
+		let tmpSide = tmpAllPorts[i].Side || (tmpAllPorts[i].Direction === 'input' ? 'left' : 'right');
+		if (!tmpCountBySide[tmpSide])
+		{
+			tmpCountBySide[tmpSide] = 0;
+		}
+		tmpCountBySide[tmpSide]++;
+	}
+
+	// Sum space needed per edge across all zones.
+	// Each zone needs minSpacing * (count + 1) pixels.
+	let tmpSpacePerEdge = {};
+	for (let tmpSide in tmpCountBySide)
+	{
+		let tmpCount = tmpCountBySide[tmpSide];
+		let tmpEdge = _SideToEdge[tmpSide] || 'right';
+
+		if (tmpEdge !== 'left' && tmpEdge !== 'right')
+		{
+			continue;
+		}
+
+		let tmpZoneSpace = tmpMinSpacing * (tmpCount + 1);
+
+		if (!tmpSpacePerEdge[tmpEdge])
+		{
+			tmpSpacePerEdge[tmpEdge] = 0;
+		}
+		tmpSpacePerEdge[tmpEdge] += tmpZoneSpace;
+	}
+
+	// Height = titleBar + bottomPad + max edge space
+	for (let tmpEdge in tmpSpacePerEdge)
+	{
+		let tmpRequired = tmpTitleBarHeight + tmpBottomPad + tmpSpacePerEdge[tmpEdge];
+		tmpHeight = Math.max(tmpHeight, Math.ceil(tmpRequired));
+	}
+
+	// Adjust width for many ports
+	let tmpMaxPorts = Math.max((pInputs || []).length, (pOutputs || []).length);
+	if (tmpMaxPorts >= 4)
+	{
+		tmpWidth = Math.max(tmpWidth, 220);
+	}
+	else if (tmpMaxPorts >= 3)
+	{
+		tmpWidth = Math.max(tmpWidth, 200);
+	}
+
+	return { Width: tmpWidth, Height: tmpHeight };
+}
+
+/**
+ * Build a PropertiesPanel configuration from SettingsInputs.
+ *
+ * Uses the UltravisorSettings panel type which provides per-field
+ * mode toggles (Constant / Address / Default) and type-appropriate
+ * editors driven by the task definition schema.
+ */
+function _buildPropertiesPanel(pDefinition)
+{
+	let tmpSettings = pDefinition.SettingsInputs;
+
+	if (!Array.isArray(tmpSettings) || tmpSettings.length === 0)
+	{
+		return null;
+	}
+
+	let tmpDefaults = pDefinition.DefaultSettings || {};
+
+	// Account for mode-toggle fields (slightly taller per row) plus port summary sections below
+	let tmpPortSummaryHeight = 0;
+	if (Array.isArray(pDefinition.EventInputs) && pDefinition.EventInputs.length > 0)
+	{
+		tmpPortSummaryHeight += 30 + (pDefinition.EventInputs.length * 20);
+	}
+	if (Array.isArray(pDefinition.EventOutputs) && pDefinition.EventOutputs.length > 0)
+	{
+		tmpPortSummaryHeight += 30 + (pDefinition.EventOutputs.length * 20);
+	}
+	if (Array.isArray(pDefinition.StateOutputs) && pDefinition.StateOutputs.length > 0)
+	{
+		tmpPortSummaryHeight += 30 + (pDefinition.StateOutputs.length * 20);
+	}
+	let tmpPanelHeight = 160 + (tmpSettings.length * 65) + tmpPortSummaryHeight;
+
+	return {
+		PanelType: 'UltravisorSettings',
+		DefaultWidth: 380,
+		DefaultHeight: Math.min(tmpPanelHeight, 550),
+		Title: (pDefinition.Name || pDefinition.Hash) + ' Settings',
+		Configuration:
+		{
+			Schema: tmpSettings,
+			Defaults: tmpDefaults
+		}
+	};
+}
+
+
+// ═══════════════════════════════════════════════════════════════════════
+//  MAIN GENERATOR FUNCTION
+// ═══════════════════════════════════════════════════════════════════════
+
+/**
+ * Generate a PictFlowCard config object from a task type Definition.
+ *
+ * The returned object can be passed directly to `new PictFlowCard(fable, config)`
+ * to create a card instance ready for the flow editor palette.
+ *
+ * @param {object} pTaskDefinition - Task type definition with Hash, Name,
+ *        Description, Category, EventInputs, EventOutputs, SettingsInputs,
+ *        StateOutputs, DefaultSettings.
+ * @param {object} [pOverrides] - Optional overrides merged on top of the
+ *        generated config. Use for custom colors, sizes, port adjustments, etc.
+ * @returns {object|null} PictFlowCard constructor options, or null on failure.
+ */
+function generateCardConfigFromTaskDefinition(pTaskDefinition, pOverrides)
+{
+	if (!pTaskDefinition || !pTaskDefinition.Hash)
+	{
+		return null;
+	}
+
+	let tmpDef = pTaskDefinition;
+	let tmpCategory = tmpDef.Category || 'general';
+	let tmpColors = _getColorsForCategory(tmpCategory);
+
+	// Fallback to Capability-based colors when Category has no specific color
+	if (tmpColors === _DefaultColors && tmpDef.Capability)
+	{
+		let tmpCapKey = tmpDef.Capability.toLowerCase().trim();
+		if (_CapabilityColors[tmpCapKey])
+		{
+			tmpColors = _CapabilityColors[tmpCapKey];
+		}
+	}
+
+	// ── Build input ports ──────────────────────────────────────────
+	let tmpInputs = [];
+
+	// Event inputs → left-bottom, event-in
+	if (Array.isArray(tmpDef.EventInputs))
+	{
+		for (let i = 0; i < tmpDef.EventInputs.length; i++)
+		{
+			tmpInputs.push(
+			{
+				Name: tmpDef.EventInputs[i].Name,
+				Side: 'left-bottom',
+				PortType: 'event-in',
+				MinimumInputCount: 0,
+				MaximumInputCount: 1
+			});
+		}
+	}
+
+	// Settings inputs → left-top, setting
+	if (Array.isArray(tmpDef.SettingsInputs))
+	{
+		for (let i = 0; i < tmpDef.SettingsInputs.length; i++)
+		{
+			tmpInputs.push(
+			{
+				Name: tmpDef.SettingsInputs[i].Name,
+				Side: 'left-top',
+				PortType: 'setting',
+				MinimumInputCount: 0,
+				MaximumInputCount: 1
+			});
+		}
+	}
+
+	// ── Build output ports ─────────────────────────────────────────
+	let tmpOutputs = [];
+
+	// Event outputs → right-bottom for normal, bottom for errors
+	if (Array.isArray(tmpDef.EventOutputs))
+	{
+		for (let i = 0; i < tmpDef.EventOutputs.length; i++)
+		{
+			let tmpEvt = tmpDef.EventOutputs[i];
+
+			if (tmpEvt.IsError)
+			{
+				tmpOutputs.push(
+				{
+					Name: tmpEvt.Name,
+					Side: 'bottom',
+					PortType: 'error'
+				});
+			}
+			else
+			{
+				tmpOutputs.push(
+				{
+					Name: tmpEvt.Name,
+					Side: 'right-bottom',
+					PortType: 'event-out'
+				});
+			}
+		}
+	}
+
+	// State outputs → right-top, value
+	if (Array.isArray(tmpDef.StateOutputs))
+	{
+		for (let i = 0; i < tmpDef.StateOutputs.length; i++)
+		{
+			let tmpStateOut =
+			{
+				Name: tmpDef.StateOutputs[i].Name,
+				Side: 'right-top',
+				PortType: 'value'
+			};
+			if (tmpDef.StateOutputs[i].DataType)
+			{
+				tmpStateOut.DataType = tmpDef.StateOutputs[i].DataType;
+			}
+			tmpOutputs.push(tmpStateOut);
+		}
+	}
+
+	// ── Calculate dimensions ───────────────────────────────────────
+	let tmpDimensions = _calculateDimensions(tmpInputs, tmpOutputs);
+
+	// ── Build PropertiesPanel ──────────────────────────────────────
+	let tmpPropertiesPanel = _buildPropertiesPanel(tmpDef);
+
+	// ── Assemble the card config ───────────────────────────────────
+	let tmpConfig =
+	{
+		Title: tmpDef.Name || tmpDef.Hash,
+		Code: tmpDef.Hash,
+		Description: tmpDef.Description || '',
+		Category: _titleCase(tmpCategory),
+		TitleBarColor: tmpColors.TitleBarColor,
+		BodyStyle: { fill: tmpColors.BodyStyle.fill, stroke: tmpColors.BodyStyle.stroke },
+		Width: tmpDimensions.Width,
+		Height: tmpDimensions.Height,
+		Inputs: tmpInputs,
+		Outputs: tmpOutputs
+	};
+
+	if (tmpPropertiesPanel)
+	{
+		tmpConfig.PropertiesPanel = tmpPropertiesPanel;
+	}
+
+	// ── Apply overrides ────────────────────────────────────────────
+	if (pOverrides && typeof(pOverrides) === 'object')
+	{
+		let tmpKeys = Object.keys(pOverrides);
+
+		for (let i = 0; i < tmpKeys.length; i++)
+		{
+			let tmpKey = tmpKeys[i];
+
+			// Deep merge for known objects; shallow replace for everything else
+			if (tmpKey === 'BodyStyle' && typeof(pOverrides.BodyStyle) === 'object')
+			{
+				tmpConfig.BodyStyle = Object.assign({}, tmpConfig.BodyStyle, pOverrides.BodyStyle);
+			}
+			else if (tmpKey === 'PropertiesPanel' && typeof(pOverrides.PropertiesPanel) === 'object')
+			{
+				if (tmpConfig.PropertiesPanel)
+				{
+					tmpConfig.PropertiesPanel = Object.assign({}, tmpConfig.PropertiesPanel, pOverrides.PropertiesPanel);
+				}
+				else
+				{
+					tmpConfig.PropertiesPanel = pOverrides.PropertiesPanel;
+				}
+			}
+			else
+			{
+				tmpConfig[tmpKey] = pOverrides[tmpKey];
+			}
+		}
+	}
+
+	// ── Ensure dimensions accommodate final port layout ───────────
+	// Overrides may have replaced Inputs/Outputs, so recompute the
+	// minimum dimensions and grow if needed (never shrink).
+	let tmpFinalDimensions = _calculateDimensions(tmpConfig.Inputs, tmpConfig.Outputs);
+	tmpConfig.Width = Math.max(tmpConfig.Width || 180, tmpFinalDimensions.Width);
+	tmpConfig.Height = Math.max(tmpConfig.Height || 80, tmpFinalDimensions.Height);
+
+	return tmpConfig;
+}
+
+module.exports = generateCardConfigFromTaskDefinition;
+module.exports.CategoryColors = _CategoryColors;
+module.exports.CapabilityColors = _CapabilityColors;
+module.exports.DefaultColors = _DefaultColors;

package/webinterface/source/data/ExampleFlow-CSVPipeline.js

@@ -0,0 +1,231 @@
+/**
+ * Example Flow: Config File Processor
+ *
+ * Demonstrates a file-based config processing pipeline using the new engine task types:
+ *   Start -> Read File (config template) -> If Conditional (has placeholder?)
+ *     -> True:  Replace String (fill in value) -> Write File (output config) -> End
+ *     -> False: Error Message (missing placeholder) -> End
+ *
+ * Shows branching, error handling, and file I/O with the event-driven execution engine.
+ */
+module.exports =
+{
+	Nodes:
+	[
+		// ── Entry ────────────────────────────────────────────────
+		{
+			Hash: 'cfg-start',
+			Type: 'start',
+			X: 50,
+			Y: 200,
+			Width: 140,
+			Height: 80,
+			Title: 'Start',
+			Ports:
+			[
+				{ Hash: 'cfg-start-out', Direction: 'output', Side: 'right', Label: 'Out' }
+			],
+			Data: {}
+		},
+		// ── Read the config template ─────────────────────────────
+		{
+			Hash: 'cfg-read',
+			Type: 'read-file',
+			X: 270,
+			Y: 180,
+			Width: 200,
+			Height: 80,
+			Title: 'Read Config Template',
+			Ports:
+			[
+				{ Hash: 'cfg-read-in', Direction: 'input', Side: 'left', Label: 'BeginRead' },
+				{ Hash: 'cfg-read-done', Direction: 'output', Side: 'right', Label: 'ReadComplete' },
+				{ Hash: 'cfg-read-err', Direction: 'output', Side: 'bottom', Label: 'Error' }
+			],
+			Data: { FilePath: 'config.template.json', Encoding: 'utf8' }
+		},
+		// ── Check if placeholder exists in the content ───────────
+		{
+			Hash: 'cfg-check',
+			Type: 'if-conditional',
+			X: 550,
+			Y: 160,
+			Width: 220,
+			Height: 100,
+			Title: 'Has Placeholder?',
+			Ports:
+			[
+				{ Hash: 'cfg-check-in', Direction: 'input', Side: 'left', Label: 'Evaluate' },
+				{ Hash: 'cfg-check-true', Direction: 'output', Side: 'right', Label: 'True' },
+				{ Hash: 'cfg-check-false', Direction: 'output', Side: 'bottom', Label: 'False' }
+			],
+			Data: { DataAddress: 'TaskOutput.cfg-read.FileContent', CompareValue: '{{API_KEY}}', Operator: 'contains' }
+		},
+		// ── Replace the placeholder with the real value ──────────
+		{
+			Hash: 'cfg-replace',
+			Type: 'replace-string',
+			X: 850,
+			Y: 140,
+			Width: 220,
+			Height: 80,
+			Title: 'Fill In API Key',
+			Ports:
+			[
+				{ Hash: 'cfg-replace-in', Direction: 'input', Side: 'left', Label: 'Replace' },
+				{ Hash: 'cfg-replace-done', Direction: 'output', Side: 'right', Label: 'ReplaceComplete' },
+				{ Hash: 'cfg-replace-err', Direction: 'output', Side: 'bottom', Label: 'Error' }
+			],
+			Data: { InputString: '{~D:Record.TaskOutput.cfg-read.FileContent~}', SearchString: '{{API_KEY}}', ReplaceString: 'sk-live-abc123def456' }
+		},
+		// ── Write the processed config ──────────────────────────
+		{
+			Hash: 'cfg-write',
+			Type: 'write-file',
+			X: 1150,
+			Y: 140,
+			Width: 200,
+			Height: 80,
+			Title: 'Write Config',
+			Ports:
+			[
+				{ Hash: 'cfg-write-in', Direction: 'input', Side: 'left', Label: 'BeginWrite' },
+				{ Hash: 'cfg-write-done', Direction: 'output', Side: 'right', Label: 'WriteComplete' },
+				{ Hash: 'cfg-write-err', Direction: 'output', Side: 'bottom', Label: 'Error' }
+			],
+			Data: { FilePath: 'config.json', Content: '{~D:Record.TaskOutput.cfg-replace.ReplacedString~}', Encoding: 'utf8' }
+		},
+		// ── Error: placeholder not found ─────────────────────────
+		{
+			Hash: 'cfg-error',
+			Type: 'error-message',
+			X: 850,
+			Y: 340,
+			Width: 220,
+			Height: 80,
+			Title: 'Missing Placeholder',
+			Ports:
+			[
+				{ Hash: 'cfg-error-in', Direction: 'input', Side: 'left', Label: 'Trigger' },
+				{ Hash: 'cfg-error-done', Direction: 'output', Side: 'right', Label: 'Complete' }
+			],
+			Data: { MessageTemplate: 'Config template does not contain the {{API_KEY}} placeholder' }
+		},
+		// ── Exit ─────────────────────────────────────────────────
+		{
+			Hash: 'cfg-end',
+			Type: 'end',
+			X: 1430,
+			Y: 220,
+			Width: 140,
+			Height: 80,
+			Title: 'End',
+			Ports:
+			[
+				{ Hash: 'cfg-end-in', Direction: 'input', Side: 'left', Label: 'In' }
+			],
+			Data: {}
+		}
+	],
+	Connections:
+	[
+		// Start -> Read Config Template
+		{
+			Hash: 'cfg-c1',
+			SourceNodeHash: 'cfg-start',
+			SourcePortHash: 'cfg-start-out',
+			TargetNodeHash: 'cfg-read',
+			TargetPortHash: 'cfg-read-in',
+			Data: {}
+		},
+		// Read Config Template -> Has Placeholder?
+		{
+			Hash: 'cfg-c2',
+			SourceNodeHash: 'cfg-read',
+			SourcePortHash: 'cfg-read-done',
+			TargetNodeHash: 'cfg-check',
+			TargetPortHash: 'cfg-check-in',
+			Data: {}
+		},
+		// Has Placeholder? (True) -> Fill In API Key
+		{
+			Hash: 'cfg-c3',
+			SourceNodeHash: 'cfg-check',
+			SourcePortHash: 'cfg-check-true',
+			TargetNodeHash: 'cfg-replace',
+			TargetPortHash: 'cfg-replace-in',
+			Data: {}
+		},
+		// Fill In API Key -> Write Config
+		{
+			Hash: 'cfg-c4',
+			SourceNodeHash: 'cfg-replace',
+			SourcePortHash: 'cfg-replace-done',
+			TargetNodeHash: 'cfg-write',
+			TargetPortHash: 'cfg-write-in',
+			Data: {}
+		},
+		// Write Config -> End
+		{
+			Hash: 'cfg-c5',
+			SourceNodeHash: 'cfg-write',
+			SourcePortHash: 'cfg-write-done',
+			TargetNodeHash: 'cfg-end',
+			TargetPortHash: 'cfg-end-in',
+			Data: {}
+		},
+		// Has Placeholder? (False) -> Missing Placeholder
+		{
+			Hash: 'cfg-c6',
+			SourceNodeHash: 'cfg-check',
+			SourcePortHash: 'cfg-check-false',
+			TargetNodeHash: 'cfg-error',
+			TargetPortHash: 'cfg-error-in',
+			Data: {}
+		},
+		// Missing Placeholder -> End
+		{
+			Hash: 'cfg-c7',
+			SourceNodeHash: 'cfg-error',
+			SourcePortHash: 'cfg-error-done',
+			TargetNodeHash: 'cfg-end',
+			TargetPortHash: 'cfg-end-in',
+			Data: {}
+		},
+		// Read Config Template error -> End
+		{
+			Hash: 'cfg-c8',
+			SourceNodeHash: 'cfg-read',
+			SourcePortHash: 'cfg-read-err',
+			TargetNodeHash: 'cfg-end',
+			TargetPortHash: 'cfg-end-in',
+			Data: {}
+		},
+		// Fill In API Key error -> End
+		{
+			Hash: 'cfg-c9',
+			SourceNodeHash: 'cfg-replace',
+			SourcePortHash: 'cfg-replace-err',
+			TargetNodeHash: 'cfg-end',
+			TargetPortHash: 'cfg-end-in',
+			Data: {}
+		},
+		// Write Config error -> End
+		{
+			Hash: 'cfg-c10',
+			SourceNodeHash: 'cfg-write',
+			SourcePortHash: 'cfg-write-err',
+			TargetNodeHash: 'cfg-end',
+			TargetPortHash: 'cfg-end-in',
+			Data: {}
+		}
+	],
+	ViewState:
+	{
+		PanX: 0,
+		PanY: 0,
+		Zoom: 1,
+		SelectedNodeHash: null,
+		SelectedConnectionHash: null
+	}
+};