✨ Add more frontend hooks (#1687)

* ⚡ add hook for nodecreatelist mount

* ⚡ add hook for nodeCreateList selectedTypeChanged

* ⚡ add hook for nodeCreateList nodeFilterChanged

* ⚡ add hook for nodeCreateList filteredNodeTypesComputed

* ⚡ add hook for nodeView.activeNodeChanged

* ⚡ add hook for credentialsEdit credentialTypeChanged

* ⚡ add hook for onDocumentationUrlClick

* ⚡ add hook for executionsList openDialog

* ⚡ add hook for execution open

* ⚡ add hook for credentialsList dialogVisibleChanged

* ⚡ add hook for workflowSettings

* ⚡ add hook for showMessage showError

* ⚡ add hook for nodeView createNodeActiveChanged

* ⚡ add hook for nodeView addNodeButton

* ⚡ cleanup

* ⚡ add hook for workflowRun runWorkflow

* ⚡ add hook for pushConnection executionFinished

* ⚡ add hook for runData.displayModeChanged

* ⚡ update nodeCreateList.nodeFilterChanged hook

* ⚡ update dataDisplay nodeTypeChanged hook

* ⚡ update dataDisplay nodeTypeChanged hook

* ⚡ update dataDisplay nodeTypeChanged hook

* ⚡ update error data in hooks

* update workflowRun runError hook

* ⚡ Minor improvements

Co-authored-by: Jan Oberhauser <jan.oberhauser@gmail.com>

packages/editor-ui/src/components/mixins/nodeHelpers.ts

@@ -13,6 +13,8 @@ import {
 	IRunData,
 	IRunExecutionData,
 	ITaskDataConnections,
+	INode,
+	INodePropertyOptions,
 } from 'n8n-workflow';
 
 import {
@@ -321,5 +323,43 @@ export const nodeHelpers = mixins(
 					this.updateNodeCredentialIssues(node);
 				}
 			},
+			// @ts-ignore
+			getNodeSubtitle (data, nodeType, workflow): string | undefined {
+				if (data.notesInFlow) {
+					return data.notes;
+				}
+	
+				if (nodeType !== null && nodeType.subtitle !== undefined) {
+					return workflow.expression.getSimpleParameterValue(data as INode, nodeType.subtitle, 'internal') as string | undefined;
+				}
+	
+				if (data.parameters.operation !== undefined) {
+					const operation = data.parameters.operation as string;
+					if (nodeType === null) {
+						return operation;
+					}
+	
+					const operationData:INodeProperties = nodeType.properties.find((property: INodeProperties) => {
+						return property.name === 'operation';
+					});
+					if (operationData === undefined) {
+						return operation;
+					}
+	
+					if (operationData.options === undefined) {
+						return operation;
+					}
+	
+					const optionData = operationData.options.find((option) => {
+						return (option as INodePropertyOptions).value === data.parameters.operation;
+					});
+					if (optionData === undefined) {
+						return operation;
+					}
+	
+					return optionData.name;
+				}
+				return undefined;
+			},
 		},
 	});

packages/editor-ui/src/components/mixins/pushConnection.ts

@@ -8,6 +8,7 @@ import {
 	IPushDataTestWebhook,
 } from '../../Interface';
 
+import { externalHooks } from '@/components/mixins/externalHooks';
 import { nodeHelpers } from '@/components/mixins/nodeHelpers';
 import { showMessage } from '@/components/mixins/showMessage';
 import { titleChange } from '@/components/mixins/titleChange';
