✨ Add possibility to define custom node-subtitle for nodes in

UI

packages/cli/src/WebhookHelpers.ts

@@ -112,7 +112,7 @@ export function getWorkflowWebhooks(workflow: Workflow, additionalData: IWorkflo
 	}
 
 	// Get the responseMode
-	const reponseMode = webhookData.workflow.getWebhookParameterValue(workflowStartNode, webhookData.webhookDescription, 'reponseMode', 'onReceived');
+	const reponseMode = webhookData.workflow.getSimpleParameterValue(workflowStartNode, webhookData.webhookDescription['reponseMode'], 'onReceived');
 
 	if (!['onReceived', 'lastNode'].includes(reponseMode as string)) {
 		// If the mode is not known we error. Is probably best like that instead of using
@@ -248,7 +248,7 @@ export function getWorkflowWebhooks(workflow: Workflow, additionalData: IWorkflo
 				return data;
 			}
 
-			const reponseData = webhookData.workflow.getWebhookParameterValue(workflowStartNode, webhookData.webhookDescription, 'reponseData', 'firstEntryJson');
+			const reponseData = webhookData.workflow.getSimpleParameterValue(workflowStartNode, webhookData.webhookDescription['reponseData'], 'firstEntryJson');
 
 			if (didSendResponse === false) {
 				let data: IDataObject | IDataObject[];
@@ -263,7 +263,7 @@ export function getWorkflowWebhooks(workflow: Workflow, additionalData: IWorkflo
 						responseCallback(new Error('No binary data to return got found.'), {});
 					}
 
-					const responseBinaryPropertyName = webhookData.workflow.getWebhookParameterValue(workflowStartNode, webhookData.webhookDescription, 'responseBinaryPropertyName', 'data');
+					const responseBinaryPropertyName = webhookData.workflow.getSimpleParameterValue(workflowStartNode, webhookData.webhookDescription['responseBinaryPropertyName'], 'data');
 
 					if (responseBinaryPropertyName === undefined) {
 						responseCallback(new Error('No "responseBinaryPropertyName" is set.'), {});

packages/core/src/NodeExecuteFunctions.ts

@@ -249,7 +249,7 @@ export function getNodeWebhookUrl(name: string, workflow: Workflow, node: INode,
 		return undefined;
 	}
 
-	const path = workflow.getWebhookParameterValue(node, webhookDescription, 'path');
+	const path = workflow.getSimpleParameterValue(node, webhookDescription['path']);
 	if (path === undefined) {
 		return undefined;
 	}

packages/editor-ui/src/components/Node.vue

@@ -30,8 +30,8 @@
 		<div class="node-name" :title="data.name">
 			{{data.name}}
 		</div>
-		<div v-if="nodeOperation !== null" class="node-operation" :title="nodeOperation">
-			{{nodeOperation}}
+		<div v-if="nodeSubtitle !== null" class="node-subtitle" :title="nodeSubtitle">
+			{{nodeSubtitle}}
 		</div>
 		<div class="node-edit" @click.left.stop="setNodeActive" title="Edit Node">
 			<font-awesome-icon icon="pen" />
@@ -43,6 +43,7 @@
 
 import Vue from 'vue';
 import { nodeBase } from '@/components/mixins/nodeBase';
+import { workflowHelpers } from '@/components/mixins/workflowHelpers';
 
 import {
 	INodeIssueObjectProperty,
@@ -56,7 +57,7 @@ import NodeIcon from '@/components/NodeIcon.vue';
 
 import mixins from 'vue-typed-mixins';
 
-export default mixins(nodeBase).extend({
+export default mixins(nodeBase, workflowHelpers).extend({
 	name: 'Node',
 	components: {
 		NodeIcon,
@@ -88,8 +89,8 @@ export default mixins(nodeBase).extend({
 				classes.push('disabled');
 			}
 
-			if (this.nodeOperation) {
-				classes.push('has-operation');
+			if (this.nodeSubtitle) {
+				classes.push('has-subtitle');
 			}
 
 			if (this.isExecuting) {
@@ -118,7 +119,11 @@ export default mixins(nodeBase).extend({
 				return 'play';
 			}
 		},
-		nodeOperation (): string | null {
+		nodeSubtitle (): string | null {
+			if (this.nodeType.subtitle !== undefined) {
+				return this.workflow.getSimpleParameterValue(this, this.nodeType.subtitle)
+			}
+
 			if (this.data.parameters.operation !== undefined) {
 				const operation = this.data.parameters.operation as string;
 				if (this.nodeType === null) {
@@ -150,6 +155,9 @@ export default mixins(nodeBase).extend({
 		workflowRunning (): boolean {
 			return this.$store.getters.isActionActive('workflowRunning');
 		},
+		workflow () {
+			return this.getWorkflow();
+		},
 	},
 	data () {
 		return {
@@ -211,7 +219,7 @@ export default mixins(nodeBase).extend({
 		border-style: solid;
 	}
 
-	&.has-operation {
+	&.has-subtitle {
 		line-height: 38px;
 
 		.node-info-icon {
@@ -332,7 +340,7 @@ export default mixins(nodeBase).extend({
 		margin: 0 37px;
 	}
 
-	.node-operation {
+	.node-subtitle {
 		white-space: nowrap;
 		overflow: hidden;
 		text-overflow: ellipsis;

packages/node-dev/README.md

@@ -170,6 +170,7 @@ The following properties can be set in the node description:
  - **maxNodes** [optional]: If not an unlimited amount of nodes of that type can exist in a workflow the max-amount can be specified
  - **name** [required]: Nme of the node (for n8n to use internally in camelCase)
  - **properties** [required]: Properties which get displayed in the Editor UI and can be set by the user
+ - **subtitle** [optional]: Text which should be displayed underneath the name of the node in the Editor UI (can be an expression)
  - **version** [required]: Version of the node. Currently always "1" (integer). For future usage does not get used yet.
  - **webhooks** [optional]: Webhooks the node should listen to
 

packages/workflow/src/Interfaces.ts

@@ -401,6 +401,7 @@ export interface INodeTypeDescription {
 	properties: INodeProperties[];
 	credentials?: INodeCredentialDescription[];
 	maxNodes?: number; // How many nodes of that type can be created in a workflow
+	subtitle?: string;
 	hooks?: {
 		[key: string]: INodeHookDescription[] | undefined;
 		activate?: INodeHookDescription[];

packages/workflow/src/NodeHelpers.ts

@@ -370,7 +370,7 @@ export function getNodeWebhooks(workflow: Workflow, node: INode, additionalData:
 
 	const returnData: IWebhookData[] = [];
 	for (const webhookDescription of nodeType.description.webhooks) {
-		let nodeWebhookPath = workflow.getWebhookParameterValue(node, webhookDescription, 'path', 'GET');
+		let nodeWebhookPath = workflow.getSimpleParameterValue(node, webhookDescription['path'], 'GET');
 		if (nodeWebhookPath === undefined) {
 			// TODO: Use a proper logger
 			console.error(`No webhook path could be found for node "${node.name}" in workflow "${workflow.id}".`);
@@ -383,7 +383,7 @@ export function getNodeWebhooks(workflow: Workflow, node: INode, additionalData:
 
 		const path = getNodeWebhookPath(workflow.id, node, nodeWebhookPath);
 
-		const httpMethod = workflow.getWebhookParameterValue(node, webhookDescription, 'httpMethod', 'GET');
+		const httpMethod = workflow.getSimpleParameterValue(node, webhookDescription['httpMethod'], 'GET');
 
 		if (httpMethod === undefined) {
 			// TODO: Use a proper logger

packages/workflow/src/Workflow.ts

@@ -16,7 +16,6 @@ import {
 	ITaskDataConnections,
 	ITriggerResponse,
 	IWebhookData,
-	IWebhookDescription,
 	IWebhookResonseData,
 	WebhookSetupMethodNames,
 	WorkflowDataProxy,
@@ -648,18 +647,15 @@ export class Workflow {
 
 
 	/**
-	 * Resolves parameter value of parameter in webhook description
+	 * Resolves value of parameter. But does not work for workflow-data.
 	 *
-	 * @export
 	 * @param {INode} node
-	 * @param {IWebhookDescription} webhookDescription
-	 * @param {string} parameterName
+	 * @param {(string | undefined)} parameterValue
 	 * @param {string} [defaultValue]
 	 * @returns {(string | undefined)}
+	 * @memberof Workflow
 	 */
-	getWebhookParameterValue(node: INode, webhookDescription: IWebhookDescription, parameterName: string, defaultValue?: string): string | undefined {
-		const parameterValue: string | undefined = webhookDescription[parameterName];
-
+	getSimpleParameterValue(node: INode, parameterValue: string | undefined, defaultValue?: string): string | undefined {
 		if (parameterValue === undefined) {
 			// Value is not set so return the default
 			return defaultValue;