@@ -15,6 +16,7 @@ import { titleChange } from '@/components/mixins/titleChange';
 import mixins from 'vue-typed-mixins';
 
 export const pushConnection = mixins(
+	externalHooks,
 	nodeHelpers,
 	showMessage,
 	titleChange,
@@ -202,6 +204,7 @@ export const pushConnection = mixins(
 
 					const runDataExecuted = pushData.data;
 
+					let runDataExecutedErrorMessage;
 					// @ts-ignore
 					const workflow = this.getWorkflow();
 					if (runDataExecuted.finished !== true) {
@@ -221,6 +224,9 @@ export const pushConnection = mixins(
 								: runDataExecuted.data.resultData.error.message;
 							errorMessage = `There was a problem executing the workflow:<br /><strong>"${receivedError}"</strong>`;
 						}
+
+						runDataExecutedErrorMessage = errorMessage;
+
 						this.$titleSet(workflow.name, 'ERROR');
 						this.$showMessage({
 							title: 'Problem executing workflow',
@@ -249,6 +255,20 @@ export const pushConnection = mixins(
 					// Set the node execution issues on all the nodes which produced an error so that
 					// it can be displayed in the node-view
 					this.updateNodesExecutionIssues();
+
+					let itemsCount = 0;
+					if(runDataExecuted.data.resultData.lastNodeExecuted && !runDataExecutedErrorMessage) {
+						itemsCount = runDataExecuted.data.resultData.runData[runDataExecuted.data.resultData.lastNodeExecuted][0].data!.main[0]!.length;
+					}
+
+					this.$externalHooks().run('pushConnection.executionFinished', {
+						itemsCount,
+						nodeName: runDataExecuted.data.resultData.lastNodeExecuted,
+						errorMessage: runDataExecutedErrorMessage,
+						runDataExecutedStartData: runDataExecuted.data.startData,
+						resultDataError: runDataExecuted.data.resultData.error,
+					});
+
 				} else if (receivedData.type === 'executionStarted') {
 					const pushData = receivedData.data as IPushDataExecutionStarted;
 

packages/editor-ui/src/components/mixins/showMessage.ts

@@ -2,9 +2,13 @@ import Vue from 'vue';
 
 import { Notification } from 'element-ui';
 import { ElNotificationOptions } from 'element-ui/types/notification';
+import mixins from 'vue-typed-mixins';
+
+import { externalHooks } from '@/components/mixins/externalHooks';
+
 
 // export const showMessage = {
-export const showMessage = Vue.extend({
+export const showMessage = mixins(externalHooks).extend({
 	methods: {
 		$showMessage (messageData: ElNotificationOptions) {
 			messageData.dangerouslyUseHTMLString = true;
@@ -21,6 +25,7 @@ export const showMessage = Vue.extend({
 				type: 'error',
 				duration: 0,
 			});
+			this.$externalHooks().run('showMessage.showError', { title, message, errorMessage: error.message });
 		},
 	},
 });

packages/editor-ui/src/components/mixins/workflowRun.ts

@@ -53,7 +53,7 @@ export const workflowRun = mixins(
 
 			return response;
 		},
-		async runWorkflow (nodeName: string): Promise<IExecutionPushResponse | undefined> {
+		async runWorkflow (nodeName: string, source?: string): Promise<IExecutionPushResponse | undefined> {
 			if (this.$store.getters.isActionActive('workflowRunning') === true) {
 				return;
 			}
@@ -84,7 +84,7 @@ export const workflowRun = mixins(
 							duration: 0,
 						});
 						this.$titleSet(workflow.name as string, 'ERROR');
-						this.$externalHooks().run('workflow.runError', { errorMessages });
+						this.$externalHooks().run('workflowRun.runError', { errorMessages, nodeName });
 						return;
 					}
 				}
@@ -172,7 +172,11 @@ export const workflowRun = mixins(
 				};
 				this.$store.commit('setWorkflowExecutionData', executionData);
 
-				 return await this.runWorkflowApi(startRunData);
+				 const runWorkflowApiResponse = await this.runWorkflowApi(startRunData);
+
+				 this.$externalHooks().run('workflowRun.runWorkflow', { nodeName, source });
+
+				 return runWorkflowApiResponse;
 			} catch (error) {
 				this.$titleSet(workflow.name as string, 'ERROR');
 				this.$showError(error, 'Problem running workflow', 'There was a problem running the workflow:');