From 93a6f858fa3eb53f8b48b2a3d6b7377279dd6ed1 Mon Sep 17 00:00:00 2001
From: Charlie Kolb <charlie@n8n.io>
Date: Wed, 13 Nov 2024 11:00:02 +0100
Subject: [PATCH 01/19] feat(editor): Restrict when a ChatTrigger Node is added
 automatically (#11523)

---
 cypress/e2e/30-langchain.cy.ts                |   8 ++
 .../NodeCreator/composables/useActions.ts     |  25 +++--
 .../Node/NodeCreator/useActions.test.ts       | 100 ++++++++++++++++++
 3 files changed, 125 insertions(+), 8 deletions(-)

diff --git a/cypress/e2e/30-langchain.cy.ts b/cypress/e2e/30-langchain.cy.ts
index fb453816f6..43f6e0453c 100644
--- a/cypress/e2e/30-langchain.cy.ts
+++ b/cypress/e2e/30-langchain.cy.ts
@@ -359,6 +359,14 @@ describe('Langchain Integration', () => {
 		getConnectionBySourceAndTarget(CHAT_TRIGGER_NODE_DISPLAY_NAME, AGENT_NODE_NAME).should('exist');
 		getNodes().should('have.length', 3);
 	});
+	it('should not auto-add nodes if ChatTrigger is already present', () => {
+		addNodeToCanvas(MANUAL_CHAT_TRIGGER_NODE_NAME, true);
+		addNodeToCanvas(AGENT_NODE_NAME, true);
+
+		addNodeToCanvas(AI_LANGUAGE_MODEL_OPENAI_CHAT_MODEL_NODE_NAME, true);
+		getConnectionBySourceAndTarget(CHAT_TRIGGER_NODE_DISPLAY_NAME, AGENT_NODE_NAME).should('exist');
+		getNodes().should('have.length', 3);
+	});
 	it('should render runItems for sub-nodes and allow switching between them', () => {
 		const workflowPage = new WorkflowPage();
 		const ndv = new NDV();
diff --git a/packages/editor-ui/src/components/Node/NodeCreator/composables/useActions.ts b/packages/editor-ui/src/components/Node/NodeCreator/composables/useActions.ts
index 87be1105b7..92a5563d80 100644
--- a/packages/editor-ui/src/components/Node/NodeCreator/composables/useActions.ts
+++ b/packages/editor-ui/src/components/Node/NodeCreator/composables/useActions.ts
@@ -19,7 +19,6 @@ import {
 	AI_CATEGORY_LANGUAGE_MODELS,
 	BASIC_CHAIN_NODE_TYPE,
 	CHAT_TRIGGER_NODE_TYPE,
-	MANUAL_CHAT_TRIGGER_NODE_TYPE,
 	MANUAL_TRIGGER_NODE_TYPE,
 	NODE_CREATOR_OPEN_SOURCES,
 	NO_OP_NODE_TYPE,
@@ -204,8 +203,6 @@ export const useActions = () => {
 		);
 	}
 	function shouldPrependChatTrigger(addedNodes: AddedNode[]): boolean {
-		const { allNodes } = useWorkflowsStore();
-
 		const COMPATIBLE_CHAT_NODES = [
 			QA_CHAIN_NODE_TYPE,
 			AGENT_NODE_TYPE,
@@ -214,13 +211,25 @@ export const useActions = () => {
 			OPEN_AI_NODE_MESSAGE_ASSISTANT_TYPE,
 		];
 
-		const isChatTriggerMissing =
-			allNodes.find((node) =>
-				[MANUAL_CHAT_TRIGGER_NODE_TYPE, CHAT_TRIGGER_NODE_TYPE].includes(node.type),
-			) === undefined;
 		const isCompatibleNode = addedNodes.some((node) => COMPATIBLE_CHAT_NODES.includes(node.type));
 
-		return isCompatibleNode && isChatTriggerMissing;
+		if (!isCompatibleNode) return false;
+
+		const { allNodes, getNodeTypes } = useWorkflowsStore();
+		const { getByNameAndVersion } = getNodeTypes();
+
+		// We want to add a trigger if there are no triggers other than Manual Triggers
+		// Performance here should be fine as `getByNameAndVersion` fetches nodeTypes once in bulk
+		// and `every` aborts on first `false`
+		const shouldAddChatTrigger = allNodes.every((node) => {
+			const nodeType = getByNameAndVersion(node.type, node.typeVersion);
+
+			return (
+				!nodeType.description.group.includes('trigger') || node.type === MANUAL_TRIGGER_NODE_TYPE
+			);
+		});
+
+		return shouldAddChatTrigger;
 	}
 
 	// AI-226: Prepend LLM Chain node when adding a language model
diff --git a/packages/editor-ui/src/components/Node/NodeCreator/useActions.test.ts b/packages/editor-ui/src/components/Node/NodeCreator/useActions.test.ts
index 4b5682cbbd..cf8fa94014 100644
--- a/packages/editor-ui/src/components/Node/NodeCreator/useActions.test.ts
+++ b/packages/editor-ui/src/components/Node/NodeCreator/useActions.test.ts
@@ -5,6 +5,8 @@ import { useNodeTypesStore } from '@/stores/nodeTypes.store';
 import { useWorkflowsStore } from '@/stores/workflows.store';
 import { useActions } from './composables/useActions';
 import {
+	AGENT_NODE_TYPE,
+	GITHUB_TRIGGER_NODE_TYPE,
 	HTTP_REQUEST_NODE_TYPE,
 	MANUAL_TRIGGER_NODE_TYPE,
 	NODE_CREATOR_OPEN_SOURCES,
@@ -15,6 +17,7 @@ import {
 	TRIGGER_NODE_CREATOR_VIEW,
 	WEBHOOK_NODE_TYPE,
 } from '@/constants';
+import { CHAT_TRIGGER_NODE_TYPE } from 'n8n-workflow';
 
 describe('useActions', () => {
 	beforeAll(() => {
@@ -54,6 +57,9 @@ describe('useActions', () => {
 			vi.spyOn(workflowsStore, 'workflowTriggerNodes', 'get').mockReturnValue([
 				{ type: SCHEDULE_TRIGGER_NODE_TYPE } as never,
 			]);
+			vi.spyOn(workflowsStore, 'getNodeTypes').mockReturnValue({
+				getByNameAndVersion: () => ({ description: { group: ['trigger'] } }),
+			} as never);
 			vi.spyOn(nodeCreatorStore, 'openSource', 'get').mockReturnValue(
 				NODE_CREATOR_OPEN_SOURCES.ADD_NODE_BUTTON,
 			);
@@ -67,6 +73,100 @@ describe('useActions', () => {
 			});
 		});
 
+		test('should insert a ChatTrigger node when an AI Agent is added without trigger', () => {
+			const workflowsStore = useWorkflowsStore();
+
+			vi.spyOn(workflowsStore, 'workflowTriggerNodes', 'get').mockReturnValue([]);
+
+			const { getAddedNodesAndConnections } = useActions();
+
+			expect(getAddedNodesAndConnections([{ type: AGENT_NODE_TYPE }])).toEqual({
+				connections: [
+					{
+						from: {
+							nodeIndex: 0,
+						},
+						to: {
+							nodeIndex: 1,
+						},
+					},
+				],
+				nodes: [
+					{ type: CHAT_TRIGGER_NODE_TYPE, isAutoAdd: true },
+					{ type: AGENT_NODE_TYPE, openDetail: true },
+				],
+			});
+		});
+
+		test('should insert a ChatTrigger node when an AI Agent is added with only a Manual Trigger', () => {
+			const workflowsStore = useWorkflowsStore();
+
+			vi.spyOn(workflowsStore, 'workflowTriggerNodes', 'get').mockReturnValue([
+				{ type: MANUAL_TRIGGER_NODE_TYPE } as never,
+			]);
+			vi.spyOn(workflowsStore, 'getNodeTypes').mockReturnValue({
+				getByNameAndVersion: () => ({ description: { group: ['trigger'] } }),
+			} as never);
+
+			const { getAddedNodesAndConnections } = useActions();
+
+			expect(getAddedNodesAndConnections([{ type: AGENT_NODE_TYPE }])).toEqual({
+				connections: [
+					{
+						from: {
+							nodeIndex: 0,
+						},
+						to: {
+							nodeIndex: 1,
+						},
+					},
+				],
+				nodes: [
+					{ type: CHAT_TRIGGER_NODE_TYPE, isAutoAdd: true },
+					{ type: AGENT_NODE_TYPE, openDetail: true },
+				],
+			});
+		});
+
+		test('should not insert a ChatTrigger node when an AI Agent is added with a trigger already present', () => {
+			const workflowsStore = useWorkflowsStore();
+
+			vi.spyOn(workflowsStore, 'allNodes', 'get').mockReturnValue([
+				{ type: GITHUB_TRIGGER_NODE_TYPE } as never,
+			]);
+			vi.spyOn(workflowsStore, 'getNodeTypes').mockReturnValue({
+				getByNameAndVersion: () => ({ description: { group: ['trigger'] } }),
+			} as never);
+
+			const { getAddedNodesAndConnections } = useActions();
+
+			expect(getAddedNodesAndConnections([{ type: AGENT_NODE_TYPE }])).toEqual({
+				connections: [],
+				nodes: [{ type: AGENT_NODE_TYPE, openDetail: true }],
+			});
+		});
+
+		test('should not insert a ChatTrigger node when an AI Agent is added with a Chat Trigger already present', () => {
+			const workflowsStore = useWorkflowsStore();
+
+			vi.spyOn(workflowsStore, 'workflowTriggerNodes', 'get').mockReturnValue([
+				{ type: CHAT_TRIGGER_NODE_TYPE } as never,
+			]);
+			vi.spyOn(workflowsStore, 'allNodes', 'get').mockReturnValue([
+				{ type: CHAT_TRIGGER_NODE_TYPE } as never,
+			]);
+			vi.spyOn(workflowsStore, 'getNodeTypes').mockReturnValue({
+				getByNameAndVersion: () => ({ description: { group: ['trigger'] } }),
+			} as never);
+
+			const { getAddedNodesAndConnections } = useActions();
+
+			expect(getAddedNodesAndConnections([{ type: AGENT_NODE_TYPE }])).toEqual({
+				connections: [],
+				nodes: [{ type: AGENT_NODE_TYPE, openDetail: true }],
+			});
+		});
+
 		test('should insert a No Op node when a Loop Over Items Node is added', () => {
 			const workflowsStore = useWorkflowsStore();
 			const nodeCreatorStore = useNodeCreatorStore();

From a412ab7ebfcd6aa9051a8ca36e34f1067102c998 Mon Sep 17 00:00:00 2001
From: oleg <me@olegivaniv.com>
Date: Wed, 13 Nov 2024 11:05:19 +0100
Subject: [PATCH 02/19] feat(editor): Redesign Canvas Chat (#11634)

---
 cypress/composables/modals/chat-modal.ts      |   6 +-
 cypress/e2e/30-langchain.cy.ts                |   9 +-
 package.json                                  |   1 +
 packages/@n8n/chat/src/__tests__/setup.ts     |  12 +
 .../@n8n/chat/src/components/ChatFile.vue     |  32 +-
 packages/@n8n/chat/src/components/Input.vue   | 102 ++-
 packages/@n8n/chat/src/components/Message.vue |  13 +-
 .../chat/src/components/MessageTyping.vue     |   7 +-
 packages/@n8n/chat/src/css/markdown.scss      |   4 +-
 packages/editor-ui/src/App.vue                |  63 +-
 packages/editor-ui/src/__tests__/mocks.ts     |   3 +
 .../AskAssistantFloatingButton.vue            |   5 +-
 .../components/CanvasChat/CanvasChat.test.ts  | 586 +++++++++++++++
 .../src/components/CanvasChat/CanvasChat.vue  | 350 +++++++++
 .../CanvasChat/components/ChatLogsPanel.vue   |  91 +++
 .../components/ChatMessagesPanel.vue          | 348 +++++++++
 .../components/MessageOptionAction.vue        |  46 ++
 .../components/MessageOptionTooltip.vue       |  40 +
 .../composables/useChatMessaging.ts           | 299 ++++++++
 .../CanvasChat/composables/useChatTrigger.ts  | 138 ++++
 .../CanvasChat/composables/useResize.ts       | 137 ++++
 .../src/components/CanvasChat/types/chat.ts   |  22 +
 packages/editor-ui/src/components/Modals.vue  |   6 -
 .../RunDataAi/AiRunContentBlock.vue           |  63 +-
 .../src/components/RunDataAi/RunDataAi.vue    | 154 ++--
 .../RunDataAi/useAiContentParsers.ts          |  10 +-
 .../WorkflowLMChat/MessageOptionAction.vue    |  31 -
 .../WorkflowLMChat/MessageOptionTooltip.vue   |  15 -
 .../WorkflowLMChat/WorkflowLMChat.vue         | 699 ------------------
 .../components/WorkflowLMChatModal.test.ts    | 127 ----
 .../elements/buttons/CanvasChatButton.vue     |   8 +
 .../src/composables/useRunWorkflow.ts         |  10 +-
 .../editor-ui/src/composables/useToast.ts     |   6 +-
 packages/editor-ui/src/constants.ts           |   1 -
 .../src/plugins/i18n/locales/en.json          |  13 +-
 packages/editor-ui/src/router.ts              |   3 +
 packages/editor-ui/src/stores/canvas.store.ts |  10 +-
 packages/editor-ui/src/stores/ui.store.ts     |   2 -
 .../editor-ui/src/stores/workflows.store.ts   |  18 +
 packages/editor-ui/src/views/NodeView.v2.vue  |  11 +-
 packages/editor-ui/src/views/NodeView.vue     |  13 +-
 41 files changed, 2451 insertions(+), 1063 deletions(-)
 create mode 100644 packages/editor-ui/src/components/CanvasChat/CanvasChat.test.ts
 create mode 100644 packages/editor-ui/src/components/CanvasChat/CanvasChat.vue
 create mode 100644 packages/editor-ui/src/components/CanvasChat/components/ChatLogsPanel.vue
 create mode 100644 packages/editor-ui/src/components/CanvasChat/components/ChatMessagesPanel.vue
 create mode 100644 packages/editor-ui/src/components/CanvasChat/components/MessageOptionAction.vue
 create mode 100644 packages/editor-ui/src/components/CanvasChat/components/MessageOptionTooltip.vue
 create mode 100644 packages/editor-ui/src/components/CanvasChat/composables/useChatMessaging.ts
 create mode 100644 packages/editor-ui/src/components/CanvasChat/composables/useChatTrigger.ts
 create mode 100644 packages/editor-ui/src/components/CanvasChat/composables/useResize.ts
 create mode 100644 packages/editor-ui/src/components/CanvasChat/types/chat.ts
 delete mode 100644 packages/editor-ui/src/components/WorkflowLMChat/MessageOptionAction.vue
 delete mode 100644 packages/editor-ui/src/components/WorkflowLMChat/MessageOptionTooltip.vue
 delete mode 100644 packages/editor-ui/src/components/WorkflowLMChat/WorkflowLMChat.vue
 delete mode 100644 packages/editor-ui/src/components/WorkflowLMChatModal.test.ts

diff --git a/cypress/composables/modals/chat-modal.ts b/cypress/composables/modals/chat-modal.ts
index 254d811a18..220c363dd1 100644
--- a/cypress/composables/modals/chat-modal.ts
+++ b/cypress/composables/modals/chat-modal.ts
@@ -3,7 +3,7 @@
  */
 
 export function getManualChatModal() {
-	return cy.getByTestId('lmChat-modal');
+	return cy.getByTestId('canvas-chat');
 }
 
 export function getManualChatInput() {
@@ -19,11 +19,11 @@ export function getManualChatMessages() {
 }
 
 export function getManualChatModalCloseButton() {
-	return getManualChatModal().get('.el-dialog__close');
+	return cy.getByTestId('workflow-chat-button');
 }
 
 export function getManualChatModalLogs() {
-	return getManualChatModal().getByTestId('lm-chat-logs');
+	return cy.getByTestId('canvas-chat-logs');
 }
 export function getManualChatDialog() {
 	return getManualChatModal().getByTestId('workflow-lm-chat-dialog');
diff --git a/cypress/e2e/30-langchain.cy.ts b/cypress/e2e/30-langchain.cy.ts
index 43f6e0453c..78934c3ce5 100644
--- a/cypress/e2e/30-langchain.cy.ts
+++ b/cypress/e2e/30-langchain.cy.ts
@@ -14,7 +14,6 @@ import {
 } from './../constants';
 import {
 	closeManualChatModal,
-	getManualChatDialog,
 	getManualChatMessages,
 	getManualChatModal,
 	getManualChatModalLogs,
@@ -168,7 +167,7 @@ describe('Langchain Integration', () => {
 			lastNodeExecuted: BASIC_LLM_CHAIN_NODE_NAME,
 		});
 
-		getManualChatDialog().should('contain', outputMessage);
+		getManualChatMessages().should('contain', outputMessage);
 	});
 
 	it('should be able to open and execute Agent node', () => {
@@ -208,7 +207,7 @@ describe('Langchain Integration', () => {
 			lastNodeExecuted: AGENT_NODE_NAME,
 		});
 
-		getManualChatDialog().should('contain', outputMessage);
+		getManualChatMessages().should('contain', outputMessage);
 	});
 
 	it('should add and use Manual Chat Trigger node together with Agent node', () => {
@@ -229,8 +228,6 @@ describe('Langchain Integration', () => {
 
 		clickManualChatButton();
 
-		getManualChatModalLogs().should('not.exist');
-
 		const inputMessage = 'Hello!';
 		const outputMessage = 'Hi there! How can I assist you today?';
 		const runData = [
@@ -335,6 +332,8 @@ describe('Langchain Integration', () => {
 		getManualChatModalLogsEntries().should('have.length', 1);
 
 		closeManualChatModal();
+		getManualChatModalLogs().should('not.exist');
+		getManualChatModal().should('not.exist');
 	});
 
 	it('should auto-add chat trigger and basic LLM chain when adding LLM node', () => {
diff --git a/package.json b/package.json
index 1b35d0384f..c7d4512b2e 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
     "build:nodes": "turbo run build:nodes",
     "typecheck": "turbo typecheck",
     "dev": "turbo run dev --parallel --env-mode=loose --filter=!n8n-design-system --filter=!@n8n/chat --filter=!@n8n/task-runner",
+    "dev:be": "turbo run dev --parallel --env-mode=loose --filter=!n8n-design-system --filter=!@n8n/chat --filter=!@n8n/task-runner --filter=!n8n-editor-ui",
     "dev:ai": "turbo run dev --parallel --env-mode=loose --filter=@n8n/nodes-langchain --filter=n8n --filter=n8n-core",
     "clean": "turbo run clean --parallel",
     "reset": "node scripts/ensure-zx.mjs && zx scripts/reset.mjs",
diff --git a/packages/@n8n/chat/src/__tests__/setup.ts b/packages/@n8n/chat/src/__tests__/setup.ts
index 7b0828bfa8..33e89fb68b 100644
--- a/packages/@n8n/chat/src/__tests__/setup.ts
+++ b/packages/@n8n/chat/src/__tests__/setup.ts
@@ -1 +1,13 @@
 import '@testing-library/jest-dom';
+import '@testing-library/jest-dom';
+import { configure } from '@testing-library/vue';
+
+configure({ testIdAttribute: 'data-test-id' });
+
+window.ResizeObserver =
+	window.ResizeObserver ||
+	vi.fn().mockImplementation(() => ({
+		disconnect: vi.fn(),
+		observe: vi.fn(),
+		unobserve: vi.fn(),
+	}));
diff --git a/packages/@n8n/chat/src/components/ChatFile.vue b/packages/@n8n/chat/src/components/ChatFile.vue
index d3c3c2db7d..52b4acf789 100644
--- a/packages/@n8n/chat/src/components/ChatFile.vue
+++ b/packages/@n8n/chat/src/components/ChatFile.vue
@@ -30,22 +30,23 @@ const TypeIcon = computed(() => {
 });
 
 function onClick() {
-	if (props.isRemovable) {
-		emit('remove', props.file);
-	}
-
 	if (props.isPreviewable) {
 		window.open(URL.createObjectURL(props.file));
 	}
 }
+function onDelete() {
+	emit('remove', props.file);
+}
 </script>
 
 <template>
 	<div class="chat-file" @click="onClick">
 		<TypeIcon />
 		<p class="chat-file-name">{{ file.name }}</p>
-		<IconDelete v-if="isRemovable" class="chat-file-delete" />
-		<IconPreview v-if="isPreviewable" class="chat-file-preview" />
+		<span v-if="isRemovable" class="chat-file-delete" @click.stop="onDelete">
+			<IconDelete />
+		</span>
+		<IconPreview v-else-if="isPreviewable" class="chat-file-preview" />
 	</div>
 </template>
 
@@ -80,12 +81,25 @@ function onClick() {
 .chat-file-preview {
 	background: none;
 	border: none;
-	display: none;
+	display: block;
 	cursor: pointer;
 	flex-shrink: 0;
+}
 
-	.chat-file:hover & {
-		display: block;
+.chat-file-delete {
+	position: relative;
+	&:hover {
+		color: red;
+	}
+
+	/* Increase hit area for better clickability */
+	&:before {
+		content: '';
+		position: absolute;
+		top: -10px;
+		right: -10px;
+		bottom: -10px;
+		left: -10px;
 	}
 }
 </style>
diff --git a/packages/@n8n/chat/src/components/Input.vue b/packages/@n8n/chat/src/components/Input.vue
index 3e823917e0..4abfc76849 100644
--- a/packages/@n8n/chat/src/components/Input.vue
+++ b/packages/@n8n/chat/src/components/Input.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useFileDialog } from '@vueuse/core';
-import IconFilePlus from 'virtual:icons/mdi/filePlus';
+import IconPaperclip from 'virtual:icons/mdi/paperclip';
 import IconSend from 'virtual:icons/mdi/send';
 import { computed, onMounted, onUnmounted, ref, unref } from 'vue';
 
@@ -9,10 +9,20 @@ import { chatEventBus } from '@n8n/chat/event-buses';
 
 import ChatFile from './ChatFile.vue';
 
+export interface ChatInputProps {
+	placeholder?: string;
+}
+
+const props = withDefaults(defineProps<ChatInputProps>(), {
+	placeholder: 'inputPlaceholder',
+});
+
 export interface ArrowKeyDownPayload {
 	key: 'ArrowUp' | 'ArrowDown';
 	currentInputValue: string;
 }
+
+const { t } = useI18n();
 const emit = defineEmits<{
 	arrowKeyDown: [value: ArrowKeyDownPayload];
 }>();
@@ -20,12 +30,12 @@ const emit = defineEmits<{
 const { options } = useOptions();
 const chatStore = useChat();
 const { waitingForResponse } = chatStore;
-const { t } = useI18n();
 
 const files = ref<FileList | null>(null);
 const chatTextArea = ref<HTMLTextAreaElement | null>(null);
 const input = ref('');
 const isSubmitting = ref(false);
+const resizeObserver = ref<ResizeObserver | null>(null);
 
 const isSubmitDisabled = computed(() => {
 	return input.value === '' || waitingForResponse.value || options.disabled?.value === true;
@@ -74,12 +84,30 @@ onMounted(() => {
 	chatEventBus.on('focusInput', focusChatInput);
 	chatEventBus.on('blurInput', blurChatInput);
 	chatEventBus.on('setInputValue', setInputValue);
+
+	if (chatTextArea.value) {
+		resizeObserver.value = new ResizeObserver((entries) => {
+			for (const entry of entries) {
+				if (entry.target === chatTextArea.value) {
+					adjustHeight({ target: chatTextArea.value } as unknown as Event);
+				}
+			}
+		});
+
+		// Start observing the textarea
+		resizeObserver.value.observe(chatTextArea.value);
+	}
 });
 
 onUnmounted(() => {
 	chatEventBus.off('focusInput', focusChatInput);
 	chatEventBus.off('blurInput', blurChatInput);
 	chatEventBus.off('setInputValue', setInputValue);
+
+	if (resizeObserver.value) {
+		resizeObserver.value.disconnect();
+		resizeObserver.value = null;
+	}
 });
 
 function blurChatInput() {
@@ -121,6 +149,7 @@ async function onSubmitKeydown(event: KeyboardEvent) {
 	}
 
 	await onSubmit(event);
+	adjustHeight({ target: chatTextArea.value } as unknown as Event);
 }
 
 function onFileRemove(file: File) {
@@ -151,6 +180,15 @@ function onOpenFileDialog() {
 	if (isFileUploadDisabled.value) return;
 	openFileDialog({ accept: unref(allowedFileTypes) });
 }
+
+function adjustHeight(event: Event) {
+	const textarea = event.target as HTMLTextAreaElement;
+	// Set to content minimum to get the right scrollHeight
+	textarea.style.height = 'var(--chat--textarea--height)';
+	// Get the new height, with a small buffer for padding
+	const newHeight = Math.min(textarea.scrollHeight, 480); // 30rem
+	textarea.style.height = `${newHeight}px`;
+}
 </script>
 
 <template>
@@ -158,20 +196,25 @@ function onOpenFileDialog() {
 		<div class="chat-inputs">
 			<textarea
 				ref="chatTextArea"
+				data-test-id="chat-input"
 				v-model="input"
 				:disabled="isInputDisabled"
-				:placeholder="t('inputPlaceholder')"
+				:placeholder="t(props.placeholder)"
 				@keydown.enter="onSubmitKeydown"
+				@input="adjustHeight"
+				@mousedown="adjustHeight"
+				@focus="adjustHeight"
 			/>
 
 			<div class="chat-inputs-controls">
 				<button
 					v-if="isFileUploadAllowed"
 					:disabled="isFileUploadDisabled"
-					class="chat-input-send-button"
+					class="chat-input-file-button"
+					data-test-id="chat-attach-file-button"
 					@click="onOpenFileDialog"
 				>
-					<IconFilePlus height="24" width="24" />
+					<IconPaperclip height="24" width="24" />
 				</button>
 				<button :disabled="isSubmitDisabled" class="chat-input-send-button" @click="onSubmit">
 					<IconSend height="24" width="24" />
@@ -184,6 +227,7 @@ function onOpenFileDialog() {
 				:key="file.name"
 				:file="file"
 				:is-removable="true"
+				:is-previewable="true"
 				@remove="onFileRemove"
 			/>
 		</div>
@@ -217,13 +261,15 @@ function onOpenFileDialog() {
 		border-radius: var(--chat--input--border-radius, 0);
 		padding: 0.8rem;
 		padding-right: calc(0.8rem + (var(--controls-count, 1) * var(--chat--textarea--height)));
-		min-height: var(--chat--textarea--height);
-		max-height: var(--chat--textarea--max-height, var(--chat--textarea--height));
-		height: 100%;
+		min-height: var(--chat--textarea--height, 2.5rem); // Set a smaller initial height
+		max-height: var(--chat--textarea--max-height, 30rem);
+		height: var(--chat--textarea--height, 2.5rem); // Set initial height same as min-height
+		resize: none;
+		overflow-y: auto;
 		background: var(--chat--input--background, white);
-		resize: var(--chat--textarea--resize, none);
 		color: var(--chat--input--text-color, initial);
 		outline: none;
+		line-height: var(--chat--input--line-height, 1.5);
 
 		&:focus,
 		&:hover {
@@ -235,8 +281,10 @@ function onOpenFileDialog() {
 	display: flex;
 	position: absolute;
 	right: 0.5rem;
+	bottom: 0;
 }
-.chat-input-send-button {
+.chat-input-send-button,
+.chat-input-file-button {
 	height: var(--chat--textarea--height);
 	width: var(--chat--textarea--height);
 	background: var(--chat--input--send--button--background, white);
@@ -253,19 +301,33 @@ function onOpenFileDialog() {
 		min-width: fit-content;
 	}
 
-	&:hover,
-	&:focus {
-		background: var(
-			--chat--input--send--button--background-hover,
-			var(--chat--input--send--button--background)
-		);
-		color: var(--chat--input--send--button--color-hover, var(--chat--color-secondary-shade-50));
-	}
-
 	&[disabled] {
 		cursor: no-drop;
 		color: var(--chat--color-disabled);
 	}
+
+	.chat-input-send-button {
+		&:hover,
+		&:focus {
+			background: var(
+				--chat--input--send--button--background-hover,
+				var(--chat--input--send--button--background)
+			);
+			color: var(--chat--input--send--button--color-hover, var(--chat--color-secondary-shade-50));
+		}
+	}
+}
+.chat-input-file-button {
+	background: var(--chat--input--file--button--background, white);
+	color: var(--chat--input--file--button--color, var(--chat--color-secondary));
+
+	&:hover {
+		background: var(
+			--chat--input--file--button--background-hover,
+			var(--chat--input--file--button--background)
+		);
+		color: var(--chat--input--file--button--color-hover, var(--chat--color-secondary-shade-50));
+	}
 }
 
 .chat-files {
@@ -275,7 +337,7 @@ function onOpenFileDialog() {
 	width: 100%;
 	flex-direction: row;
 	flex-wrap: wrap;
-	gap: 0.25rem;
+	gap: 0.5rem;
 	padding: var(--chat--files-spacing, 0.25rem);
 }
 </style>
diff --git a/packages/@n8n/chat/src/components/Message.vue b/packages/@n8n/chat/src/components/Message.vue
index f584516332..123bcb6040 100644
--- a/packages/@n8n/chat/src/components/Message.vue
+++ b/packages/@n8n/chat/src/components/Message.vue
@@ -60,7 +60,7 @@ const linksNewTabPlugin = (vueMarkdownItInstance: MarkdownIt) => {
 const scrollToView = () => {
 	if (messageContainer.value?.scrollIntoView) {
 		messageContainer.value.scrollIntoView({
-			block: 'center',
+			block: 'start',
 		});
 	}
 };
@@ -132,14 +132,14 @@ onMounted(async () => {
 .chat-message {
 	display: block;
 	position: relative;
-	max-width: 80%;
+	max-width: fit-content;
 	font-size: var(--chat--message--font-size, 1rem);
 	padding: var(--chat--message--padding, var(--chat--spacing));
 	border-radius: var(--chat--message--border-radius, var(--chat--border-radius));
-
+	scroll-margin: 100px;
 	.chat-message-actions {
 		position: absolute;
-		bottom: 100%;
+		bottom: calc(100% - 0.5rem);
 		left: 0;
 		opacity: 0;
 		transform: translateY(-0.25rem);
@@ -151,6 +151,9 @@ onMounted(async () => {
 		left: auto;
 		right: 0;
 	}
+	&.chat-message-from-bot .chat-message-actions {
+		bottom: calc(100% - 1rem);
+	}
 
 	&:hover {
 		.chat-message-actions {
@@ -159,7 +162,7 @@ onMounted(async () => {
 	}
 
 	p {
-		line-height: var(--chat--message-line-height, 1.8);
+		line-height: var(--chat--message-line-height, 1.5);
 		word-wrap: break-word;
 	}
 
diff --git a/packages/@n8n/chat/src/components/MessageTyping.vue b/packages/@n8n/chat/src/components/MessageTyping.vue
index 328ba6566e..e8dd3cf508 100644
--- a/packages/@n8n/chat/src/components/MessageTyping.vue
+++ b/packages/@n8n/chat/src/components/MessageTyping.vue
@@ -34,7 +34,12 @@ onMounted(() => {
 });
 </script>
 <template>
-	<Message ref="messageContainer" :class="classes" :message="message">
+	<Message
+		ref="messageContainer"
+		:class="classes"
+		:message="message"
+		data-test-id="chat-message-typing"
+	>
 		<div class="chat-message-typing-body">
 			<span class="chat-message-typing-circle"></span>
 			<span class="chat-message-typing-circle"></span>
diff --git a/packages/@n8n/chat/src/css/markdown.scss b/packages/@n8n/chat/src/css/markdown.scss
index 070e6d6a5f..6bcf13ba74 100644
--- a/packages/@n8n/chat/src/css/markdown.scss
+++ b/packages/@n8n/chat/src/css/markdown.scss
@@ -37,7 +37,7 @@ body {
 		4. Prevent font size adjustment after orientation changes (IE, iOS)
 		5. Prevent overflow from long words (all)
 	*/
-	font-size: 125%; /* 2 */
+	font-size: 110%; /* 2 */
 	line-height: 1.6; /* 3 */
 	-webkit-text-size-adjust: 100%; /* 4 */
 	word-break: break-word; /* 5 */
@@ -596,7 +596,7 @@ body {
 
 	pre code {
 		display: block;
-		padding: 0.3em 0.7em;
+		padding: 0 0 0.5rem 0.5rem;
 		word-break: normal;
 		overflow-x: auto;
 	}
diff --git a/packages/editor-ui/src/App.vue b/packages/editor-ui/src/App.vue
index 47d2f1268b..c9d23632de 100644
--- a/packages/editor-ui/src/App.vue
+++ b/packages/editor-ui/src/App.vue
@@ -33,15 +33,11 @@ const loading = ref(true);
 const defaultLocale = computed(() => rootStore.defaultLocale);
 const isDemoMode = computed(() => route.name === VIEWS.DEMO);
 const showAssistantButton = computed(() => assistantStore.canShowAssistantButtonsOnCanvas);
-
+const hasContentFooter = ref(false);
 const appGrid = ref<Element | null>(null);
 
 const assistantSidebarWidth = computed(() => assistantStore.chatWidth);
 
-watch(defaultLocale, (newLocale) => {
-	void loadLanguage(newLocale);
-});
-
 onMounted(async () => {
 	setAppZIndexes();
 	logHiringBanner();
@@ -54,11 +50,6 @@ onBeforeUnmount(() => {
 	window.removeEventListener('resize', updateGridWidth);
 });
 
-// As assistant sidebar width changes, recalculate the total width regularly
-watch(assistantSidebarWidth, async () => {
-	await updateGridWidth();
-});
-
 const logHiringBanner = () => {
 	if (settingsStore.isHiringBannerEnabled && !isDemoMode.value) {
 		console.log(HIRING_BANNER);
@@ -71,6 +62,21 @@ const updateGridWidth = async () => {
 		uiStore.appGridWidth = appGrid.value.clientWidth;
 	}
 };
+
+// As assistant sidebar width changes, recalculate the total width regularly
+watch(assistantSidebarWidth, async () => {
+	await updateGridWidth();
+});
+
+watch(route, (r) => {
+	hasContentFooter.value = r.matched.some(
+		(matchedRoute) => matchedRoute.components?.footer !== undefined,
+	);
+});
+
+watch(defaultLocale, (newLocale) => {
+	void loadLanguage(newLocale);
+});
 </script>
 
 <template>
@@ -94,12 +100,17 @@ const updateGridWidth = async () => {
 				<router-view name="sidebar"></router-view>
 			</div>
 			<div id="content" :class="$style.content">
-				<router-view v-slot="{ Component }">
-					<keep-alive v-if="$route.meta.keepWorkflowAlive" include="NodeViewSwitcher" :max="1">
-						<component :is="Component" />
-					</keep-alive>
-					<component :is="Component" v-else />
-				</router-view>
+				<div :class="$style.contentWrapper">
+					<router-view v-slot="{ Component }">
+						<keep-alive v-if="$route.meta.keepWorkflowAlive" include="NodeViewSwitcher" :max="1">
+							<component :is="Component" />
+						</keep-alive>
+						<component :is="Component" v-else />
+					</router-view>
+				</div>
+				<div v-if="hasContentFooter" :class="$style.contentFooter">
+					<router-view name="footer" />
+				</div>
 			</div>
 			<div :id="APP_MODALS_ELEMENT_ID" :class="$style.modals">
 				<Modals />
@@ -138,8 +149,26 @@ const updateGridWidth = async () => {
 	grid-area: banners;
 	z-index: var(--z-index-top-banners);
 }
-
 .content {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	overflow: auto;
+	grid-area: content;
+}
+
+.contentFooter {
+	height: auto;
+	z-index: 10;
+	width: 100%;
+	display: none;
+
+	// Only show footer if there's content
+	&:has(*) {
+		display: block;
+	}
+}
+.contentWrapper {
 	display: flex;
 	grid-area: content;
 	position: relative;
diff --git a/packages/editor-ui/src/__tests__/mocks.ts b/packages/editor-ui/src/__tests__/mocks.ts
index 87b4a8bbf9..15688de9ff 100644
--- a/packages/editor-ui/src/__tests__/mocks.ts
+++ b/packages/editor-ui/src/__tests__/mocks.ts
@@ -54,6 +54,7 @@ export const mockNodeTypeDescription = ({
 	credentials = [],
 	inputs = [NodeConnectionType.Main],
 	outputs = [NodeConnectionType.Main],
+	codex = {},
 	properties = [],
 }: {
 	name?: INodeTypeDescription['name'];
@@ -61,6 +62,7 @@ export const mockNodeTypeDescription = ({
 	credentials?: INodeTypeDescription['credentials'];
 	inputs?: INodeTypeDescription['inputs'];
 	outputs?: INodeTypeDescription['outputs'];
+	codex?: INodeTypeDescription['codex'];
 	properties?: INodeTypeDescription['properties'];
 } = {}) =>
 	mock<INodeTypeDescription>({
@@ -77,6 +79,7 @@ export const mockNodeTypeDescription = ({
 		group: EXECUTABLE_TRIGGER_NODE_TYPES.includes(name) ? ['trigger'] : [],
 		inputs,
 		outputs,
+		codex,
 		credentials,
 		documentationUrl: 'https://docs',
 		webhooks: undefined,
diff --git a/packages/editor-ui/src/components/AskAssistant/AskAssistantFloatingButton.vue b/packages/editor-ui/src/components/AskAssistant/AskAssistantFloatingButton.vue
index 70f6ed84fd..6a9746c65e 100644
--- a/packages/editor-ui/src/components/AskAssistant/AskAssistantFloatingButton.vue
+++ b/packages/editor-ui/src/components/AskAssistant/AskAssistantFloatingButton.vue
@@ -2,6 +2,7 @@
 import { useI18n } from '@/composables/useI18n';
 import { useStyles } from '@/composables/useStyles';
 import { useAssistantStore } from '@/stores/assistant.store';
+import { useCanvasStore } from '@/stores/canvas.store';
 import AssistantAvatar from 'n8n-design-system/components/AskAssistantAvatar/AssistantAvatar.vue';
 import AskAssistantButton from 'n8n-design-system/components/AskAssistantButton/AskAssistantButton.vue';
 import { computed } from 'vue';
@@ -9,6 +10,7 @@ import { computed } from 'vue';
 const assistantStore = useAssistantStore();
 const i18n = useI18n();
 const { APP_Z_INDEXES } = useStyles();
+const canvasStore = useCanvasStore();
 
 const lastUnread = computed(() => {
 	const msg = assistantStore.lastUnread;
@@ -39,6 +41,7 @@ const onClick = () => {
 		v-if="assistantStore.canShowAssistantButtonsOnCanvas && !assistantStore.isAssistantOpen"
 		:class="$style.container"
 		data-test-id="ask-assistant-floating-button"
+		:style="{ '--canvas-panel-height-offset': `${canvasStore.panelHeight}px` }"
 	>
 		<n8n-tooltip
 			:z-index="APP_Z_INDEXES.ASK_ASSISTANT_FLOATING_BUTTON_TOOLTIP"
@@ -61,7 +64,7 @@ const onClick = () => {
 <style lang="scss" module>
 .container {
 	position: absolute;
-	bottom: var(--spacing-s);
+	bottom: calc(var(--canvas-panel-height-offset, 0px) + var(--spacing-s));
 	right: var(--spacing-s);
 	z-index: var(--z-index-ask-assistant-floating-button);
 }
diff --git a/packages/editor-ui/src/components/CanvasChat/CanvasChat.test.ts b/packages/editor-ui/src/components/CanvasChat/CanvasChat.test.ts
new file mode 100644
index 0000000000..9dd9fb3f66
--- /dev/null
+++ b/packages/editor-ui/src/components/CanvasChat/CanvasChat.test.ts
@@ -0,0 +1,586 @@
+import { setActivePinia } from 'pinia';
+import { createTestingPinia } from '@pinia/testing';
+import { waitFor } from '@testing-library/vue';
+import { userEvent } from '@testing-library/user-event';
+import { createRouter, createWebHistory } from 'vue-router';
+import { computed, ref } from 'vue';
+import { NodeConnectionType } from 'n8n-workflow';
+
+import CanvasChat from './CanvasChat.vue';
+import { createComponentRenderer } from '@/__tests__/render';
+import { createTestWorkflowObject } from '@/__tests__/mocks';
+import { mockedStore } from '@/__tests__/utils';
+import { STORES } from '@/constants';
+import { ChatOptionsSymbol, ChatSymbol } from '@n8n/chat/constants';
+import { chatEventBus } from '@n8n/chat/event-buses';
+
+import { useWorkflowsStore } from '@/stores/workflows.store';
+import { useUIStore } from '@/stores/ui.store';
+import { useCanvasStore } from '@/stores/canvas.store';
+import * as useChatMessaging from './composables/useChatMessaging';
+import * as useChatTrigger from './composables/useChatTrigger';
+import { useToast } from '@/composables/useToast';
+
+import type { IExecutionResponse, INodeUi } from '@/Interface';
+import type { ChatMessage } from '@n8n/chat/types';
+
+vi.mock('@/composables/useToast', () => {
+	const showMessage = vi.fn();
+	const showError = vi.fn();
+	return {
+		useToast: () => {
+			return {
+				showMessage,
+				showError,
+				clearAllStickyNotifications: vi.fn(),
+			};
+		},
+	};
+});
+// Test data
+const mockNodes: INodeUi[] = [
+	{
+		parameters: {
+			options: {
+				allowFileUploads: true,
+			},
+		},
+		id: 'chat-trigger-id',
+		name: 'When chat message received',
+		type: '@n8n/n8n-nodes-langchain.chatTrigger',
+		typeVersion: 1.1,
+		position: [740, 860],
+		webhookId: 'webhook-id',
+	},
+	{
+		parameters: {},
+		id: 'agent-id',
+		name: 'AI Agent',
+		type: '@n8n/n8n-nodes-langchain.agent',
+		typeVersion: 1.7,
+		position: [960, 860],
+	},
+];
+
+const mockConnections = {
+	'When chat message received': {
+		main: [
+			[
+				{
+					node: 'AI Agent',
+					type: NodeConnectionType.Main,
+					index: 0,
+				},
+			],
+		],
+	},
+};
+
+const mockWorkflowExecution = {
+	data: {
+		resultData: {
+			runData: {
+				'AI Agent': [
+					{
+						data: {
+							main: [[{ json: { output: 'AI response message' } }]],
+						},
+					},
+				],
+			},
+			lastNodeExecuted: 'AI Agent',
+		},
+	},
+};
+
+const router = createRouter({
+	history: createWebHistory(),
+	routes: [],
+});
+
+describe('CanvasChat', () => {
+	const renderComponent = createComponentRenderer(CanvasChat, {
+		global: {
+			provide: {
+				[ChatSymbol as symbol]: {},
+				[ChatOptionsSymbol as symbol]: {},
+			},
+			plugins: [router],
+		},
+	});
+
+	let workflowsStore: ReturnType<typeof mockedStore<typeof useWorkflowsStore>>;
+	let uiStore: ReturnType<typeof mockedStore<typeof useUIStore>>;
+	let canvasStore: ReturnType<typeof mockedStore<typeof useCanvasStore>>;
+
+	beforeEach(() => {
+		const pinia = createTestingPinia({
+			initialState: {
+				[STORES.WORKFLOWS]: {
+					workflow: {
+						nodes: mockNodes,
+						connections: mockConnections,
+					},
+				},
+				[STORES.UI]: {
+					chatPanelOpen: true,
+				},
+			},
+		});
+
+		setActivePinia(pinia);
+
+		workflowsStore = mockedStore(useWorkflowsStore);
+		uiStore = mockedStore(useUIStore);
+		canvasStore = mockedStore(useCanvasStore);
+
+		// Setup default mocks
+		workflowsStore.getCurrentWorkflow.mockReturnValue(
+			createTestWorkflowObject({
+				nodes: mockNodes,
+				connections: mockConnections,
+			}),
+		);
+		workflowsStore.getNodeByName.mockImplementation(
+			(name) => mockNodes.find((node) => node.name === name) ?? null,
+		);
+		workflowsStore.isChatPanelOpen = true;
+		workflowsStore.getWorkflowExecution = mockWorkflowExecution as unknown as IExecutionResponse;
+		workflowsStore.getPastChatMessages = ['Previous message 1', 'Previous message 2'];
+	});
+
+	afterEach(() => {
+		vi.clearAllMocks();
+	});
+
+	describe('rendering', () => {
+		it('should render chat when panel is open', () => {
+			const { getByTestId } = renderComponent();
+			expect(getByTestId('canvas-chat')).toBeInTheDocument();
+		});
+
+		it('should not render chat when panel is closed', async () => {
+			workflowsStore.isChatPanelOpen = false;
+			const { queryByTestId } = renderComponent();
+			await waitFor(() => {
+				expect(queryByTestId('canvas-chat')).not.toBeInTheDocument();
+			});
+		});
+
+		it('should show correct input placeholder', async () => {
+			const { findByTestId } = renderComponent();
+			expect(await findByTestId('chat-input')).toBeInTheDocument();
+		});
+	});
+
+	describe('message handling', () => {
+		beforeEach(() => {
+			vi.spyOn(chatEventBus, 'emit');
+			workflowsStore.runWorkflow.mockResolvedValue({ executionId: 'test-execution-id' });
+		});
+
+		it('should send message and show response', async () => {
+			const { findByTestId, findByText } = renderComponent();
+
+			// Send message
+			const input = await findByTestId('chat-input');
+			await userEvent.type(input, 'Hello AI!');
+			await userEvent.keyboard('{Enter}');
+
+			// Verify message and response
+			expect(await findByText('Hello AI!')).toBeInTheDocument();
+			await waitFor(async () => {
+				expect(await findByText('AI response message')).toBeInTheDocument();
+			});
+
+			// Verify workflow execution
+			expect(workflowsStore.runWorkflow).toHaveBeenCalledWith(
+				expect.objectContaining({
+					runData: {
+						'When chat message received': [
+							{
+								data: {
+									main: [
+										[
+											{
+												json: {
+													action: 'sendMessage',
+													chatInput: 'Hello AI!',
+													sessionId: expect.any(String),
+												},
+											},
+										],
+									],
+								},
+								executionStatus: 'success',
+								executionTime: 0,
+								source: [null],
+								startTime: expect.any(Number),
+							},
+						],
+					},
+				}),
+			);
+		});
+
+		it('should show loading state during message processing', async () => {
+			const { findByTestId, queryByTestId } = renderComponent();
+
+			// Send message
+			const input = await findByTestId('chat-input');
+			await userEvent.type(input, 'Test message');
+			await userEvent.keyboard('{Enter}');
+
+			// Verify loading states
+			uiStore.isActionActive = { workflowRunning: true };
+			await waitFor(() => expect(queryByTestId('chat-message-typing')).toBeInTheDocument());
+
+			uiStore.isActionActive = { workflowRunning: false };
+			await waitFor(() => expect(queryByTestId('chat-message-typing')).not.toBeInTheDocument());
+		});
+
+		it('should handle workflow execution errors', async () => {
+			workflowsStore.runWorkflow.mockRejectedValueOnce(new Error());
+
+			const { findByTestId } = renderComponent();
+
+			const input = await findByTestId('chat-input');
+			await userEvent.type(input, 'Hello AI!');
+			await userEvent.keyboard('{Enter}');
+
+			const toast = useToast();
+			expect(toast.showError).toHaveBeenCalledWith(new Error(), 'Problem running workflow');
+		});
+	});
+
+	describe('session management', () => {
+		const mockMessages: ChatMessage[] = [
+			{
+				id: '1',
+				text: 'Existing message',
+				sender: 'user',
+				createdAt: new Date().toISOString(),
+			},
+		];
+
+		beforeEach(() => {
+			vi.spyOn(useChatMessaging, 'useChatMessaging').mockReturnValue({
+				getChatMessages: vi.fn().mockReturnValue(mockMessages),
+				sendMessage: vi.fn(),
+				extractResponseMessage: vi.fn(),
+				previousMessageIndex: ref(0),
+				waitForExecution: vi.fn(),
+			});
+		});
+
+		it('should allow copying session ID', async () => {
+			const clipboardSpy = vi.fn();
+			document.execCommand = clipboardSpy;
+			const { getByTestId } = renderComponent();
+
+			await userEvent.click(getByTestId('chat-session-id'));
+			const toast = useToast();
+			expect(clipboardSpy).toHaveBeenCalledWith('copy');
+			expect(toast.showMessage).toHaveBeenCalledWith({
+				message: '',
+				title: 'Copied to clipboard',
+				type: 'success',
+			});
+		});
+
+		it('should refresh session with confirmation when messages exist', async () => {
+			const { getByTestId, getByRole } = renderComponent();
+
+			const originalSessionId = getByTestId('chat-session-id').textContent;
+			await userEvent.click(getByTestId('refresh-session-button'));
+
+			const confirmButton = getByRole('dialog').querySelector('button.btn--confirm');
+
+			if (!confirmButton) throw new Error('Confirm button not found');
+			await userEvent.click(confirmButton);
+
+			expect(getByTestId('chat-session-id').textContent).not.toEqual(originalSessionId);
+		});
+	});
+
+	describe('resize functionality', () => {
+		it('should handle panel resizing', async () => {
+			const { container } = renderComponent();
+
+			const resizeWrapper = container.querySelector('.resizeWrapper');
+			if (!resizeWrapper) throw new Error('Resize wrapper not found');
+
+			await userEvent.pointer([
+				{ target: resizeWrapper, coords: { clientX: 0, clientY: 0 } },
+				{ coords: { clientX: 0, clientY: 100 } },
+			]);
+
+			expect(canvasStore.setPanelHeight).toHaveBeenCalled();
+		});
+
+		it('should persist resize dimensions', () => {
+			const mockStorage = {
+				getItem: vi.fn(),
+				setItem: vi.fn(),
+			};
+			Object.defineProperty(window, 'localStorage', { value: mockStorage });
+
+			renderComponent();
+
+			expect(mockStorage.getItem).toHaveBeenCalledWith('N8N_CANVAS_CHAT_HEIGHT');
+			expect(mockStorage.getItem).toHaveBeenCalledWith('N8N_CANVAS_CHAT_WIDTH');
+		});
+	});
+
+	describe('file handling', () => {
+		beforeEach(() => {
+			vi.spyOn(useChatMessaging, 'useChatMessaging').mockReturnValue({
+				getChatMessages: vi.fn().mockReturnValue([]),
+				sendMessage: vi.fn(),
+				extractResponseMessage: vi.fn(),
+				previousMessageIndex: ref(0),
+				waitForExecution: vi.fn(),
+			});
+
+			workflowsStore.isChatPanelOpen = true;
+			workflowsStore.allowFileUploads = true;
+		});
+
+		it('should enable file uploads when allowed by chat trigger node', async () => {
+			const allowFileUploads = ref(true);
+			const original = useChatTrigger.useChatTrigger;
+			vi.spyOn(useChatTrigger, 'useChatTrigger').mockImplementation((...args) => ({
+				...original(...args),
+				allowFileUploads: computed(() => allowFileUploads.value),
+			}));
+			const { getByTestId } = renderComponent();
+
+			const chatPanel = getByTestId('canvas-chat');
+			expect(chatPanel).toBeInTheDocument();
+
+			const fileInput = getByTestId('chat-attach-file-button');
+			expect(fileInput).toBeInTheDocument();
+
+			allowFileUploads.value = false;
+			await waitFor(() => {
+				expect(fileInput).not.toBeInTheDocument();
+			});
+		});
+	});
+
+	describe('message history handling', () => {
+		it('should properly navigate through message history with wrap-around', async () => {
+			const messages = ['Message 1', 'Message 2', 'Message 3'];
+			workflowsStore.getPastChatMessages = messages;
+
+			const { findByTestId } = renderComponent();
+			const input = await findByTestId('chat-input');
+
+			// First up should show most recent message
+			await userEvent.keyboard('{ArrowUp}');
+			expect(input).toHaveValue('Message 3');
+
+			// Second up should show second most recent
+			await userEvent.keyboard('{ArrowUp}');
+			expect(input).toHaveValue('Message 2');
+
+			// Third up should show oldest message
+			await userEvent.keyboard('{ArrowUp}');
+			expect(input).toHaveValue('Message 1');
+
+			// Fourth up should wrap around to most recent
+			await userEvent.keyboard('{ArrowUp}');
+			expect(input).toHaveValue('Message 3');
+
+			// Down arrow should go in reverse
+			await userEvent.keyboard('{ArrowDown}');
+			expect(input).toHaveValue('Message 1');
+		});
+
+		it('should reset message history navigation on new input', async () => {
+			workflowsStore.getPastChatMessages = ['Message 1', 'Message 2'];
+			const { findByTestId } = renderComponent();
+			const input = await findByTestId('chat-input');
+
+			// Navigate to oldest message
+			await userEvent.keyboard('{ArrowUp}'); // Most recent
+			await userEvent.keyboard('{ArrowUp}'); // Oldest
+			expect(input).toHaveValue('Message 1');
+
+			await userEvent.type(input, 'New message');
+			await userEvent.keyboard('{Enter}');
+
+			await userEvent.keyboard('{ArrowUp}');
+			expect(input).toHaveValue('Message 2');
+		});
+	});
+
+	describe('message reuse and repost', () => {
+		const sendMessageSpy = vi.fn();
+		beforeEach(() => {
+			const mockMessages: ChatMessage[] = [
+				{
+					id: '1',
+					text: 'Original message',
+					sender: 'user',
+					createdAt: new Date().toISOString(),
+				},
+				{
+					id: '2',
+					text: 'AI response',
+					sender: 'bot',
+					createdAt: new Date().toISOString(),
+				},
+			];
+			vi.spyOn(useChatMessaging, 'useChatMessaging').mockReturnValue({
+				getChatMessages: vi.fn().mockReturnValue(mockMessages),
+				sendMessage: sendMessageSpy,
+				extractResponseMessage: vi.fn(),
+				previousMessageIndex: ref(0),
+				waitForExecution: vi.fn(),
+			});
+			workflowsStore.messages = mockMessages;
+		});
+
+		it('should repost user message with new execution', async () => {
+			const { findByTestId } = renderComponent();
+			const repostButton = await findByTestId('repost-message-button');
+
+			await userEvent.click(repostButton);
+
+			expect(sendMessageSpy).toHaveBeenCalledWith('Original message');
+			//   expect.objectContaining({
+			//     runData: expect.objectContaining({
+			//       'When chat message received': expect.arrayContaining([
+			//         expect.objectContaining({
+			//           data: expect.objectContaining({
+			//             main: expect.arrayContaining([
+			//               expect.arrayContaining([
+			//                 expect.objectContaining({
+			//                   json: expect.objectContaining({
+			//                     chatInput: 'Original message',
+			//                   }),
+			//                 }),
+			//               ]),
+			//             ]),
+			//           }),
+			//         }),
+			//       ]),
+			//     }),
+			//   }),
+			// );
+		});
+
+		it('should show message options only for appropriate messages', async () => {
+			const { findByText, container } = renderComponent();
+
+			await findByText('Original message');
+			const userMessage = container.querySelector('.chat-message-from-user');
+			expect(
+				userMessage?.querySelector('[data-test-id="repost-message-button"]'),
+			).toBeInTheDocument();
+			expect(
+				userMessage?.querySelector('[data-test-id="reuse-message-button"]'),
+			).toBeInTheDocument();
+
+			await findByText('AI response');
+			const botMessage = container.querySelector('.chat-message-from-bot');
+			expect(
+				botMessage?.querySelector('[data-test-id="repost-message-button"]'),
+			).not.toBeInTheDocument();
+			expect(
+				botMessage?.querySelector('[data-test-id="reuse-message-button"]'),
+			).not.toBeInTheDocument();
+		});
+	});
+
+	describe('execution handling', () => {
+		it('should update UI when execution is completed', async () => {
+			const { findByTestId, queryByTestId } = renderComponent();
+
+			// Start execution
+			const input = await findByTestId('chat-input');
+			await userEvent.type(input, 'Test message');
+			await userEvent.keyboard('{Enter}');
+
+			// Simulate execution completion
+			uiStore.isActionActive = { workflowRunning: true };
+			await waitFor(() => {
+				expect(queryByTestId('chat-message-typing')).toBeInTheDocument();
+			});
+
+			uiStore.isActionActive = { workflowRunning: false };
+			workflowsStore.setWorkflowExecutionData(
+				mockWorkflowExecution as unknown as IExecutionResponse,
+			);
+
+			await waitFor(() => {
+				expect(queryByTestId('chat-message-typing')).not.toBeInTheDocument();
+			});
+		});
+	});
+
+	describe('panel state synchronization', () => {
+		it('should update canvas height when chat or logs panel state changes', async () => {
+			renderComponent();
+
+			// Toggle logs panel
+			workflowsStore.isLogsPanelOpen = true;
+			await waitFor(() => {
+				expect(canvasStore.setPanelHeight).toHaveBeenCalled();
+			});
+
+			// Close chat panel
+			workflowsStore.isChatPanelOpen = false;
+			await waitFor(() => {
+				expect(canvasStore.setPanelHeight).toHaveBeenCalledWith(0);
+			});
+		});
+
+		it('should preserve panel state across component remounts', async () => {
+			const { unmount, rerender } = renderComponent();
+
+			// Set initial state
+			workflowsStore.isChatPanelOpen = true;
+			workflowsStore.isLogsPanelOpen = true;
+
+			// Unmount and remount
+			unmount();
+			await rerender({});
+
+			expect(workflowsStore.isChatPanelOpen).toBe(true);
+			expect(workflowsStore.isLogsPanelOpen).toBe(true);
+		});
+	});
+
+	describe('keyboard shortcuts', () => {
+		it('should handle Enter key with modifier to start new line', async () => {
+			const { findByTestId } = renderComponent();
+
+			const input = await findByTestId('chat-input');
+			await userEvent.type(input, 'Line 1');
+			await userEvent.keyboard('{Shift>}{Enter}{/Shift}');
+			await userEvent.type(input, 'Line 2');
+
+			expect(input).toHaveValue('Line 1\nLine 2');
+		});
+	});
+
+	describe('chat synchronization', () => {
+		it('should load initial chat history when first opening panel', async () => {
+			const getChatMessagesSpy = vi.fn().mockReturnValue(['Previous message']);
+			vi.spyOn(useChatMessaging, 'useChatMessaging').mockReturnValue({
+				...vi.fn()(),
+				getChatMessages: getChatMessagesSpy,
+			});
+
+			workflowsStore.isChatPanelOpen = false;
+			const { rerender } = renderComponent();
+
+			workflowsStore.isChatPanelOpen = true;
+			await rerender({});
+
+			expect(getChatMessagesSpy).toHaveBeenCalled();
+		});
+	});
+});
diff --git a/packages/editor-ui/src/components/CanvasChat/CanvasChat.vue b/packages/editor-ui/src/components/CanvasChat/CanvasChat.vue
new file mode 100644
index 0000000000..4d551a67be
--- /dev/null
+++ b/packages/editor-ui/src/components/CanvasChat/CanvasChat.vue
@@ -0,0 +1,350 @@
+<script setup lang="ts">
+import type { Ref } from 'vue';
+import { provide, watch, computed, ref, watchEffect } from 'vue';
+import { ChatOptionsSymbol, ChatSymbol } from '@n8n/chat/constants';
+import type { Router } from 'vue-router';
+import { useRouter } from 'vue-router';
+import { chatEventBus } from '@n8n/chat/event-buses';
+import { VIEWS } from '@/constants';
+import { v4 as uuid } from 'uuid';
+
+// Components
+import ChatMessagesPanel from './components/ChatMessagesPanel.vue';
+import ChatLogsPanel from './components/ChatLogsPanel.vue';
+
+// Composables
+import { useChatTrigger } from './composables/useChatTrigger';
+import { useChatMessaging } from './composables/useChatMessaging';
+import { useResize } from './composables/useResize';
+import { useI18n } from '@/composables/useI18n';
+import { useNodeHelpers } from '@/composables/useNodeHelpers';
+import { useRunWorkflow } from '@/composables/useRunWorkflow';
+
+// Types
+import type { Chat, ChatMessage, ChatOptions } from '@n8n/chat/types';
+import type { RunWorkflowChatPayload } from './composables/useChatMessaging';
+import { useNodeTypesStore } from '@/stores/nodeTypes.store';
+import { useCanvasStore } from '@/stores/canvas.store';
+import { useUIStore } from '@/stores/ui.store';
+import { useWorkflowsStore } from '@/stores/workflows.store';
+
+const workflowsStore = useWorkflowsStore();
+const uiStore = useUIStore();
+const canvasStore = useCanvasStore();
+const nodeTypesStore = useNodeTypesStore();
+const nodeHelpers = useNodeHelpers();
+const router = useRouter();
+
+// Component state
+const messages = ref<ChatMessage[]>([]);
+const currentSessionId = ref<string>(uuid().replace(/-/g, ''));
+const isDisabled = ref(false);
+const container = ref<HTMLElement>();
+
+// Computed properties
+const workflow = computed(() => workflowsStore.getCurrentWorkflow());
+const isLoading = computed(() => {
+	const result = uiStore.isActionActive.workflowRunning;
+	return result;
+});
+const allConnections = computed(() => workflowsStore.allConnections);
+const isChatOpen = computed(() => {
+	const result = workflowsStore.isChatPanelOpen;
+	return result;
+});
+const isLogsOpen = computed(() => workflowsStore.isLogsPanelOpen);
+const previousChatMessages = computed(() => workflowsStore.getPastChatMessages);
+
+// Expose internal state for testing
+defineExpose({
+	messages,
+	currentSessionId,
+	isDisabled,
+	workflow,
+	isLoading,
+});
+
+const { runWorkflow } = useRunWorkflow({ router });
+
+// Initialize features with injected dependencies
+const { chatTriggerNode, connectedNode, allowFileUploads, setChatTriggerNode, setConnectedNode } =
+	useChatTrigger({
+		workflow,
+		canvasNodes: workflowsStore.allNodes,
+		getNodeByName: workflowsStore.getNodeByName,
+		getNodeType: nodeTypesStore.getNodeType,
+	});
+
+const { sendMessage, getChatMessages } = useChatMessaging({
+	chatTrigger: chatTriggerNode,
+	connectedNode,
+	messages,
+	sessionId: currentSessionId,
+	workflow,
+	isLoading,
+	executionResultData: computed(() => workflowsStore.getWorkflowExecution?.data?.resultData),
+	getWorkflowResultDataByNodeName: workflowsStore.getWorkflowResultDataByNodeName,
+	onRunChatWorkflow,
+});
+
+const {
+	height,
+	chatWidth,
+	rootStyles,
+	logsWidth,
+	onResizeDebounced,
+	onResizeChatDebounced,
+	onWindowResize,
+} = useResize(container);
+
+// Extracted pure functions for better testability
+function createChatConfig(params: {
+	messages: Chat['messages'];
+	sendMessage: Chat['sendMessage'];
+	currentSessionId: Chat['currentSessionId'];
+	isLoading: Ref<boolean>;
+	isDisabled: Ref<boolean>;
+	allowFileUploads: Ref<boolean>;
+	locale: ReturnType<typeof useI18n>;
+}): { chatConfig: Chat; chatOptions: ChatOptions } {
+	const chatConfig: Chat = {
+		messages: params.messages,
+		sendMessage: params.sendMessage,
+		initialMessages: ref([]),
+		currentSessionId: params.currentSessionId,
+		waitingForResponse: params.isLoading,
+	};
+
+	const chatOptions: ChatOptions = {
+		i18n: {
+			en: {
+				title: '',
+				footer: '',
+				subtitle: '',
+				inputPlaceholder: params.locale.baseText('chat.window.chat.placeholder'),
+				getStarted: '',
+				closeButtonTooltip: '',
+			},
+		},
+		webhookUrl: '',
+		mode: 'window',
+		showWindowCloseButton: true,
+		disabled: params.isDisabled,
+		allowFileUploads: params.allowFileUploads,
+		allowedFilesMimeTypes: '',
+	};
+
+	return { chatConfig, chatOptions };
+}
+
+function displayExecution(params: { router: Router; workflowId: string; executionId: string }) {
+	const route = params.router.resolve({
+		name: VIEWS.EXECUTION_PREVIEW,
+		params: { name: params.workflowId, executionId: params.executionId },
+	});
+	window.open(route.href, '_blank');
+}
+
+function refreshSession(params: { messages: Ref<ChatMessage[]>; currentSessionId: Ref<string> }) {
+	workflowsStore.setWorkflowExecutionData(null);
+	nodeHelpers.updateNodesExecutionIssues();
+	params.messages.value = [];
+	params.currentSessionId.value = uuid().replace(/-/g, '');
+}
+
+// Event handlers
+const handleDisplayExecution = (executionId: string) => {
+	displayExecution({
+		router,
+		workflowId: workflow.value.id,
+		executionId,
+	});
+};
+
+const handleRefreshSession = () => {
+	refreshSession({
+		messages,
+		currentSessionId,
+	});
+};
+
+const closePanel = () => {
+	workflowsStore.setPanelOpen('chat', false);
+};
+
+async function onRunChatWorkflow(payload: RunWorkflowChatPayload) {
+	const response = await runWorkflow({
+		triggerNode: payload.triggerNode,
+		nodeData: payload.nodeData,
+		source: payload.source,
+	});
+
+	workflowsStore.appendChatMessage(payload.message);
+	return response;
+}
+
+// Initialize chat config
+const { chatConfig, chatOptions } = createChatConfig({
+	messages,
+	sendMessage,
+	currentSessionId,
+	isLoading,
+	isDisabled,
+	allowFileUploads,
+	locale: useI18n(),
+});
+
+// Provide chat context
+provide(ChatSymbol, chatConfig);
+provide(ChatOptionsSymbol, chatOptions);
+
+// Watchers
+watch(
+	() => isChatOpen.value,
+	(isOpen) => {
+		if (isOpen) {
+			setChatTriggerNode();
+			setConnectedNode();
+
+			if (messages.value.length === 0) {
+				messages.value = getChatMessages();
+			}
+
+			setTimeout(() => {
+				onWindowResize();
+				chatEventBus.emit('focusInput');
+			}, 0);
+		}
+	},
+	{ immediate: true },
+);
+
+watch(
+	() => allConnections.value,
+	() => {
+		if (canvasStore.isLoading) return;
+		setTimeout(() => {
+			if (!chatTriggerNode.value) {
+				setChatTriggerNode();
+			}
+			setConnectedNode();
+		}, 0);
+	},
+	{ deep: true },
+);
+
+watchEffect(() => {
+	canvasStore.setPanelHeight(isChatOpen.value || isLogsOpen.value ? height.value : 0);
+});
+</script>
+
+<template>
+	<n8n-resize-wrapper
+		v-if="chatTriggerNode"
+		:is-resizing-enabled="isChatOpen || isLogsOpen"
+		:supported-directions="['top']"
+		:class="[$style.resizeWrapper, !isChatOpen && !isLogsOpen && $style.empty]"
+		:height="height"
+		:style="rootStyles"
+		@resize="onResizeDebounced"
+	>
+		<div ref="container" :class="$style.container">
+			<div v-if="isChatOpen || isLogsOpen" :class="$style.chatResizer">
+				<n8n-resize-wrapper
+					v-if="isChatOpen"
+					:supported-directions="['right']"
+					:width="chatWidth"
+					:class="$style.chat"
+					@resize="onResizeChatDebounced"
+				>
+					<div :class="$style.inner">
+						<ChatMessagesPanel
+							data-test-id="canvas-chat"
+							:messages="messages"
+							:session-id="currentSessionId"
+							:past-chat-messages="previousChatMessages"
+							@refresh-session="handleRefreshSession"
+							@display-execution="handleDisplayExecution"
+							@send-message="sendMessage"
+						/>
+					</div>
+				</n8n-resize-wrapper>
+				<div v-if="isLogsOpen && connectedNode" :class="$style.logs">
+					<ChatLogsPanel
+						:key="messages.length"
+						:workflow="workflow"
+						data-test-id="canvas-chat-logs"
+						:node="connectedNode"
+						:slim="logsWidth < 700"
+						@close="closePanel"
+					/>
+				</div>
+			</div>
+		</div>
+	</n8n-resize-wrapper>
+</template>
+
+<style lang="scss" module>
+.resizeWrapper {
+	height: var(--panel-height);
+	min-height: 4rem;
+	max-height: 90vh;
+	flex-basis: content;
+	border-top: 1px solid var(--color-foreground-base);
+
+	&.empty {
+		height: auto;
+		min-height: 0;
+		flex-basis: 0;
+	}
+}
+
+.container {
+	width: 100%;
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+	overflow: hidden;
+}
+
+.chatResizer {
+	display: flex;
+	width: 100%;
+	height: 100%;
+	max-width: 100%;
+}
+
+.footer {
+	border-top: 1px solid var(--color-foreground-base);
+	width: 100%;
+	background-color: var(--color-background-light);
+	display: flex;
+	padding: var(--spacing-2xs);
+	gap: var(--spacing-2xs);
+}
+
+.chat {
+	width: var(--chat-width);
+	flex-shrink: 0;
+	border-right: 1px solid var(--color-foreground-base);
+	max-width: 100%;
+
+	&:only-child {
+		width: 100%;
+	}
+}
+
+.inner {
+	display: flex;
+	flex-direction: column;
+	overflow: hidden;
+	height: 100%;
+	width: 100%;
+}
+
+.logs {
+	flex-grow: 1;
+	flex-shrink: 1;
+	background-color: var(--color-background-light);
+}
+</style>
diff --git a/packages/editor-ui/src/components/CanvasChat/components/ChatLogsPanel.vue b/packages/editor-ui/src/components/CanvasChat/components/ChatLogsPanel.vue
new file mode 100644
index 0000000000..856f06711a
--- /dev/null
+++ b/packages/editor-ui/src/components/CanvasChat/components/ChatLogsPanel.vue
@@ -0,0 +1,91 @@
+<script setup lang="ts">
+import type { INode, Workflow } from 'n8n-workflow';
+import RunDataAi from '@/components/RunDataAi/RunDataAi.vue';
+import { useI18n } from '@/composables/useI18n';
+
+const emit = defineEmits<{
+	close: [];
+}>();
+
+defineProps<{
+	node: INode | null;
+	slim?: boolean;
+	workflow: Workflow;
+}>();
+
+const locale = useI18n();
+</script>
+
+<template>
+	<div :class="$style.logsWrapper" data-test-id="lm-chat-logs">
+		<header :class="$style.logsHeader">
+			<div class="meta">
+				{{ locale.baseText('chat.window.logs') }}
+				<span v-if="node">
+					{{
+						locale.baseText('chat.window.logsFromNode', { interpolate: { nodeName: node.name } })
+					}}
+				</span>
+			</div>
+			<n8n-icon-button
+				:class="$style.close"
+				outline
+				icon="times"
+				type="secondary"
+				size="mini"
+				@click="emit('close')"
+			/>
+		</header>
+		<div :class="$style.logs">
+			<RunDataAi
+				v-if="node"
+				:class="$style.runData"
+				:node="node"
+				:workflow="workflow"
+				:slim="slim"
+			/>
+		</div>
+	</div>
+</template>
+
+<style lang="scss" module>
+.logsHeader {
+	font-size: var(--font-size-s);
+	font-weight: var(--font-weight-bold);
+	height: 2.6875rem;
+	line-height: 18px;
+	text-align: left;
+	border-bottom: 1px solid var(--color-foreground-base);
+	padding: var(--spacing-xs);
+	background-color: var(--color-foreground-xlight);
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+
+	.close {
+		border: none;
+	}
+
+	span {
+		font-weight: 100;
+	}
+}
+.logsWrapper {
+	--node-icon-color: var(--color-text-base);
+
+	height: 100%;
+	overflow: hidden;
+	width: 100%;
+	display: flex;
+	flex-direction: column;
+}
+
+.logsTitle {
+	margin: 0 var(--spacing-s) var(--spacing-s);
+}
+.logs {
+	padding: var(--spacing-s) 0;
+	flex-grow: 1;
+	overflow: auto;
+}
+</style>
diff --git a/packages/editor-ui/src/components/CanvasChat/components/ChatMessagesPanel.vue b/packages/editor-ui/src/components/CanvasChat/components/ChatMessagesPanel.vue
new file mode 100644
index 0000000000..9e5fb15567
--- /dev/null
+++ b/packages/editor-ui/src/components/CanvasChat/components/ChatMessagesPanel.vue
@@ -0,0 +1,348 @@
+<script setup lang="ts">
+import type { ChatMessage, ChatMessageText } from '@n8n/chat/types';
+import { useI18n } from '@/composables/useI18n';
+import MessagesList from '@n8n/chat/components/MessagesList.vue';
+import MessageOptionTooltip from './MessageOptionTooltip.vue';
+import MessageOptionAction from './MessageOptionAction.vue';
+import { chatEventBus } from '@n8n/chat/event-buses';
+import type { ArrowKeyDownPayload } from '@n8n/chat/components/Input.vue';
+import ChatInput from '@n8n/chat/components/Input.vue';
+import { useMessage } from '@/composables/useMessage';
+import { MODAL_CONFIRM } from '@/constants';
+import { computed, ref } from 'vue';
+import { useClipboard } from '@/composables/useClipboard';
+import { useToast } from '@/composables/useToast';
+
+interface Props {
+	pastChatMessages: string[];
+	messages: ChatMessage[];
+	sessionId: string;
+}
+
+const props = defineProps<Props>();
+
+const emit = defineEmits<{
+	displayExecution: [id: string];
+	sendMessage: [message: string];
+	refreshSession: [];
+}>();
+
+const messageComposable = useMessage();
+const clipboard = useClipboard();
+const locale = useI18n();
+const toast = useToast();
+
+const previousMessageIndex = ref(0);
+
+const inputPlaceholder = computed(() => {
+	if (props.messages.length > 0) {
+		return locale.baseText('chat.window.chat.placeholder');
+	}
+	return locale.baseText('chat.window.chat.placeholderPristine');
+});
+/** Checks if message is a text message */
+function isTextMessage(message: ChatMessage): message is ChatMessageText {
+	return message.type === 'text' || !message.type;
+}
+
+/** Reposts the message */
+function repostMessage(message: ChatMessageText) {
+	void sendMessage(message.text);
+}
+
+/** Sets the message in input for reuse */
+function reuseMessage(message: ChatMessageText) {
+	chatEventBus.emit('setInputValue', message.text);
+}
+
+function sendMessage(message: string) {
+	previousMessageIndex.value = 0;
+	emit('sendMessage', message);
+}
+
+async function onRefreshSession() {
+	// If there are no messages, refresh the session without asking
+	if (props.messages.length === 0) {
+		emit('refreshSession');
+		return;
+	}
+
+	const confirmResult = await messageComposable.confirm(
+		locale.baseText('chat.window.session.reset.warning'),
+		{
+			title: locale.baseText('chat.window.session.reset.title'),
+			type: 'warning',
+			confirmButtonText: locale.baseText('chat.window.session.reset.confirm'),
+			showClose: true,
+		},
+	);
+	if (confirmResult === MODAL_CONFIRM) {
+		emit('refreshSession');
+	}
+}
+
+function onArrowKeyDown({ currentInputValue, key }: ArrowKeyDownPayload) {
+	const pastMessages = props.pastChatMessages;
+	const isCurrentInputEmptyOrMatch =
+		currentInputValue.length === 0 || pastMessages.includes(currentInputValue);
+
+	if (isCurrentInputEmptyOrMatch && (key === 'ArrowUp' || key === 'ArrowDown')) {
+		// Exit if no messages
+		if (pastMessages.length === 0) return;
+
+		// Temporarily blur to avoid cursor position issues
+		chatEventBus.emit('blurInput');
+
+		if (pastMessages.length === 1) {
+			previousMessageIndex.value = 0;
+		} else {
+			if (key === 'ArrowUp') {
+				if (currentInputValue.length === 0 && previousMessageIndex.value === 0) {
+					// Start with most recent message
+					previousMessageIndex.value = pastMessages.length - 1;
+				} else {
+					// Move backwards through history
+					previousMessageIndex.value =
+						previousMessageIndex.value === 0
+							? pastMessages.length - 1
+							: previousMessageIndex.value - 1;
+				}
+			} else if (key === 'ArrowDown') {
+				// Move forwards through history
+				previousMessageIndex.value =
+					previousMessageIndex.value === pastMessages.length - 1
+						? 0
+						: previousMessageIndex.value + 1;
+			}
+		}
+
+		// Get message at current index
+		const selectedMessage = pastMessages[previousMessageIndex.value];
+		chatEventBus.emit('setInputValue', selectedMessage);
+
+		// Refocus and move cursor to end
+		chatEventBus.emit('focusInput');
+	}
+
+	// Reset history navigation when typing new content that doesn't match history
+	if (!isCurrentInputEmptyOrMatch) {
+		previousMessageIndex.value = 0;
+	}
+}
+function copySessionId() {
+	void clipboard.copy(props.sessionId);
+	toast.showMessage({
+		title: locale.baseText('generic.copiedToClipboard'),
+		message: '',
+		type: 'success',
+	});
+}
+</script>
+
+<template>
+	<div :class="$style.chat" data-test-id="workflow-lm-chat-dialog">
+		<header :class="$style.chatHeader">
+			<span>{{ locale.baseText('chat.window.title') }}</span>
+			<div :class="$style.session">
+				<span>{{ locale.baseText('chat.window.session.title') }}</span>
+				<n8n-tooltip placement="left">
+					<template #content>
+						{{ sessionId }}
+					</template>
+					<span :class="$style.sessionId" data-test-id="chat-session-id" @click="copySessionId">{{
+						sessionId
+					}}</span>
+				</n8n-tooltip>
+				<n8n-icon-button
+					:class="$style.refreshSession"
+					data-test-id="refresh-session-button"
+					type="tertiary"
+					text
+					size="mini"
+					icon="undo"
+					:title="locale.baseText('chat.window.session.reset.confirm')"
+					@click="onRefreshSession"
+				/>
+			</div>
+		</header>
+		<main :class="$style.chatBody">
+			<MessagesList :messages="messages" :class="[$style.messages, 'ignore-key-press-canvas']">
+				<template #beforeMessage="{ message }">
+					<MessageOptionTooltip
+						v-if="message.sender === 'bot' && !message.id.includes('preload')"
+						placement="right"
+						data-test-id="execution-id-tooltip"
+					>
+						{{ locale.baseText('chat.window.chat.chatMessageOptions.executionId') }}:
+						<a href="#" @click="emit('displayExecution', message.id)">{{ message.id }}</a>
+					</MessageOptionTooltip>
+
+					<MessageOptionAction
+						v-if="isTextMessage(message) && message.sender === 'user'"
+						data-test-id="repost-message-button"
+						icon="redo"
+						:label="locale.baseText('chat.window.chat.chatMessageOptions.repostMessage')"
+						placement="left"
+						@click.once="repostMessage(message)"
+					/>
+
+					<MessageOptionAction
+						v-if="isTextMessage(message) && message.sender === 'user'"
+						data-test-id="reuse-message-button"
+						icon="copy"
+						:label="locale.baseText('chat.window.chat.chatMessageOptions.reuseMessage')"
+						placement="left"
+						@click="reuseMessage(message)"
+					/>
+				</template>
+			</MessagesList>
+		</main>
+
+		<div :class="$style.messagesInput">
+			<div v-if="pastChatMessages.length > 0" :class="$style.messagesHistory">
+				<n8n-button
+					title="Navigate to previous message"
+					icon="chevron-up"
+					type="tertiary"
+					text
+					size="mini"
+					@click="onArrowKeyDown({ currentInputValue: '', key: 'ArrowUp' })"
+				/>
+				<n8n-button
+					title="Navigate to next message"
+					icon="chevron-down"
+					type="tertiary"
+					text
+					size="mini"
+					@click="onArrowKeyDown({ currentInputValue: '', key: 'ArrowDown' })"
+				/>
+			</div>
+			<ChatInput
+				data-test-id="lm-chat-inputs"
+				:placeholder="inputPlaceholder"
+				@arrow-key-down="onArrowKeyDown"
+			/>
+		</div>
+	</div>
+</template>
+
+<style lang="scss" module>
+.chat {
+	--chat--spacing: var(--spacing-xs);
+	--chat--message--padding: var(--spacing-xs);
+	--chat--message--font-size: var(--font-size-s);
+	--chat--input--font-size: var(--font-size-s);
+	--chat--message--bot--background: transparent;
+	--chat--message--user--background: var(--color-text-lighter);
+	--chat--message--bot--color: var(--color-text-dark);
+	--chat--message--user--color: var(--color-text-dark);
+	--chat--message--bot--border: none;
+	--chat--message--user--border: none;
+	--chat--color-typing: var(--color-text-light);
+	--chat--textarea--max-height: calc(var(--panel-height) * 0.5);
+	--chat--message--pre--background: var(--color-foreground-light);
+
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+	overflow: hidden;
+	background-color: var(--color-background-light);
+}
+.chatHeader {
+	font-size: var(--font-size-s);
+	font-weight: 400;
+	line-height: 18px;
+	text-align: left;
+	border-bottom: 1px solid var(--color-foreground-base);
+	padding: var(--chat--spacing);
+	background-color: var(--color-foreground-xlight);
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+}
+.session {
+	display: flex;
+	align-items: center;
+	gap: var(--spacing-2xs);
+	color: var(--color-text-base);
+	max-width: 70%;
+}
+.sessionId {
+	display: inline-block;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+	overflow: hidden;
+
+	cursor: pointer;
+}
+.refreshSession {
+	max-height: 1.1rem;
+}
+.chatBody {
+	display: flex;
+	height: 100%;
+	overflow: auto;
+}
+
+.messages {
+	border-radius: var(--border-radius-base);
+	height: 100%;
+	width: 100%;
+	overflow: auto;
+	padding-top: 1.5em;
+
+	&:not(:last-child) {
+		margin-right: 1em;
+	}
+}
+
+.messagesInput {
+	--input-border-color: var(--border-color-base);
+	--chat--input--border: none;
+
+	--chat--input--border-radius: 0.5rem;
+	--chat--input--send--button--background: transparent;
+	--chat--input--send--button--color: var(--color-primary);
+	--chat--input--file--button--background: transparent;
+	--chat--input--file--button--color: var(--color-primary);
+	--chat--input--border-active: var(--input-focus-border-color, var(--color-secondary));
+	--chat--files-spacing: var(--spacing-2xs) 0;
+	--chat--input--background: transparent;
+	--chat--input--file--button--color: var(--color-button-secondary-font);
+	--chat--input--file--button--color-hover: var(--color-primary);
+
+	[data-theme='dark'] & {
+		--chat--input--text-color: var(--input-font-color, var(--color-text-dark));
+	}
+	@media (prefers-color-scheme: dark) {
+		--chat--input--text-color: var(--input-font-color, var(--color-text-dark));
+	}
+
+	padding: 0 0 0 var(--spacing-xs);
+	margin: 0 var(--chat--spacing) var(--chat--spacing);
+	flex-grow: 1;
+	display: flex;
+	background: var(--color-lm-chat-bot-background);
+	border-radius: var(--chat--input--border-radius);
+	transition: border-color 200ms ease-in-out;
+	border: var(--input-border-color, var(--border-color-base))
+		var(--input-border-style, var(--border-style-base))
+		var(--input-border-width, var(--border-width-base));
+
+	&:focus-within {
+		--input-border-color: #4538a3;
+	}
+}
+
+.messagesHistory {
+	display: flex;
+	flex-direction: column;
+	justify-content: flex-end;
+	margin-bottom: var(--spacing-3xs);
+
+	button:first-child {
+		margin-top: var(--spacing-4xs);
+		margin-bottom: calc(-1 * var(--spacing-4xs));
+	}
+}
+</style>
diff --git a/packages/editor-ui/src/components/CanvasChat/components/MessageOptionAction.vue b/packages/editor-ui/src/components/CanvasChat/components/MessageOptionAction.vue
new file mode 100644
index 0000000000..bc5a649a5f
--- /dev/null
+++ b/packages/editor-ui/src/components/CanvasChat/components/MessageOptionAction.vue
@@ -0,0 +1,46 @@
+<script setup lang="ts">
+import type { PropType } from 'vue';
+
+defineProps({
+	label: {
+		type: String,
+		required: true,
+	},
+	icon: {
+		type: String,
+		required: true,
+	},
+	placement: {
+		type: String as PropType<'left' | 'right' | 'top' | 'bottom'>,
+		default: 'top',
+	},
+});
+</script>
+
+<template>
+	<div :class="$style.container">
+		<n8n-tooltip :placement="placement">
+			<template #content>
+				{{ label }}
+			</template>
+			<n8n-icon :class="$style.icon" :icon="icon" size="xsmall" @click="$attrs.onClick" />
+		</n8n-tooltip>
+	</div>
+</template>
+
+<style lang="scss" module>
+.container {
+	display: inline-flex;
+	align-items: center;
+	margin: 0 var(--spacing-4xs);
+}
+
+.icon {
+	color: var(--color-foreground-dark);
+	cursor: pointer;
+
+	&:hover {
+		color: var(--color-primary);
+	}
+}
+</style>
diff --git a/packages/editor-ui/src/components/CanvasChat/components/MessageOptionTooltip.vue b/packages/editor-ui/src/components/CanvasChat/components/MessageOptionTooltip.vue
new file mode 100644
index 0000000000..5a346fd929
--- /dev/null
+++ b/packages/editor-ui/src/components/CanvasChat/components/MessageOptionTooltip.vue
@@ -0,0 +1,40 @@
+<script setup lang="ts">
+import type { PropType } from 'vue';
+
+defineProps({
+	placement: {
+		type: String as PropType<'left' | 'right' | 'top' | 'bottom'>,
+		default: 'top',
+	},
+});
+</script>
+
+<template>
+	<div :class="$style.container">
+		<n8n-tooltip :placement="placement">
+			<template #content>
+				<slot />
+			</template>
+			<span :class="$style.icon">
+				<n8n-icon icon="info" size="xsmall" />
+			</span>
+		</n8n-tooltip>
+	</div>
+</template>
+
+<style lang="scss" module>
+.container {
+	display: inline-flex;
+	align-items: center;
+	margin: 0 var(--spacing-4xs);
+}
+
+.icon {
+	color: var(--color-foreground-dark);
+	cursor: help;
+
+	&:hover {
+		color: var(--color-primary);
+	}
+}
+</style>
diff --git a/packages/editor-ui/src/components/CanvasChat/composables/useChatMessaging.ts b/packages/editor-ui/src/components/CanvasChat/composables/useChatMessaging.ts
new file mode 100644
index 0000000000..2ceec6b54d
--- /dev/null
+++ b/packages/editor-ui/src/components/CanvasChat/composables/useChatMessaging.ts
@@ -0,0 +1,299 @@
+import type { ComputedRef, Ref } from 'vue';
+import { ref } from 'vue';
+import { v4 as uuid } from 'uuid';
+import type { ChatMessage, ChatMessageText } from '@n8n/chat/types';
+import { NodeConnectionType, CHAT_TRIGGER_NODE_TYPE } from 'n8n-workflow';
+import type {
+	ITaskData,
+	INodeExecutionData,
+	IBinaryKeyData,
+	IDataObject,
+	IBinaryData,
+	BinaryFileType,
+	Workflow,
+	IRunExecutionData,
+} from 'n8n-workflow';
+import { useToast } from '@/composables/useToast';
+import { useMessage } from '@/composables/useMessage';
+import { usePinnedData } from '@/composables/usePinnedData';
+import { get, isEmpty, last } from 'lodash-es';
+import { MANUAL_CHAT_TRIGGER_NODE_TYPE, MODAL_CONFIRM } from '@/constants';
+import { useI18n } from '@/composables/useI18n';
+import type { MemoryOutput } from '../types/chat';
+import type { IExecutionPushResponse, INodeUi } from '@/Interface';
+
+export type RunWorkflowChatPayload = {
+	triggerNode: string;
+	nodeData: ITaskData;
+	source: string;
+	message: string;
+};
+export interface ChatMessagingDependencies {
+	chatTrigger: Ref<INodeUi | null>;
+	connectedNode: Ref<INodeUi | null>;
+	messages: Ref<ChatMessage[]>;
+	sessionId: Ref<string>;
+	workflow: ComputedRef<Workflow>;
+	isLoading: ComputedRef<boolean>;
+	executionResultData: ComputedRef<IRunExecutionData['resultData'] | undefined>;
+	getWorkflowResultDataByNodeName: (nodeName: string) => ITaskData[] | null;
+	onRunChatWorkflow: (
+		payload: RunWorkflowChatPayload,
+	) => Promise<IExecutionPushResponse | undefined>;
+}
+
+export function useChatMessaging({
+	chatTrigger,
+	connectedNode,
+	messages,
+	sessionId,
+	workflow,
+	isLoading,
+	executionResultData,
+	getWorkflowResultDataByNodeName,
+	onRunChatWorkflow,
+}: ChatMessagingDependencies) {
+	const locale = useI18n();
+	const { showError } = useToast();
+	const previousMessageIndex = ref(0);
+
+	/** Converts a file to binary data */
+	async function convertFileToBinaryData(file: File): Promise<IBinaryData> {
+		const reader = new FileReader();
+		return await new Promise((resolve, reject) => {
+			reader.onload = () => {
+				const binaryData: IBinaryData = {
+					data: (reader.result as string).split('base64,')?.[1] ?? '',
+					mimeType: file.type,
+					fileName: file.name,
+					fileSize: `${file.size} bytes`,
+					fileExtension: file.name.split('.').pop() ?? '',
+					fileType: file.type.split('/')[0] as BinaryFileType,
+				};
+				resolve(binaryData);
+			};
+			reader.onerror = () => {
+				reject(new Error('Failed to convert file to binary data'));
+			};
+			reader.readAsDataURL(file);
+		});
+	}
+
+	/** Gets keyed files for the workflow input */
+	async function getKeyedFiles(files: File[]): Promise<IBinaryKeyData> {
+		const binaryData: IBinaryKeyData = {};
+
+		await Promise.all(
+			files.map(async (file, index) => {
+				const data = await convertFileToBinaryData(file);
+				const key = `data${index}`;
+
+				binaryData[key] = data;
+			}),
+		);
+
+		return binaryData;
+	}
+
+	/** Extracts file metadata */
+	function extractFileMeta(file: File): IDataObject {
+		return {
+			fileName: file.name,
+			fileSize: `${file.size} bytes`,
+			fileExtension: file.name.split('.').pop() ?? '',
+			fileType: file.type.split('/')[0],
+			mimeType: file.type,
+		};
+	}
+
+	/** Starts workflow execution with the message */
+	async function startWorkflowWithMessage(message: string, files?: File[]): Promise<void> {
+		const triggerNode = chatTrigger.value;
+
+		if (!triggerNode) {
+			showError(new Error('Chat Trigger Node could not be found!'), 'Trigger Node not found');
+			return;
+		}
+
+		let inputKey = 'chatInput';
+		if (triggerNode.type === MANUAL_CHAT_TRIGGER_NODE_TYPE && triggerNode.typeVersion < 1.1) {
+			inputKey = 'input';
+		}
+		if (triggerNode.type === CHAT_TRIGGER_NODE_TYPE) {
+			inputKey = 'chatInput';
+		}
+
+		const inputPayload: INodeExecutionData = {
+			json: {
+				sessionId: sessionId.value,
+				action: 'sendMessage',
+				[inputKey]: message,
+			},
+		};
+
+		if (files && files.length > 0) {
+			const filesMeta = files.map((file) => extractFileMeta(file));
+			const binaryData = await getKeyedFiles(files);
+
+			inputPayload.json.files = filesMeta;
+			inputPayload.binary = binaryData;
+		}
+		const nodeData: ITaskData = {
+			startTime: new Date().getTime(),
+			executionTime: 0,
+			executionStatus: 'success',
+			data: {
+				main: [[inputPayload]],
+			},
+			source: [null],
+		};
+
+		const response = await onRunChatWorkflow({
+			triggerNode: triggerNode.name,
+			nodeData,
+			source: 'RunData.ManualChatMessage',
+			message,
+		});
+
+		if (!response?.executionId) {
+			showError(
+				new Error('It was not possible to start workflow!'),
+				'Workflow could not be started',
+			);
+			return;
+		}
+
+		waitForExecution(response.executionId);
+	}
+
+	/** Waits for workflow execution to complete */
+	function waitForExecution(executionId: string) {
+		const waitInterval = setInterval(() => {
+			if (!isLoading.value) {
+				clearInterval(waitInterval);
+
+				const lastNodeExecuted = executionResultData.value?.lastNodeExecuted;
+
+				if (!lastNodeExecuted) return;
+
+				const nodeResponseDataArray =
+					get(executionResultData.value.runData, lastNodeExecuted) ?? [];
+
+				const nodeResponseData = nodeResponseDataArray[nodeResponseDataArray.length - 1];
+
+				let responseMessage: string;
+
+				if (get(nodeResponseData, 'error')) {
+					responseMessage = '[ERROR: ' + get(nodeResponseData, 'error.message') + ']';
+				} else {
+					const responseData = get(nodeResponseData, 'data.main[0][0].json');
+					responseMessage = extractResponseMessage(responseData);
+				}
+
+				messages.value.push({
+					text: responseMessage,
+					sender: 'bot',
+					createdAt: new Date().toISOString(),
+					id: executionId ?? uuid(),
+				});
+			}
+		}, 500);
+	}
+
+	/** Extracts response message from workflow output */
+	function extractResponseMessage(responseData?: IDataObject) {
+		if (!responseData || isEmpty(responseData)) {
+			return locale.baseText('chat.window.chat.response.empty');
+		}
+
+		// Paths where the response message might be located
+		const paths = ['output', 'text', 'response.text'];
+		const matchedPath = paths.find((path) => get(responseData, path));
+
+		if (!matchedPath) return JSON.stringify(responseData, null, 2);
+
+		const matchedOutput = get(responseData, matchedPath);
+		if (typeof matchedOutput === 'object') {
+			return '```json\n' + JSON.stringify(matchedOutput, null, 2) + '\n```';
+		}
+
+		return matchedOutput?.toString() ?? '';
+	}
+
+	/** Sends a message to the chat */
+	async function sendMessage(message: string, files?: File[]) {
+		previousMessageIndex.value = 0;
+		if (message.trim() === '' && (!files || files.length === 0)) {
+			showError(
+				new Error(locale.baseText('chat.window.chat.provideMessage')),
+				locale.baseText('chat.window.chat.emptyChatMessage'),
+			);
+			return;
+		}
+
+		const pinnedChatData = usePinnedData(chatTrigger.value);
+		if (pinnedChatData.hasData.value) {
+			const confirmResult = await useMessage().confirm(
+				locale.baseText('chat.window.chat.unpinAndExecute.description'),
+				locale.baseText('chat.window.chat.unpinAndExecute.title'),
+				{
+					confirmButtonText: locale.baseText('chat.window.chat.unpinAndExecute.confirm'),
+					cancelButtonText: locale.baseText('chat.window.chat.unpinAndExecute.cancel'),
+				},
+			);
+
+			if (!(confirmResult === MODAL_CONFIRM)) return;
+
+			pinnedChatData.unsetData('unpin-and-send-chat-message-modal');
+		}
+
+		const newMessage: ChatMessage & { sessionId: string } = {
+			text: message,
+			sender: 'user',
+			createdAt: new Date().toISOString(),
+			sessionId: sessionId.value,
+			id: uuid(),
+			files,
+		};
+		messages.value.push(newMessage);
+
+		await startWorkflowWithMessage(newMessage.text, files);
+	}
+
+	function getChatMessages(): ChatMessageText[] {
+		if (!connectedNode.value) return [];
+
+		const connectedMemoryInputs =
+			workflow.value.connectionsByDestinationNode?.[connectedNode.value.name]?.[
+				NodeConnectionType.AiMemory
+			];
+		if (!connectedMemoryInputs) return [];
+
+		const memoryConnection = (connectedMemoryInputs ?? []).find((i) => i.length > 0)?.[0];
+
+		if (!memoryConnection) return [];
+
+		const nodeResultData = getWorkflowResultDataByNodeName(memoryConnection.node);
+
+		const memoryOutputData = (nodeResultData ?? [])
+			.map((data) => get(data, ['data', NodeConnectionType.AiMemory, 0, 0, 'json']) as MemoryOutput)
+			.find((data) => data && data.action === 'saveContext');
+
+		return (memoryOutputData?.chatHistory ?? []).map((message, index) => {
+			return {
+				createdAt: new Date().toISOString(),
+				text: message.kwargs.content,
+				id: `preload__${index}`,
+				sender: last(message.id) === 'HumanMessage' ? 'user' : 'bot',
+			};
+		});
+	}
+
+	return {
+		previousMessageIndex,
+		sendMessage,
+		extractResponseMessage,
+		waitForExecution,
+		getChatMessages,
+	};
+}
diff --git a/packages/editor-ui/src/components/CanvasChat/composables/useChatTrigger.ts b/packages/editor-ui/src/components/CanvasChat/composables/useChatTrigger.ts
new file mode 100644
index 0000000000..9ec2e346a6
--- /dev/null
+++ b/packages/editor-ui/src/components/CanvasChat/composables/useChatTrigger.ts
@@ -0,0 +1,138 @@
+import type { ComputedRef } from 'vue';
+import { ref, computed } from 'vue';
+import {
+	CHAIN_SUMMARIZATION_LANGCHAIN_NODE_TYPE,
+	NodeConnectionType,
+	NodeHelpers,
+} from 'n8n-workflow';
+import type { INodeTypeDescription, Workflow, INode, INodeParameters } from 'n8n-workflow';
+import {
+	AI_CATEGORY_AGENTS,
+	AI_CATEGORY_CHAINS,
+	AI_CODE_NODE_TYPE,
+	AI_SUBCATEGORY,
+	CHAT_TRIGGER_NODE_TYPE,
+	MANUAL_CHAT_TRIGGER_NODE_TYPE,
+} from '@/constants';
+import type { INodeUi } from '@/Interface';
+
+export interface ChatTriggerDependencies {
+	getNodeByName: (name: string) => INodeUi | null;
+	getNodeType: (type: string, version: number) => INodeTypeDescription | null;
+	canvasNodes: INodeUi[];
+	workflow: ComputedRef<Workflow>;
+}
+
+export function useChatTrigger({
+	getNodeByName,
+	getNodeType,
+	canvasNodes,
+	workflow,
+}: ChatTriggerDependencies) {
+	const chatTriggerName = ref<string | null>(null);
+	const connectedNode = ref<INode | null>(null);
+
+	const chatTriggerNode = computed(() =>
+		chatTriggerName.value ? getNodeByName(chatTriggerName.value) : null,
+	);
+
+	const allowFileUploads = computed(() => {
+		return (
+			(chatTriggerNode.value?.parameters?.options as INodeParameters)?.allowFileUploads === true
+		);
+	});
+
+	const allowedFilesMimeTypes = computed(() => {
+		return (
+			(
+				chatTriggerNode.value?.parameters?.options as INodeParameters
+			)?.allowedFilesMimeTypes?.toString() ?? ''
+		);
+	});
+
+	/** Gets the chat trigger node from the workflow */
+	function setChatTriggerNode() {
+		const triggerNode = canvasNodes.find((node) =>
+			[CHAT_TRIGGER_NODE_TYPE, MANUAL_CHAT_TRIGGER_NODE_TYPE].includes(node.type),
+		);
+
+		if (!triggerNode) {
+			return;
+		}
+		chatTriggerName.value = triggerNode.name;
+	}
+
+	/** Sets the connected node after finding the trigger */
+	function setConnectedNode() {
+		const triggerNode = chatTriggerNode.value;
+
+		if (!triggerNode) {
+			return;
+		}
+
+		const chatChildren = workflow.value.getChildNodes(triggerNode.name);
+
+		const chatRootNode = chatChildren
+			.reverse()
+			.map((nodeName: string) => getNodeByName(nodeName))
+			.filter((n): n is INodeUi => n !== null)
+			// Reverse the nodes to match the last node logs first
+			.reverse()
+			.find((storeNode: INodeUi): boolean => {
+				// Skip summarization nodes
+				if (storeNode.type === CHAIN_SUMMARIZATION_LANGCHAIN_NODE_TYPE) return false;
+				const nodeType = getNodeType(storeNode.type, storeNode.typeVersion);
+
+				if (!nodeType) return false;
+
+				// Check if node is an AI agent or chain based on its metadata
+				const isAgent =
+					nodeType.codex?.subcategories?.[AI_SUBCATEGORY]?.includes(AI_CATEGORY_AGENTS);
+				const isChain =
+					nodeType.codex?.subcategories?.[AI_SUBCATEGORY]?.includes(AI_CATEGORY_CHAINS);
+
+				// Handle custom AI Langchain Code nodes that could act as chains or agents
+				let isCustomChainOrAgent = false;
+				if (nodeType.name === AI_CODE_NODE_TYPE) {
+					// Get node connection types for inputs and outputs
+					const inputs = NodeHelpers.getNodeInputs(workflow.value, storeNode, nodeType);
+					const inputTypes = NodeHelpers.getConnectionTypes(inputs);
+
+					const outputs = NodeHelpers.getNodeOutputs(workflow.value, storeNode, nodeType);
+					const outputTypes = NodeHelpers.getConnectionTypes(outputs);
+
+					// Validate if node has required AI connection types
+					if (
+						inputTypes.includes(NodeConnectionType.AiLanguageModel) &&
+						inputTypes.includes(NodeConnectionType.Main) &&
+						outputTypes.includes(NodeConnectionType.Main)
+					) {
+						isCustomChainOrAgent = true;
+					}
+				}
+
+				// Skip if node is not an AI component
+				if (!isAgent && !isChain && !isCustomChainOrAgent) return false;
+
+				// Check if this node is connected to the trigger node
+				const parentNodes = workflow.value.getParentNodes(storeNode.name);
+				const isChatChild = parentNodes.some(
+					(parentNodeName) => parentNodeName === triggerNode.name,
+				);
+
+				// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+				const result = Boolean(isChatChild && (isAgent || isChain || isCustomChainOrAgent));
+				return result;
+			});
+		connectedNode.value = chatRootNode ?? null;
+	}
+
+	return {
+		allowFileUploads,
+		allowedFilesMimeTypes,
+		chatTriggerNode,
+		connectedNode: computed(() => connectedNode.value),
+		setChatTriggerNode,
+		setConnectedNode,
+	};
+}
diff --git a/packages/editor-ui/src/components/CanvasChat/composables/useResize.ts b/packages/editor-ui/src/components/CanvasChat/composables/useResize.ts
new file mode 100644
index 0000000000..cdbfcb82c2
--- /dev/null
+++ b/packages/editor-ui/src/components/CanvasChat/composables/useResize.ts
@@ -0,0 +1,137 @@
+import type { Ref } from 'vue';
+import { ref, computed, onMounted, onBeforeUnmount, watchEffect } from 'vue';
+import type { ResizeData } from 'n8n-design-system/components/N8nResizeWrapper/ResizeWrapper.vue';
+import { useDebounce } from '@/composables/useDebounce';
+import type { IChatResizeStyles } from '../types/chat';
+import { useStorage } from '@/composables/useStorage';
+
+const LOCAL_STORAGE_PANEL_HEIGHT = 'N8N_CANVAS_CHAT_HEIGHT';
+const LOCAL_STORAGE_PANEL_WIDTH = 'N8N_CANVAS_CHAT_WIDTH';
+
+// Percentage of container width for chat panel constraints
+const MAX_WIDTH_PERCENTAGE = 0.8;
+const MIN_WIDTH_PERCENTAGE = 0.3;
+
+// Percentage of window height for panel constraints
+const MIN_HEIGHT_PERCENTAGE = 0.3;
+const MAX_HEIGHT_PERCENTAGE = 0.75;
+
+export function useResize(container: Ref<HTMLElement | undefined>) {
+	const storage = {
+		height: useStorage(LOCAL_STORAGE_PANEL_HEIGHT),
+		width: useStorage(LOCAL_STORAGE_PANEL_WIDTH),
+	};
+
+	const dimensions = {
+		container: ref(0), // Container width
+		minHeight: ref(0),
+		maxHeight: ref(0),
+		chat: ref(0), // Chat panel width
+		logs: ref(0),
+		height: ref(0),
+	};
+
+	/** Computed styles for root element based on current dimensions */
+	const rootStyles = computed<IChatResizeStyles>(() => ({
+		'--panel-height': `${dimensions.height.value}px`,
+		'--chat-width': `${dimensions.chat.value}px`,
+	}));
+
+	const panelToContainerRatio = computed(() => {
+		const chatRatio = dimensions.chat.value / dimensions.container.value;
+		const containerRatio = dimensions.container.value / window.screen.width;
+		return {
+			chat: chatRatio.toFixed(2),
+			logs: (1 - chatRatio).toFixed(2),
+			container: containerRatio.toFixed(2),
+		};
+	});
+
+	/**
+	 * Constrains height to min/max bounds and updates panel height
+	 */
+	function onResize(newHeight: number) {
+		const { minHeight, maxHeight } = dimensions;
+		dimensions.height.value = Math.min(Math.max(newHeight, minHeight.value), maxHeight.value);
+	}
+
+	function onResizeDebounced(data: ResizeData) {
+		void useDebounce().callDebounced(onResize, { debounceTime: 10, trailing: true }, data.height);
+	}
+
+	/**
+	 * Constrains chat width to min/max percentage of container width
+	 */
+	function onResizeChat(width: number) {
+		const containerWidth = dimensions.container.value;
+		const maxWidth = containerWidth * MAX_WIDTH_PERCENTAGE;
+		const minWidth = containerWidth * MIN_WIDTH_PERCENTAGE;
+
+		dimensions.chat.value = Math.min(Math.max(width, minWidth), maxWidth);
+		dimensions.logs.value = dimensions.container.value - dimensions.chat.value;
+	}
+
+	function onResizeChatDebounced(data: ResizeData) {
+		void useDebounce().callDebounced(
+			onResizeChat,
+			{ debounceTime: 10, trailing: true },
+			data.width,
+		);
+	}
+	/**
+	 * Initializes dimensions from localStorage if available
+	 */
+	function restorePersistedDimensions() {
+		const persistedHeight = parseInt(storage.height.value ?? '0', 10);
+		const persistedWidth = parseInt(storage.width.value ?? '0', 10);
+
+		if (persistedHeight) onResize(persistedHeight);
+		if (persistedWidth) onResizeChat(persistedWidth);
+	}
+
+	/**
+	 * Updates container width and height constraints on window resize
+	 */
+	function onWindowResize() {
+		if (!container.value) return;
+
+		// Update container width and adjust chat panel if needed
+		dimensions.container.value = container.value.getBoundingClientRect().width;
+		onResizeChat(dimensions.chat.value);
+
+		// Update height constraints and adjust panel height if needed
+		dimensions.minHeight.value = window.innerHeight * MIN_HEIGHT_PERCENTAGE;
+		dimensions.maxHeight.value = window.innerHeight * MAX_HEIGHT_PERCENTAGE;
+		onResize(dimensions.height.value);
+	}
+
+	// Persist dimensions to localStorage when they change
+	watchEffect(() => {
+		const { chat, height } = dimensions;
+		if (chat.value > 0) storage.width.value = chat.value.toString();
+		if (height.value > 0) storage.height.value = height.value.toString();
+	});
+
+	// Initialize dimensions when container is available
+	watchEffect(() => {
+		if (container.value) {
+			onWindowResize();
+			restorePersistedDimensions();
+		}
+	});
+
+	// Window resize handling
+	onMounted(() => window.addEventListener('resize', onWindowResize));
+	onBeforeUnmount(() => window.removeEventListener('resize', onWindowResize));
+
+	return {
+		height: dimensions.height,
+		chatWidth: dimensions.chat,
+		logsWidth: dimensions.logs,
+		rootStyles,
+		onWindowResize,
+		onResizeDebounced,
+		onResizeChatDebounced,
+		panelToContainerRatio,
+	};
+}
diff --git a/packages/editor-ui/src/components/CanvasChat/types/chat.ts b/packages/editor-ui/src/components/CanvasChat/types/chat.ts
new file mode 100644
index 0000000000..6eb6e2c2ad
--- /dev/null
+++ b/packages/editor-ui/src/components/CanvasChat/types/chat.ts
@@ -0,0 +1,22 @@
+export interface LangChainMessage {
+	id: string[];
+	kwargs: {
+		content: string;
+	};
+}
+
+export interface MemoryOutput {
+	action: string;
+	chatHistory?: LangChainMessage[];
+}
+
+export interface IChatMessageResponse {
+	executionId?: string;
+	success: boolean;
+	error?: Error;
+}
+
+export interface IChatResizeStyles {
+	'--panel-height': string;
+	'--chat-width': string;
+}
diff --git a/packages/editor-ui/src/components/Modals.vue b/packages/editor-ui/src/components/Modals.vue
index 5ec528b629..fc7b2d67f1 100644
--- a/packages/editor-ui/src/components/Modals.vue
+++ b/packages/editor-ui/src/components/Modals.vue
@@ -18,7 +18,6 @@ import {
 	NEW_ASSISTANT_SESSION_MODAL,
 	VERSIONS_MODAL_KEY,
 	WORKFLOW_ACTIVE_MODAL_KEY,
-	WORKFLOW_LM_CHAT_MODAL_KEY,
 	WORKFLOW_SETTINGS_MODAL_KEY,
 	WORKFLOW_SHARE_MODAL_KEY,
 	IMPORT_CURL_MODAL_KEY,
@@ -51,7 +50,6 @@ import WorkflowTagsManager from '@/components/TagsManager/WorkflowTagsManager.vu
 import AnnotationTagsManager from '@/components/TagsManager/AnnotationTagsManager.ee.vue';
 import UpdatesPanel from '@/components/UpdatesPanel.vue';
 import NpsSurvey from '@/components/NpsSurvey.vue';
-import WorkflowLMChat from '@/components/WorkflowLMChat/WorkflowLMChat.vue';
 import WorkflowSettings from '@/components/WorkflowSettings.vue';
 import DeleteUserModal from '@/components/DeleteUserModal.vue';
 import ActivationModal from '@/components/ActivationModal.vue';
@@ -125,10 +123,6 @@ import type { EventBus } from 'n8n-design-system';
 			</template>
 		</ModalRoot>
 
-		<ModalRoot :name="WORKFLOW_LM_CHAT_MODAL_KEY">
-			<WorkflowLMChat />
-		</ModalRoot>
-
 		<ModalRoot :name="WORKFLOW_SETTINGS_MODAL_KEY">
 			<WorkflowSettings />
 		</ModalRoot>
diff --git a/packages/editor-ui/src/components/RunDataAi/AiRunContentBlock.vue b/packages/editor-ui/src/components/RunDataAi/AiRunContentBlock.vue
index 9458f75380..7c11707de9 100644
--- a/packages/editor-ui/src/components/RunDataAi/AiRunContentBlock.vue
+++ b/packages/editor-ui/src/components/RunDataAi/AiRunContentBlock.vue
@@ -24,7 +24,7 @@ const contentParsers = useAiContentParsers();
 
 // eslint-disable-next-line @typescript-eslint/no-use-before-define
 const isExpanded = ref(getInitialExpandedState());
-const isShowRaw = ref(false);
+const renderType = ref<'rendered' | 'json'>('rendered');
 const contentParsed = ref(false);
 const parsedRun = ref(undefined as ParsedAiContent | undefined);
 function getInitialExpandedState() {
@@ -134,6 +134,10 @@ function onCopyToClipboard(content: IDataObject | IDataObject[]) {
 	} catch (err) {}
 }
 
+function onRenderTypeChange(value: 'rendered' | 'json') {
+	renderType.value = value;
+}
+
 onMounted(() => {
 	parsedRun.value = parseAiRunData(props.runData);
 	if (parsedRun.value) {
@@ -146,16 +150,19 @@ onMounted(() => {
 	<div :class="$style.block">
 		<header :class="$style.blockHeader" @click="onBlockHeaderClick">
 			<button :class="$style.blockToggle">
-				<font-awesome-icon :icon="isExpanded ? 'angle-down' : 'angle-up'" size="lg" />
+				<font-awesome-icon :icon="isExpanded ? 'angle-down' : 'angle-right'" size="lg" />
 			</button>
 			<p :class="$style.blockTitle">{{ capitalize(runData.inOut) }}</p>
-			<!-- @click.stop to prevent event from bubbling to blockHeader and toggling expanded state when clicking on rawSwitch -->
-			<el-switch
-				v-if="contentParsed && !error"
-				v-model="isShowRaw"
+			<n8n-radio-buttons
+				v-if="contentParsed && !error && isExpanded"
+				size="small"
+				:model-value="renderType"
 				:class="$style.rawSwitch"
-				active-text="RAW JSON"
-				@click.stop
+				:options="[
+					{ label: 'Rendered', value: 'rendered' },
+					{ label: 'JSON', value: 'json' },
+				]"
+				@update:model-value="onRenderTypeChange"
 			/>
 		</header>
 		<main
@@ -172,7 +179,7 @@ onMounted(() => {
 				:class="$style.contentText"
 				:data-content-type="parsedContent?.type"
 			>
-				<template v-if="parsedContent && !isShowRaw">
+				<template v-if="parsedContent && renderType === 'rendered'">
 					<template v-if="parsedContent.type === 'json'">
 						<VueMarkdown
 							:source="jsonToMarkdown(parsedContent.data as JsonMarkdown)"
@@ -226,17 +233,17 @@ onMounted(() => {
 		white-space: pre-wrap;
 
 		h1 {
-			font-size: var(--font-size-xl);
+			font-size: var(--font-size-l);
 			line-height: var(--font-line-height-xloose);
 		}
 
 		h2 {
-			font-size: var(--font-size-l);
+			font-size: var(--font-size-m);
 			line-height: var(--font-line-height-loose);
 		}
 
 		h3 {
-			font-size: var(--font-size-m);
+			font-size: var(--font-size-s);
 			line-height: var(--font-line-height-regular);
 		}
 
@@ -252,17 +259,16 @@ onMounted(() => {
 }
 .contentText {
 	padding-top: var(--spacing-s);
-	font-size: var(--font-size-xs);
-	// max-height: 100%;
+	padding-left: var(--spacing-m);
+	font-size: var(--font-size-s);
 }
 .block {
-	border: 1px solid var(--color-foreground-base);
-	background: var(--color-background-xlight);
-	padding: var(--spacing-xs);
-	border-radius: 4px;
-	margin-bottom: var(--spacing-2xs);
+	padding: 0 0 var(--spacing-2xs) var(--spacing-2xs);
+	background: var(--color-foreground-light);
+	margin-top: var(--spacing-xl);
+	border-radius: var(--border-radius-base);
 }
-.blockContent {
+:root .blockContent {
 	height: 0;
 	overflow: hidden;
 
@@ -271,14 +277,17 @@ onMounted(() => {
 	}
 }
 .runText {
-	line-height: var(--font-line-height-regular);
+	line-height: var(--font-line-height-xloose);
 	white-space: pre-line;
 }
 .rawSwitch {
+	opacity: 0;
+	height: fit-content;
 	margin-left: auto;
+	margin-right: var(--spacing-2xs);
 
-	& * {
-		font-size: var(--font-size-2xs);
+	.block:hover & {
+		opacity: 1;
 	}
 }
 .blockHeader {
@@ -287,21 +296,25 @@ onMounted(() => {
 	cursor: pointer;
 	/* This hack is needed to make the whole surface of header clickable  */
 	margin: calc(-1 * var(--spacing-xs));
-	padding: var(--spacing-xs);
+	padding: var(--spacing-2xs) var(--spacing-xs);
+	align-items: center;
 
 	& * {
 		user-select: none;
 	}
 }
 .blockTitle {
-	font-size: var(--font-size-2xs);
+	font-size: var(--font-size-s);
 	color: var(--color-text-dark);
+	margin: 0;
+	padding-bottom: var(--spacing-4xs);
 }
 .blockToggle {
 	border: none;
 	background: none;
 	padding: 0;
 	color: var(--color-text-base);
+	margin-top: calc(-1 * var(--spacing-3xs));
 }
 .error {
 	padding: var(--spacing-s) 0;
diff --git a/packages/editor-ui/src/components/RunDataAi/RunDataAi.vue b/packages/editor-ui/src/components/RunDataAi/RunDataAi.vue
index 4092f09884..1d78d957cb 100644
--- a/packages/editor-ui/src/components/RunDataAi/RunDataAi.vue
+++ b/packages/editor-ui/src/components/RunDataAi/RunDataAi.vue
@@ -25,7 +25,6 @@ interface TreeNode {
 export interface Props {
 	node: INodeUi;
 	runIndex?: number;
-	hideTitle?: boolean;
 	slim?: boolean;
 	workflow: Workflow;
 }
@@ -203,7 +202,7 @@ const aiData = computed<AIResult[]>(() => {
 const executionTree = computed<TreeNode[]>(() => {
 	const rootNode = props.node;
 
-	const tree = getTreeNodeData(rootNode.name, 1);
+	const tree = getTreeNodeData(rootNode.name, 0);
 	return tree || [];
 });
 
@@ -211,66 +210,73 @@ watch(() => props.runIndex, selectFirst, { immediate: true });
 </script>
 
 <template>
-	<div v-if="aiData.length > 0" :class="$style.container">
-		<div :class="{ [$style.tree]: true, [$style.slim]: slim }">
-			<ElTree
-				:data="executionTree"
-				:props="{ label: 'node' }"
-				default-expand-all
-				:indent="12"
-				:expand-on-click-node="false"
-				data-test-id="lm-chat-logs-tree"
-				@node-click="onItemClick"
-			>
-				<template #default="{ node, data }">
-					<div
-						:class="{
-							[$style.treeNode]: true,
-							[$style.isSelected]: isTreeNodeSelected(data),
-						}"
-						:data-tree-depth="data.depth"
-						:style="{ '--item-depth': data.depth }"
-					>
-						<button
-							v-if="data.children.length"
-							:class="$style.treeToggle"
-							@click="toggleTreeItem(node)"
+	<div :class="$style.container">
+		<template v-if="aiData.length > 0">
+			<div :class="{ [$style.tree]: true, [$style.slim]: slim }">
+				<ElTree
+					:data="executionTree"
+					:props="{ label: 'node' }"
+					default-expand-all
+					:indent="12"
+					:expand-on-click-node="false"
+					data-test-id="lm-chat-logs-tree"
+					@node-click="onItemClick"
+				>
+					<template #default="{ node, data }">
+						<div
+							:class="{
+								[$style.treeNode]: true,
+								[$style.isSelected]: isTreeNodeSelected(data),
+							}"
+							:data-tree-depth="data.depth"
+							:style="{ '--item-depth': data.depth }"
 						>
-							<font-awesome-icon :icon="node.expanded ? 'angle-down' : 'angle-up'" />
-						</button>
-						<n8n-tooltip :disabled="!slim" placement="right">
-							<template #content>
-								{{ node.label }}
-							</template>
-							<span :class="$style.leafLabel">
-								<NodeIcon :node-type="getNodeType(data.node)!" :size="17" />
-								<span v-if="!slim" v-text="node.label" />
-							</span>
-						</n8n-tooltip>
-					</div>
-				</template>
-			</ElTree>
-		</div>
-		<div :class="$style.runData">
-			<div v-if="selectedRun.length === 0" :class="$style.empty">
-				<n8n-text size="large">
-					{{
-						$locale.baseText('ndv.output.ai.empty', {
-							interpolate: {
-								node: props.node.name,
-							},
-						})
-					}}
-				</n8n-text>
+							<button
+								v-if="data.children.length"
+								:class="$style.treeToggle"
+								@click="toggleTreeItem(node)"
+							>
+								<font-awesome-icon :icon="node.expanded ? 'angle-down' : 'angle-right'" />
+							</button>
+							<n8n-tooltip :disabled="!slim" placement="right">
+								<template #content>
+									{{ node.label }}
+								</template>
+								<span :class="$style.leafLabel">
+									<NodeIcon
+										:node-type="getNodeType(data.node)!"
+										:size="17"
+										:class="$style.nodeIcon"
+									/>
+									<span v-if="!slim" v-text="node.label" />
+								</span>
+							</n8n-tooltip>
+						</div>
+					</template>
+				</ElTree>
 			</div>
-			<div
-				v-for="(data, index) in selectedRun"
-				:key="`${data.node}__${data.runIndex}__index`"
-				data-test-id="lm-chat-logs-entry"
-			>
-				<RunDataAiContent :input-data="data" :content-index="index" />
+			<div :class="$style.runData">
+				<div v-if="selectedRun.length === 0" :class="$style.empty">
+					<n8n-text size="large">
+						{{
+							$locale.baseText('ndv.output.ai.empty', {
+								interpolate: {
+									node: props.node.name,
+								},
+							})
+						}}
+					</n8n-text>
+				</div>
+				<div
+					v-for="(data, index) in selectedRun"
+					:key="`${data.node}__${data.runIndex}__index`"
+					data-test-id="lm-chat-logs-entry"
+				>
+					<RunDataAiContent :input-data="data" :content-index="index" />
+				</div>
 			</div>
-		</div>
+		</template>
+		<div v-else :class="$style.noData">{{ $locale.baseText('ndv.output.ai.waiting') }}</div>
 	</div>
 </template>
 
@@ -287,6 +293,13 @@ watch(() => props.runIndex, selectFirst, { immediate: true });
 	align-items: center;
 	gap: var(--spacing-3xs);
 }
+.noData {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	width: 100%;
+	color: var(--color-text-light);
+}
 .empty {
 	padding: var(--spacing-l);
 }
@@ -296,9 +309,9 @@ watch(() => props.runIndex, selectFirst, { immediate: true });
 }
 .tree {
 	flex-shrink: 0;
-	min-width: 12.8rem;
+	min-width: 8rem;
 	height: 100%;
-	border-right: 1px solid var(--color-foreground-base);
+
 	padding-right: var(--spacing-xs);
 	padding-left: var(--spacing-2xs);
 	&.slim {
@@ -337,20 +350,30 @@ watch(() => props.runIndex, selectFirst, { immediate: true });
 		margin-left: var(--spacing-xs);
 	}
 }
+.nodeIcon {
+	padding: var(--spacing-3xs) var(--spacing-3xs);
+	border-radius: var(--border-radius-base);
+	margin-right: var(--spacing-4xs);
+}
 .isSelected {
-	background-color: var(--color-foreground-base);
+	.nodeIcon {
+		background-color: var(--color-foreground-base);
+	}
 }
 .treeNode {
 	display: inline-flex;
 	border-radius: var(--border-radius-base);
 	align-items: center;
-	gap: var(--spacing-3xs);
-	padding: var(--spacing-4xs) var(--spacing-3xs);
-	font-size: var(--font-size-xs);
+	padding-right: var(--spacing-3xs);
+	margin: var(--spacing-4xs) 0;
+	font-size: var(--font-size-2xs);
 	color: var(--color-text-dark);
 	margin-bottom: var(--spacing-3xs);
 	cursor: pointer;
 
+	&.isSelected {
+		font-weight: var(--font-weight-bold);
+	}
 	&:hover {
 		background-color: var(--color-foreground-base);
 	}
@@ -366,6 +389,7 @@ watch(() => props.runIndex, selectFirst, { immediate: true });
 		height: 0.125rem;
 		left: 0.75rem;
 		width: calc(var(--item-depth) * 0.625rem);
+		margin-top: var(--spacing-3xs);
 	}
 }
 </style>
diff --git a/packages/editor-ui/src/components/RunDataAi/useAiContentParsers.ts b/packages/editor-ui/src/components/RunDataAi/useAiContentParsers.ts
index c7e204548e..2f02d6b0cc 100644
--- a/packages/editor-ui/src/components/RunDataAi/useAiContentParsers.ts
+++ b/packages/editor-ui/src/components/RunDataAi/useAiContentParsers.ts
@@ -134,13 +134,6 @@ const outputTypeParsers: {
 						} else if (content.id.includes('SystemMessage')) {
 							message = `**System Message:** ${message}`;
 						}
-						if (
-							execData.action &&
-							typeof execData.action !== 'object' &&
-							execData.action !== 'getMessages'
-						) {
-							message = `## Action: ${execData.action}\n\n${message}`;
-						}
 
 						return message;
 					}
@@ -148,6 +141,9 @@ const outputTypeParsers: {
 				})
 				.join('\n\n');
 
+			if (responseText.length === 0) {
+				return fallbackParser(execData);
+			}
 			return {
 				type: 'markdown',
 				data: responseText,
diff --git a/packages/editor-ui/src/components/WorkflowLMChat/MessageOptionAction.vue b/packages/editor-ui/src/components/WorkflowLMChat/MessageOptionAction.vue
deleted file mode 100644
index 69bb16737d..0000000000
--- a/packages/editor-ui/src/components/WorkflowLMChat/MessageOptionAction.vue
+++ /dev/null
@@ -1,31 +0,0 @@
-<script setup lang="ts">
-const emit = defineEmits<{
-	click: [];
-}>();
-
-defineProps<{
-	label: string;
-	icon: string;
-	placement: 'left' | 'right' | 'top' | 'bottom';
-}>();
-</script>
-
-<template>
-	<N8nTooltip :placement="placement">
-		<button :class="$style.button" :style="{ color: '#aaa' }" @click="emit('click')">
-			<N8nIcon :icon="icon" size="small" />
-		</button>
-		<template #content>
-			{{ label }}
-		</template>
-	</N8nTooltip>
-</template>
-
-<style module>
-.button {
-	background: none;
-	border: none;
-	cursor: pointer;
-	padding: 0;
-}
-</style>
diff --git a/packages/editor-ui/src/components/WorkflowLMChat/MessageOptionTooltip.vue b/packages/editor-ui/src/components/WorkflowLMChat/MessageOptionTooltip.vue
deleted file mode 100644
index 008993fee5..0000000000
--- a/packages/editor-ui/src/components/WorkflowLMChat/MessageOptionTooltip.vue
+++ /dev/null
@@ -1,15 +0,0 @@
-<script setup lang="ts">
-defineProps<{
-	placement: 'left' | 'right';
-}>();
-</script>
-
-<template>
-	<n8n-info-tip type="tooltip" theme="info-light" :tooltip-placement="placement">
-		<n8n-text :bold="true" size="small">
-			<slot />
-		</n8n-text>
-	</n8n-info-tip>
-</template>
-
-<style module lang="scss"></style>
diff --git a/packages/editor-ui/src/components/WorkflowLMChat/WorkflowLMChat.vue b/packages/editor-ui/src/components/WorkflowLMChat/WorkflowLMChat.vue
deleted file mode 100644
index 72fcd3012d..0000000000
--- a/packages/editor-ui/src/components/WorkflowLMChat/WorkflowLMChat.vue
+++ /dev/null
@@ -1,699 +0,0 @@
-<script setup lang="ts">
-import type { Ref } from 'vue';
-import { defineAsyncComponent, provide, ref, computed, onMounted, nextTick } from 'vue';
-import { v4 as uuid } from 'uuid';
-import Modal from '@/components/Modal.vue';
-import {
-	AI_CATEGORY_AGENTS,
-	AI_CATEGORY_CHAINS,
-	AI_CODE_NODE_TYPE,
-	AI_SUBCATEGORY,
-	CHAT_EMBED_MODAL_KEY,
-	CHAT_TRIGGER_NODE_TYPE,
-	MANUAL_CHAT_TRIGGER_NODE_TYPE,
-	MODAL_CONFIRM,
-	VIEWS,
-	WORKFLOW_LM_CHAT_MODAL_KEY,
-} from '@/constants';
-
-import { useUsersStore } from '@/stores/users.store';
-
-// eslint-disable-next-line import/no-unresolved
-import MessagesList from '@n8n/chat/components/MessagesList.vue';
-import type { ArrowKeyDownPayload } from '@n8n/chat/components/Input.vue';
-import ChatInput from '@n8n/chat/components/Input.vue';
-import { useRouter } from 'vue-router';
-import { useRunWorkflow } from '@/composables/useRunWorkflow';
-import type { Chat, ChatMessage, ChatMessageText, ChatOptions } from '@n8n/chat/types';
-import { useI18n } from '@/composables/useI18n';
-import { ChatOptionsSymbol, ChatSymbol } from '@n8n/chat/constants';
-import MessageOptionTooltip from './MessageOptionTooltip.vue';
-import MessageOptionAction from './MessageOptionAction.vue';
-
-import type {
-	BinaryFileType,
-	IBinaryData,
-	IBinaryKeyData,
-	IDataObject,
-	INode,
-	INodeExecutionData,
-	INodeParameters,
-	INodeType,
-	ITaskData,
-	IUser,
-} from 'n8n-workflow';
-import {
-	CHAIN_SUMMARIZATION_LANGCHAIN_NODE_TYPE,
-	NodeConnectionType,
-	NodeHelpers,
-} from 'n8n-workflow';
-import { useWorkflowsStore } from '@/stores/workflows.store';
-import { useToast } from '@/composables/useToast';
-import type { INodeUi } from '@/Interface';
-import { useNodeTypesStore } from '@/stores/nodeTypes.store';
-import { createEventBus } from 'n8n-design-system';
-import { useUIStore } from '@/stores/ui.store';
-import { useMessage } from '@/composables/useMessage';
-import { usePinnedData } from '@/composables/usePinnedData';
-import { get, last } from 'lodash-es';
-import { isEmpty } from '@/utils/typesUtils';
-import { chatEventBus } from '@n8n/chat/event-buses';
-
-const LazyRunDataAi = defineAsyncComponent(
-	async () => await import('@/components/RunDataAi/RunDataAi.vue'),
-);
-
-// TODO: Add proper type
-interface LangChainMessage {
-	id: string[];
-	kwargs: {
-		content: string;
-	};
-}
-
-interface MemoryOutput {
-	action: string;
-	chatHistory?: LangChainMessage[];
-}
-
-const router = useRouter();
-const { runWorkflow } = useRunWorkflow({ router });
-const workflowsStore = useWorkflowsStore();
-const nodeTypesStore = useNodeTypesStore();
-const uiStore = useUIStore();
-
-const { showError } = useToast();
-const messages: Ref<ChatMessage[]> = ref([]);
-const currentSessionId = ref<string>(String(Date.now()));
-const isDisabled = ref(false);
-
-const connectedNode = ref<INode | null>(null);
-const chatTrigger = ref<INode | null>(null);
-const modalBus = createEventBus();
-const node = ref<INode | null>(null);
-const previousMessageIndex = ref(0);
-
-const isLoading = computed(() => uiStore.isActionActive.workflowRunning);
-const allowFileUploads = computed(() => {
-	return (chatTrigger.value?.parameters?.options as INodeParameters)?.allowFileUploads === true;
-});
-const allowedFilesMimeTypes = computed(() => {
-	return (
-		(
-			chatTrigger.value?.parameters?.options as INodeParameters
-		)?.allowedFilesMimeTypes?.toString() ?? ''
-	);
-});
-const locale = useI18n();
-
-const chatOptions: ChatOptions = {
-	i18n: {
-		en: {
-			title: '',
-			footer: '',
-			subtitle: '',
-			inputPlaceholder: locale.baseText('chat.window.chat.placeholder'),
-			getStarted: '',
-			closeButtonTooltip: '',
-		},
-	},
-	webhookUrl: '',
-	mode: 'window',
-	showWindowCloseButton: true,
-	disabled: isDisabled,
-	allowFileUploads,
-	allowedFilesMimeTypes,
-};
-
-const chatConfig: Chat = {
-	messages,
-	sendMessage,
-	initialMessages: ref([]),
-	currentSessionId,
-	waitingForResponse: isLoading,
-};
-
-const messageVars = {
-	'--chat--message--bot--background': 'var(--color-lm-chat-bot-background)',
-	'--chat--message--user--background': 'var(--color-lm-chat-user-background)',
-	'--chat--message--bot--color': 'var(--color-text-dark)',
-	'--chat--message--user--color': 'var(--color-lm-chat-user-color)',
-	'--chat--message--bot--border': 'none',
-	'--chat--message--user--border': 'none',
-	'--chat--color-typing': 'var(--color-text-dark)',
-};
-
-const workflow = computed(() => workflowsStore.getCurrentWorkflow());
-function getTriggerNode() {
-	const triggerNode = workflow.value.queryNodes((nodeType: INodeType) =>
-		[CHAT_TRIGGER_NODE_TYPE, MANUAL_CHAT_TRIGGER_NODE_TYPE].includes(nodeType.description.name),
-	);
-
-	if (!triggerNode.length) {
-		chatTrigger.value = null;
-	}
-
-	chatTrigger.value = triggerNode[0];
-}
-
-function setNode() {
-	const triggerNode = chatTrigger.value;
-	if (!triggerNode) {
-		return;
-	}
-
-	const childNodes = workflow.value.getChildNodes(triggerNode.name);
-
-	for (const childNode of childNodes) {
-		// Look for the first connected node with metadata
-		// TODO: Allow later users to change that in the UI
-		const connectedSubNodes = workflow.value.getParentNodes(childNode, 'ALL_NON_MAIN');
-		const resultData = connectedSubNodes.map(workflowsStore.getWorkflowResultDataByNodeName);
-
-		if (!resultData && !Array.isArray(resultData)) {
-			continue;
-		}
-
-		if (resultData.some((data) => data?.[0].metadata)) {
-			node.value = workflowsStore.getNodeByName(childNode);
-			break;
-		}
-	}
-}
-
-function setConnectedNode() {
-	const triggerNode = chatTrigger.value;
-
-	if (!triggerNode) {
-		showError(new Error('Chat Trigger Node could not be found!'), 'Trigger Node not found');
-		return;
-	}
-
-	const chatNode = workflowsStore.getNodes().find((storeNode: INodeUi): boolean => {
-		if (storeNode.type === CHAIN_SUMMARIZATION_LANGCHAIN_NODE_TYPE) return false;
-		const nodeType = nodeTypesStore.getNodeType(storeNode.type, storeNode.typeVersion);
-		if (!nodeType) return false;
-
-		const isAgent = nodeType.codex?.subcategories?.[AI_SUBCATEGORY]?.includes(AI_CATEGORY_AGENTS);
-		const isChain = nodeType.codex?.subcategories?.[AI_SUBCATEGORY]?.includes(AI_CATEGORY_CHAINS);
-
-		let isCustomChainOrAgent = false;
-		if (nodeType.name === AI_CODE_NODE_TYPE) {
-			const inputs = NodeHelpers.getNodeInputs(workflow.value, storeNode, nodeType);
-			const inputTypes = NodeHelpers.getConnectionTypes(inputs);
-
-			const outputs = NodeHelpers.getNodeOutputs(workflow.value, storeNode, nodeType);
-			const outputTypes = NodeHelpers.getConnectionTypes(outputs);
-
-			if (
-				inputTypes.includes(NodeConnectionType.AiLanguageModel) &&
-				inputTypes.includes(NodeConnectionType.Main) &&
-				outputTypes.includes(NodeConnectionType.Main)
-			) {
-				isCustomChainOrAgent = true;
-			}
-		}
-
-		if (!isAgent && !isChain && !isCustomChainOrAgent) return false;
-
-		const parentNodes = workflow.value.getParentNodes(storeNode.name);
-		const isChatChild = parentNodes.some((parentNodeName) => parentNodeName === triggerNode.name);
-
-		return Boolean(isChatChild && (isAgent || isChain || isCustomChainOrAgent));
-	});
-
-	if (!chatNode) {
-		return;
-	}
-
-	connectedNode.value = chatNode;
-}
-
-async function convertFileToBinaryData(file: File): Promise<IBinaryData> {
-	const reader = new FileReader();
-	return await new Promise((resolve, reject) => {
-		reader.onload = () => {
-			const binaryData: IBinaryData = {
-				data: (reader.result as string).split('base64,')?.[1] ?? '',
-				mimeType: file.type,
-				fileName: file.name,
-				fileSize: `${file.size} bytes`,
-				fileExtension: file.name.split('.').pop() ?? '',
-				fileType: file.type.split('/')[0] as BinaryFileType,
-			};
-			resolve(binaryData);
-		};
-		reader.onerror = () => {
-			reject(new Error('Failed to convert file to binary data'));
-		};
-		reader.readAsDataURL(file);
-	});
-}
-
-async function getKeyedFiles(files: File[]): Promise<IBinaryKeyData> {
-	const binaryData: IBinaryKeyData = {};
-
-	await Promise.all(
-		files.map(async (file, index) => {
-			const data = await convertFileToBinaryData(file);
-			const key = `data${index}`;
-
-			binaryData[key] = data;
-		}),
-	);
-
-	return binaryData;
-}
-
-function extractFileMeta(file: File): IDataObject {
-	return {
-		fileName: file.name,
-		fileSize: `${file.size} bytes`,
-		fileExtension: file.name.split('.').pop() ?? '',
-		fileType: file.type.split('/')[0],
-		mimeType: file.type,
-	};
-}
-
-async function startWorkflowWithMessage(message: string, files?: File[]): Promise<void> {
-	const triggerNode = chatTrigger.value;
-
-	if (!triggerNode) {
-		showError(new Error('Chat Trigger Node could not be found!'), 'Trigger Node not found');
-		return;
-	}
-
-	let inputKey = 'chatInput';
-	if (triggerNode.type === MANUAL_CHAT_TRIGGER_NODE_TYPE && triggerNode.typeVersion < 1.1) {
-		inputKey = 'input';
-	}
-	if (triggerNode.type === CHAT_TRIGGER_NODE_TYPE) {
-		inputKey = 'chatInput';
-	}
-
-	const usersStore = useUsersStore();
-	const currentUser = usersStore.currentUser ?? ({} as IUser);
-
-	const inputPayload: INodeExecutionData = {
-		json: {
-			sessionId: `test-${currentUser.id || 'unknown'}`,
-			action: 'sendMessage',
-			[inputKey]: message,
-		},
-	};
-
-	if (files && files.length > 0) {
-		const filesMeta = files.map((file) => extractFileMeta(file));
-		const binaryData = await getKeyedFiles(files);
-
-		inputPayload.json.files = filesMeta;
-		inputPayload.binary = binaryData;
-	}
-	const nodeData: ITaskData = {
-		startTime: new Date().getTime(),
-		executionTime: 0,
-		executionStatus: 'success',
-		data: {
-			main: [[inputPayload]],
-		},
-		source: [null],
-	};
-
-	const response = await runWorkflow({
-		triggerNode: triggerNode.name,
-		nodeData,
-		source: 'RunData.ManualChatMessage',
-	});
-
-	workflowsStore.appendChatMessage(message);
-	if (!response) {
-		showError(new Error('It was not possible to start workflow!'), 'Workflow could not be started');
-		return;
-	}
-
-	waitForExecution(response.executionId);
-}
-
-function waitForExecution(executionId?: string) {
-	const waitInterval = setInterval(() => {
-		if (!isLoading.value) {
-			clearInterval(waitInterval);
-
-			const lastNodeExecuted =
-				workflowsStore.getWorkflowExecution?.data?.resultData.lastNodeExecuted;
-
-			if (!lastNodeExecuted) return;
-
-			const nodeResponseDataArray =
-				get(workflowsStore.getWorkflowExecution?.data?.resultData.runData, lastNodeExecuted) ?? [];
-
-			const nodeResponseData = nodeResponseDataArray[nodeResponseDataArray.length - 1];
-
-			let responseMessage: string;
-
-			if (get(nodeResponseData, 'error')) {
-				responseMessage = '[ERROR: ' + get(nodeResponseData, 'error.message') + ']';
-			} else {
-				const responseData = get(nodeResponseData, 'data.main[0][0].json');
-				responseMessage = extractResponseMessage(responseData);
-			}
-
-			messages.value.push({
-				text: responseMessage,
-				sender: 'bot',
-				createdAt: new Date().toISOString(),
-				id: executionId ?? uuid(),
-			});
-
-			void nextTick(setNode);
-		}
-	}, 500);
-}
-
-function extractResponseMessage(responseData?: IDataObject) {
-	if (!responseData || isEmpty(responseData)) {
-		return locale.baseText('chat.window.chat.response.empty');
-	}
-
-	// Paths where the response message might be located
-	const paths = ['output', 'text', 'response.text'];
-	const matchedPath = paths.find((path) => get(responseData, path));
-
-	if (!matchedPath) return JSON.stringify(responseData, null, 2);
-
-	const matchedOutput = get(responseData, matchedPath);
-	if (typeof matchedOutput === 'object') {
-		return '```json\n' + JSON.stringify(matchedOutput, null, 2) + '\n```';
-	}
-
-	return matchedOutput?.toString() ?? '';
-}
-
-async function sendMessage(message: string, files?: File[]) {
-	previousMessageIndex.value = 0;
-	if (message.trim() === '' && (!files || files.length === 0)) {
-		showError(
-			new Error(locale.baseText('chat.window.chat.provideMessage')),
-			locale.baseText('chat.window.chat.emptyChatMessage'),
-		);
-		return;
-	}
-
-	const pinnedChatData = usePinnedData(chatTrigger.value);
-	if (pinnedChatData.hasData.value) {
-		const confirmResult = await useMessage().confirm(
-			locale.baseText('chat.window.chat.unpinAndExecute.description'),
-			locale.baseText('chat.window.chat.unpinAndExecute.title'),
-			{
-				confirmButtonText: locale.baseText('chat.window.chat.unpinAndExecute.confirm'),
-				cancelButtonText: locale.baseText('chat.window.chat.unpinAndExecute.cancel'),
-			},
-		);
-
-		if (!(confirmResult === MODAL_CONFIRM)) return;
-
-		pinnedChatData.unsetData('unpin-and-send-chat-message-modal');
-	}
-
-	const newMessage: ChatMessage = {
-		text: message,
-		sender: 'user',
-		createdAt: new Date().toISOString(),
-		id: uuid(),
-		files,
-	};
-	messages.value.push(newMessage);
-
-	await startWorkflowWithMessage(newMessage.text, files);
-}
-
-function displayExecution(executionId: string) {
-	const route = router.resolve({
-		name: VIEWS.EXECUTION_PREVIEW,
-		params: { name: workflow.value.id, executionId },
-	});
-	window.open(route.href, '_blank');
-}
-function isTextMessage(message: ChatMessage): message is ChatMessageText {
-	return message.type === 'text' || !message.type;
-}
-
-function repostMessage(message: ChatMessageText) {
-	void sendMessage(message.text);
-}
-function reuseMessage(message: ChatMessageText) {
-	chatEventBus.emit('setInputValue', message.text);
-}
-
-function getChatMessages(): ChatMessageText[] {
-	if (!connectedNode.value) return [];
-
-	const connectedMemoryInputs =
-		workflow.value.connectionsByDestinationNode[connectedNode.value.name][
-			NodeConnectionType.AiMemory
-		];
-	if (!connectedMemoryInputs) return [];
-
-	const memoryConnection = (connectedMemoryInputs ?? []).find((i) => i.length > 0)?.[0];
-
-	if (!memoryConnection) return [];
-
-	const nodeResultData = workflowsStore.getWorkflowResultDataByNodeName(memoryConnection.node);
-
-	const memoryOutputData = (nodeResultData ?? [])
-		.map((data) => get(data, ['data', NodeConnectionType.AiMemory, 0, 0, 'json']) as MemoryOutput)
-		.find((data) => data.action === 'saveContext');
-
-	return (memoryOutputData?.chatHistory ?? []).map((message, index) => {
-		return {
-			createdAt: new Date().toISOString(),
-			text: message.kwargs.content,
-			id: `preload__${index}`,
-			sender: last(message.id) === 'HumanMessage' ? 'user' : 'bot',
-		};
-	});
-}
-
-function onArrowKeyDown({ currentInputValue, key }: ArrowKeyDownPayload) {
-	const pastMessages = workflowsStore.getPastChatMessages;
-	const isCurrentInputEmptyOrMatch =
-		currentInputValue.length === 0 || pastMessages.includes(currentInputValue);
-
-	if (isCurrentInputEmptyOrMatch && (key === 'ArrowUp' || key === 'ArrowDown')) {
-		// Blur the input when the user presses the up or down arrow key
-		chatEventBus.emit('blurInput');
-
-		if (pastMessages.length === 1) {
-			previousMessageIndex.value = 0;
-		} else if (key === 'ArrowUp') {
-			previousMessageIndex.value = (previousMessageIndex.value + 1) % pastMessages.length;
-		} else if (key === 'ArrowDown') {
-			previousMessageIndex.value =
-				(previousMessageIndex.value - 1 + pastMessages.length) % pastMessages.length;
-		}
-
-		chatEventBus.emit(
-			'setInputValue',
-			pastMessages[pastMessages.length - 1 - previousMessageIndex.value] ?? '',
-		);
-
-		// Refocus to move the cursor to the end of the input
-		chatEventBus.emit('focusInput');
-	}
-}
-
-provide(ChatSymbol, chatConfig);
-provide(ChatOptionsSymbol, chatOptions);
-onMounted(() => {
-	getTriggerNode();
-	setConnectedNode();
-	messages.value = getChatMessages();
-	setNode();
-
-	setTimeout(() => chatEventBus.emit('focusInput'), 0);
-});
-</script>
-
-<template>
-	<Modal
-		:name="WORKFLOW_LM_CHAT_MODAL_KEY"
-		width="80%"
-		max-height="80%"
-		:title="
-			locale.baseText('chat.window.title', {
-				interpolate: {
-					nodeName: connectedNode?.name || locale.baseText('chat.window.noChatNode'),
-				},
-			})
-		"
-		:event-bus="modalBus"
-		:scrollable="false"
-		@keydown.stop
-	>
-		<template #content>
-			<div
-				:class="$style.workflowLmChat"
-				data-test-id="workflow-lm-chat-dialog"
-				:style="messageVars"
-			>
-				<MessagesList :messages="messages" :class="[$style.messages, 'ignore-key-press-canvas']">
-					<template #beforeMessage="{ message }">
-						<MessageOptionTooltip
-							v-if="message.sender === 'bot' && !message.id.includes('preload')"
-							placement="right"
-						>
-							{{ locale.baseText('chat.window.chat.chatMessageOptions.executionId') }}:
-							<a href="#" @click="displayExecution(message.id)">{{ message.id }}</a>
-						</MessageOptionTooltip>
-
-						<MessageOptionAction
-							v-if="isTextMessage(message) && message.sender === 'user'"
-							data-test-id="repost-message-button"
-							icon="redo"
-							:label="locale.baseText('chat.window.chat.chatMessageOptions.repostMessage')"
-							placement="left"
-							@click="repostMessage(message)"
-						/>
-
-						<MessageOptionAction
-							v-if="isTextMessage(message) && message.sender === 'user'"
-							data-test-id="reuse-message-button"
-							icon="copy"
-							:label="locale.baseText('chat.window.chat.chatMessageOptions.reuseMessage')"
-							placement="left"
-							@click="reuseMessage(message)"
-						/>
-					</template>
-				</MessagesList>
-				<div v-if="node" :class="$style.logsWrapper" data-test-id="lm-chat-logs">
-					<n8n-text :class="$style.logsTitle" tag="p" size="large">{{
-						locale.baseText('chat.window.logs')
-					}}</n8n-text>
-					<div :class="$style.logs">
-						<LazyRunDataAi
-							:key="messages.length"
-							:node="node"
-							hide-title
-							slim
-							:workflow="workflow"
-						/>
-					</div>
-				</div>
-			</div>
-		</template>
-		<template #footer>
-			<ChatInput
-				:class="$style.messagesInput"
-				data-test-id="lm-chat-inputs"
-				@arrow-key-down="onArrowKeyDown"
-			/>
-			<n8n-info-tip class="mt-s">
-				{{ locale.baseText('chatEmbed.infoTip.description') }}
-				<a @click="uiStore.openModal(CHAT_EMBED_MODAL_KEY)">
-					{{ locale.baseText('chatEmbed.infoTip.link') }}
-				</a>
-			</n8n-info-tip>
-		</template>
-	</Modal>
-</template>
-
-<style lang="scss">
-.chat-message-markdown ul,
-.chat-message-markdown ol {
-	padding: 0 0 0 1em;
-}
-</style>
-<style module lang="scss">
-.no-node-connected {
-	width: 100%;
-	height: 100%;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-}
-.workflowLmChat {
-	--chat--spacing: var(--spacing-m);
-	--chat--message--padding: var(--spacing-xs);
-
-	display: flex;
-	height: 100%;
-	z-index: 9999;
-	min-height: 10rem;
-
-	@media (min-height: 34rem) {
-		min-height: 14.5rem;
-	}
-	@media (min-height: 47rem) {
-		min-height: 25rem;
-	}
-	& ::-webkit-scrollbar {
-		width: 4px;
-	}
-
-	& ::-webkit-scrollbar-thumb {
-		border-radius: var(--border-radius-base);
-		background: var(--color-foreground-dark);
-		border: 1px solid white;
-	}
-
-	& ::-webkit-scrollbar-thumb:hover {
-		background: var(--color-foreground-xdark);
-	}
-}
-
-.logsWrapper {
-	--node-icon-color: var(--color-text-base);
-	border: 1px solid var(--color-foreground-base);
-	border-radius: var(--border-radius-base);
-	height: 100%;
-	overflow: auto;
-	width: 100%;
-	padding: var(--spacing-xs) 0;
-}
-
-.logsTitle {
-	margin: 0 var(--spacing-s) var(--spacing-s);
-}
-
-.messages {
-	background-color: var(--color-lm-chat-messages-background);
-	border: 1px solid var(--color-foreground-base);
-	border-radius: var(--border-radius-base);
-	height: 100%;
-	width: 100%;
-	overflow: auto;
-	padding-top: 1.5em;
-
-	&:not(:last-child) {
-		margin-right: 1em;
-	}
-
-	& * {
-		font-size: var(--font-size-s);
-	}
-}
-.messagesInput {
-	--chat--input--border: var(--input-border-color, var(--border-color-base))
-		var(--input-border-style, var(--border-style-base))
-		var(--input-border-width, var(--border-width-base));
-
-	--chat--input--border-radius: var(--border-radius-base) 0 0 var(--border-radius-base);
-	--chat--input--send--button--background: transparent;
-	--chat--input--send--button--color: var(--color-button-secondary-font);
-	--chat--input--send--button--color-hover: var(--color-primary);
-	--chat--input--border-active: var(--input-focus-border-color, var(--color-secondary));
-	--chat--files-spacing: var(--spacing-2xs) 0;
-	--chat--input--background: var(--color-lm-chat-bot-background);
-
-	[data-theme='dark'] & {
-		--chat--input--text-color: var(--input-font-color, var(--color-text-dark));
-	}
-	@media (prefers-color-scheme: dark) {
-		--chat--input--text-color: var(--input-font-color, var(--color-text-dark));
-	}
-
-	border-bottom-right-radius: var(--border-radius-base);
-	border-top-right-radius: var(--border-radius-base);
-	overflow: hidden;
-}
-</style>
diff --git a/packages/editor-ui/src/components/WorkflowLMChatModal.test.ts b/packages/editor-ui/src/components/WorkflowLMChatModal.test.ts
deleted file mode 100644
index 8fa20d0965..0000000000
--- a/packages/editor-ui/src/components/WorkflowLMChatModal.test.ts
+++ /dev/null
@@ -1,127 +0,0 @@
-import { createPinia, setActivePinia } from 'pinia';
-import { fireEvent, waitFor } from '@testing-library/vue';
-import { mock } from 'vitest-mock-extended';
-import { NodeConnectionType } from 'n8n-workflow';
-import type { IConnections, INode } from 'n8n-workflow';
-
-import WorkflowLMChatModal from '@/components/WorkflowLMChat/WorkflowLMChat.vue';
-import { WORKFLOW_LM_CHAT_MODAL_KEY } from '@/constants';
-import type { IWorkflowDb } from '@/Interface';
-import { useNodeTypesStore } from '@/stores/nodeTypes.store';
-import { useSettingsStore } from '@/stores/settings.store';
-import { useUIStore } from '@/stores/ui.store';
-import { useUsersStore } from '@/stores/users.store';
-import { useWorkflowsStore } from '@/stores/workflows.store';
-
-import { createComponentRenderer } from '@/__tests__/render';
-import { setupServer } from '@/__tests__/server';
-import { defaultNodeDescriptions, mockNodes } from '@/__tests__/mocks';
-import { cleanupAppModals, createAppModals } from '@/__tests__/utils';
-
-const connections: IConnections = {
-	'Chat Trigger': {
-		main: [
-			[
-				{
-					node: 'Agent',
-					type: NodeConnectionType.Main,
-					index: 0,
-				},
-			],
-		],
-	},
-};
-
-const renderComponent = createComponentRenderer(WorkflowLMChatModal, {
-	props: {
-		teleported: false,
-		appendToBody: false,
-	},
-});
-
-async function createPiniaWithAINodes(options = { withConnections: true, withAgentNode: true }) {
-	const { withConnections, withAgentNode } = options;
-
-	const chatTriggerNode = mockNodes[4];
-	const agentNode = mockNodes[5];
-	const nodes: INode[] = [chatTriggerNode];
-	if (withAgentNode) nodes.push(agentNode);
-	const workflow = mock<IWorkflowDb>({
-		nodes,
-		...(withConnections ? { connections } : {}),
-	});
-
-	const pinia = createPinia();
-	setActivePinia(pinia);
-
-	const workflowsStore = useWorkflowsStore();
-	const nodeTypesStore = useNodeTypesStore();
-	const uiStore = useUIStore();
-
-	nodeTypesStore.setNodeTypes(defaultNodeDescriptions);
-	workflowsStore.workflow = workflow;
-
-	await useSettingsStore().getSettings();
-	await useUsersStore().loginWithCookie();
-	uiStore.openModal(WORKFLOW_LM_CHAT_MODAL_KEY);
-
-	return pinia;
-}
-
-describe('WorkflowLMChatModal', () => {
-	let server: ReturnType<typeof setupServer>;
-
-	beforeAll(() => {
-		server = setupServer();
-	});
-
-	beforeEach(() => {
-		createAppModals();
-	});
-
-	afterEach(() => {
-		cleanupAppModals();
-		vi.clearAllMocks();
-	});
-
-	afterAll(() => {
-		server.shutdown();
-	});
-
-	it('should render correctly', async () => {
-		const { getByTestId } = renderComponent({
-			pinia: await createPiniaWithAINodes(),
-		});
-
-		await waitFor(() => expect(getByTestId('lmChat-modal')).toBeInTheDocument());
-
-		expect(getByTestId('workflow-lm-chat-dialog')).toBeInTheDocument();
-	});
-
-	it('should send and display chat message', async () => {
-		const { getByTestId } = renderComponent({
-			pinia: await createPiniaWithAINodes({
-				withConnections: true,
-				withAgentNode: true,
-			}),
-		});
-
-		await waitFor(() => expect(getByTestId('lmChat-modal')).toBeInTheDocument());
-
-		const chatDialog = getByTestId('workflow-lm-chat-dialog');
-		const chatInputsContainer = getByTestId('lm-chat-inputs');
-		const chatSendButton = chatInputsContainer.querySelector('.chat-input-send-button');
-		const chatInput = chatInputsContainer.querySelector('textarea');
-
-		if (chatInput && chatSendButton) {
-			await fireEvent.update(chatInput, 'Hello!');
-			await fireEvent.click(chatSendButton);
-		}
-
-		await waitFor(() =>
-			expect(chatDialog.querySelectorAll('.chat-message-from-user')).toHaveLength(1),
-		);
-
-		expect(chatDialog.querySelector('.chat-message-from-user')).toHaveTextContent('Hello!');
-	});
-});
diff --git a/packages/editor-ui/src/components/canvas/elements/buttons/CanvasChatButton.vue b/packages/editor-ui/src/components/canvas/elements/buttons/CanvasChatButton.vue
index 877180cd4e..034b16752a 100644
--- a/packages/editor-ui/src/components/canvas/elements/buttons/CanvasChatButton.vue
+++ b/packages/editor-ui/src/components/canvas/elements/buttons/CanvasChatButton.vue
@@ -1,9 +1,17 @@
+<script lang="ts" setup>
+export interface Props {
+	outline?: boolean;
+}
+
+defineProps<Props>();
+</script>
 <template>
 	<N8nButton
 		label="Chat"
 		size="large"
 		icon="comment"
 		type="primary"
+		:outline="outline"
 		data-test-id="workflow-chat-button"
 	/>
 </template>
diff --git a/packages/editor-ui/src/composables/useRunWorkflow.ts b/packages/editor-ui/src/composables/useRunWorkflow.ts
index 658e35b3c6..a944a93348 100644
--- a/packages/editor-ui/src/composables/useRunWorkflow.ts
+++ b/packages/editor-ui/src/composables/useRunWorkflow.ts
@@ -22,12 +22,7 @@ import { FORM_NODE_TYPE, NodeConnectionType } from 'n8n-workflow';
 import { useToast } from '@/composables/useToast';
 import { useNodeHelpers } from '@/composables/useNodeHelpers';
 
-import {
-	CHAT_TRIGGER_NODE_TYPE,
-	FORM_TRIGGER_NODE_TYPE,
-	WAIT_NODE_TYPE,
-	WORKFLOW_LM_CHAT_MODAL_KEY,
-} from '@/constants';
+import { CHAT_TRIGGER_NODE_TYPE, FORM_TRIGGER_NODE_TYPE, WAIT_NODE_TYPE } from '@/constants';
 
 import { useRootStore } from '@/stores/root.store';
 import { useUIStore } from '@/stores/ui.store';
@@ -55,7 +50,6 @@ export function useRunWorkflow(useRunWorkflowOpts: { router: ReturnType<typeof u
 	const uiStore = useUIStore();
 	const workflowsStore = useWorkflowsStore();
 	const executionsStore = useExecutionsStore();
-
 	// Starts to execute a workflow on server
 	async function runWorkflowApi(runData: IStartRunData): Promise<IExecutionPushResponse> {
 		if (!rootStore.pushConnectionActive) {
@@ -175,7 +169,7 @@ export function useRunWorkflow(useRunWorkflowOpts: { router: ReturnType<typeof u
 					// If the chat node has no input data or pin data, open the chat modal
 					// and halt the execution
 					if (!chatHasInputData && !chatHasPinData) {
-						uiStore.openModal(WORKFLOW_LM_CHAT_MODAL_KEY);
+						workflowsStore.setPanelOpen('chat', true);
 						return;
 					}
 				}
diff --git a/packages/editor-ui/src/composables/useToast.ts b/packages/editor-ui/src/composables/useToast.ts
index 04bf24700c..365a72e3fe 100644
--- a/packages/editor-ui/src/composables/useToast.ts
+++ b/packages/editor-ui/src/composables/useToast.ts
@@ -10,6 +10,7 @@ import { useExternalHooks } from './useExternalHooks';
 import { VIEWS } from '@/constants';
 import type { ApplicationError } from 'n8n-workflow';
 import { useStyles } from './useStyles';
+import { useCanvasStore } from '@/stores/canvas.store';
 import { useSettingsStore } from '@/stores/settings.store';
 
 export interface NotificationErrorWithNodeAndDescription extends ApplicationError {
@@ -29,12 +30,13 @@ export function useToast() {
 	const i18n = useI18n();
 	const settingsStore = useSettingsStore();
 	const { APP_Z_INDEXES } = useStyles();
+	const canvasStore = useCanvasStore();
 
 	const messageDefaults: Partial<Omit<NotificationOptions, 'message'>> = {
 		dangerouslyUseHTMLString: false,
 		position: 'bottom-right',
 		zIndex: APP_Z_INDEXES.TOASTS, // above NDV and modal overlays
-		offset: settingsStore.isAiAssistantEnabled ? 64 : 0,
+		offset: settingsStore.isAiAssistantEnabled || workflowsStore.isChatPanelOpen ? 64 : 0,
 		appendTo: '#app-grid',
 		customClass: 'content-toast',
 	};
@@ -43,6 +45,8 @@ export function useToast() {
 		const { message, title } = messageData;
 		const params = { ...messageDefaults, ...messageData };
 
+		params.offset = +canvasStore.panelHeight;
+
 		if (typeof message === 'string') {
 			params.message = sanitizeHtml(message);
 		}
diff --git a/packages/editor-ui/src/constants.ts b/packages/editor-ui/src/constants.ts
index 325a6737fc..0d70e156c2 100644
--- a/packages/editor-ui/src/constants.ts
+++ b/packages/editor-ui/src/constants.ts
@@ -51,7 +51,6 @@ export const TAGS_MANAGER_MODAL_KEY = 'tagsManager';
 export const ANNOTATION_TAGS_MANAGER_MODAL_KEY = 'annotationTagsManager';
 export const VERSIONS_MODAL_KEY = 'versions';
 export const WORKFLOW_SETTINGS_MODAL_KEY = 'settings';
-export const WORKFLOW_LM_CHAT_MODAL_KEY = 'lmChat';
 export const WORKFLOW_SHARE_MODAL_KEY = 'workflowShare';
 export const PERSONALIZATION_MODAL_KEY = 'personalization';
 export const CONTACT_PROMPT_MODAL_KEY = 'contactPrompt';
diff --git a/packages/editor-ui/src/plugins/i18n/locales/en.json b/packages/editor-ui/src/plugins/i18n/locales/en.json
index 2b6f03cb2b..ca342147fc 100644
--- a/packages/editor-ui/src/plugins/i18n/locales/en.json
+++ b/packages/editor-ui/src/plugins/i18n/locales/en.json
@@ -169,11 +169,13 @@
 	"binaryDataDisplay.backToOverviewPage": "Back to overview page",
 	"binaryDataDisplay.noDataFoundToDisplay": "No data found to display",
 	"binaryDataDisplay.yourBrowserDoesNotSupport": "Your browser does not support the video element. Kindly update it to latest version.",
-	"chat.window.title": "Chat Window ({nodeName})",
-	"chat.window.logs": "Log (for last message)",
+	"chat.window.title": "Chat",
+	"chat.window.logs": "Latest Logs",
+	"chat.window.logsFromNode": "from {nodeName} node",
 	"chat.window.noChatNode": "No Chat Node",
 	"chat.window.noExecution": "Nothing got executed yet",
 	"chat.window.chat.placeholder": "Type a message, or press ‘up’ arrow for previous one",
+	"chat.window.chat.placeholderPristine": "Type a message",
 	"chat.window.chat.sendButtonText": "Send",
 	"chat.window.chat.provideMessage": "Please provide a message",
 	"chat.window.chat.emptyChatMessage": "Empty chat message",
@@ -185,6 +187,10 @@
 	"chat.window.chat.unpinAndExecute.confirm": "Unpin and send",
 	"chat.window.chat.unpinAndExecute.cancel": "Cancel",
 	"chat.window.chat.response.empty": "[No response. Make sure the last executed node outputs the content to display here]",
+	"chat.window.session.title": "Session",
+	"chat.window.session.reset.title": "Reset session?",
+	"chat.window.session.reset.warning": "This will clear all chat messages and the current execution data",
+	"chat.window.session.reset.confirm": "Reset",
 	"chatEmbed.infoTip.description": "Add chat to external applications using the n8n chat package.",
 	"chatEmbed.infoTip.link": "More info",
 	"chatEmbed.title": "Embed Chat in your website",
@@ -951,7 +957,8 @@
 	"ndv.input.disabled": "The '{nodeName}' node is disabled and won’t execute.",
 	"ndv.input.disabled.cta": "Enable it",
 	"ndv.output": "Output",
-	"ndv.output.ai.empty": "👈 This is {node}’s AI Logs. Click on a node to see the input it received and data it outputted.",
+	"ndv.output.ai.empty": "👈 Use these logs to see information on how the {node} node completed processing. You can click on a node to see the input it received and data it output.",
+	"ndv.output.ai.waiting": "Waiting for message",
 	"ndv.output.outType.logs": "Logs",
 	"ndv.output.outType.regular": "Output",
 	"ndv.output.edit": "Edit Output",
diff --git a/packages/editor-ui/src/router.ts b/packages/editor-ui/src/router.ts
index 8a22cdf2f7..1580a3bff4 100644
--- a/packages/editor-ui/src/router.ts
+++ b/packages/editor-ui/src/router.ts
@@ -24,6 +24,7 @@ const ErrorView = async () => await import('./views/ErrorView.vue');
 const ForgotMyPasswordView = async () => await import('./views/ForgotMyPasswordView.vue');
 const MainHeader = async () => await import('@/components/MainHeader/MainHeader.vue');
 const MainSidebar = async () => await import('@/components/MainSidebar.vue');
+const CanvasChat = async () => await import('@/components/CanvasChat/CanvasChat.vue');
 const NodeView = async () => await import('@/views/NodeViewSwitcher.vue');
 const WorkflowExecutionsView = async () => await import('@/views/WorkflowExecutionsView.vue');
 const WorkflowExecutionsLandingPage = async () =>
@@ -301,6 +302,7 @@ export const routes: RouteRecordRaw[] = [
 			default: NodeView,
 			header: MainHeader,
 			sidebar: MainSidebar,
+			footer: CanvasChat,
 		},
 		meta: {
 			nodeView: true,
@@ -333,6 +335,7 @@ export const routes: RouteRecordRaw[] = [
 			default: NodeView,
 			header: MainHeader,
 			sidebar: MainSidebar,
+			footer: CanvasChat,
 		},
 		meta: {
 			nodeView: true,
diff --git a/packages/editor-ui/src/stores/canvas.store.ts b/packages/editor-ui/src/stores/canvas.store.ts
index 252c06859e..b96699f297 100644
--- a/packages/editor-ui/src/stores/canvas.store.ts
+++ b/packages/editor-ui/src/stores/canvas.store.ts
@@ -54,8 +54,8 @@ export const useCanvasStore = defineStore('canvas', () => {
 	const jsPlumbInstanceRef = ref<BrowserJsPlumbInstance>();
 	const isDragging = ref<boolean>(false);
 	const lastSelectedConnection = ref<Connection>();
-
 	const newNodeInsertPosition = ref<XYPosition | null>(null);
+	const panelHeight = ref(0);
 
 	const nodes = computed<INodeUi[]>(() => workflowStore.allNodes);
 	const triggerNodes = computed<INodeUi[]>(() =>
@@ -109,9 +109,9 @@ export const useCanvasStore = defineStore('canvas', () => {
 		const manualTriggerNode = nodeTypesStore.getNodeType(MANUAL_TRIGGER_NODE_TYPE);
 
 		if (!manualTriggerNode) {
-			console.error('Could not find the manual trigger node');
 			return null;
 		}
+
 		return {
 			id: uuid(),
 			name: manualTriggerNode.defaults.name?.toString() ?? manualTriggerNode.displayName,
@@ -324,6 +324,10 @@ export const useCanvasStore = defineStore('canvas', () => {
 
 	watch(readOnlyEnv, setReadOnly);
 
+	function setPanelHeight(height: number) {
+		panelHeight.value = height;
+	}
+
 	return {
 		isDemo,
 		nodeViewScale,
@@ -333,6 +337,8 @@ export const useCanvasStore = defineStore('canvas', () => {
 		isLoading: loadingService.isLoading,
 		aiNodes,
 		lastSelectedConnection: lastSelectedConnectionComputed,
+		panelHeight: computed(() => panelHeight.value),
+		setPanelHeight,
 		setReadOnly,
 		setLastSelectedConnection,
 		startLoading: loadingService.startLoading,
diff --git a/packages/editor-ui/src/stores/ui.store.ts b/packages/editor-ui/src/stores/ui.store.ts
index 6a12495543..abd463d57e 100644
--- a/packages/editor-ui/src/stores/ui.store.ts
+++ b/packages/editor-ui/src/stores/ui.store.ts
@@ -23,7 +23,6 @@ import {
 	VERSIONS_MODAL_KEY,
 	VIEWS,
 	WORKFLOW_ACTIVE_MODAL_KEY,
-	WORKFLOW_LM_CHAT_MODAL_KEY,
 	WORKFLOW_SETTINGS_MODAL_KEY,
 	WORKFLOW_SHARE_MODAL_KEY,
 	EXTERNAL_SECRETS_PROVIDER_MODAL_KEY,
@@ -104,7 +103,6 @@ export const useUIStore = defineStore(STORES.UI, () => {
 				ANNOTATION_TAGS_MANAGER_MODAL_KEY,
 				NPS_SURVEY_MODAL_KEY,
 				VERSIONS_MODAL_KEY,
-				WORKFLOW_LM_CHAT_MODAL_KEY,
 				WORKFLOW_SETTINGS_MODAL_KEY,
 				WORKFLOW_SHARE_MODAL_KEY,
 				WORKFLOW_ACTIVE_MODAL_KEY,
diff --git a/packages/editor-ui/src/stores/workflows.store.ts b/packages/editor-ui/src/stores/workflows.store.ts
index 98a54ce1d1..c1b16f291b 100644
--- a/packages/editor-ui/src/stores/workflows.store.ts
+++ b/packages/editor-ui/src/stores/workflows.store.ts
@@ -139,6 +139,8 @@ export const useWorkflowsStore = defineStore(STORES.WORKFLOWS, () => {
 	const nodeMetadata = ref<NodeMetadataMap>({});
 	const isInDebugMode = ref(false);
 	const chatMessages = ref<string[]>([]);
+	const isChatPanelOpen = ref(false);
+	const isLogsPanelOpen = ref(false);
 
 	const workflowName = computed(() => workflow.value.name);
 
@@ -1123,6 +1125,11 @@ export const useWorkflowsStore = defineStore(STORES.WORKFLOWS, () => {
 		const { [node.name]: removedNodeMetadata, ...remainingNodeMetadata } = nodeMetadata.value;
 		nodeMetadata.value = remainingNodeMetadata;
 
+		// If chat trigger node is removed, close chat
+		if (node.type === CHAT_TRIGGER_NODE_TYPE) {
+			setPanelOpen('chat', false);
+		}
+
 		if (workflow.value.pinData && workflow.value.pinData.hasOwnProperty(node.name)) {
 			const { [node.name]: removedPinData, ...remainingPinData } = workflow.value.pinData;
 			workflow.value = {
@@ -1621,6 +1628,14 @@ export const useWorkflowsStore = defineStore(STORES.WORKFLOWS, () => {
 	// End Canvas V2 Functions
 	//
 
+	function setPanelOpen(panel: 'chat' | 'logs', isOpen: boolean) {
+		if (panel === 'chat') {
+			isChatPanelOpen.value = isOpen;
+		}
+		// Logs panel open/close is tied to the chat panel open/close
+		isLogsPanelOpen.value = isOpen;
+	}
+
 	return {
 		workflow,
 		usedCredentials,
@@ -1665,6 +1680,9 @@ export const useWorkflowsStore = defineStore(STORES.WORKFLOWS, () => {
 		getWorkflowExecution,
 		getTotalFinishedExecutionsCount,
 		getPastChatMessages,
+		isChatPanelOpen: computed(() => isChatPanelOpen.value),
+		isLogsPanelOpen: computed(() => isLogsPanelOpen.value),
+		setPanelOpen,
 		outgoingConnectionsByNodeName,
 		incomingConnectionsByNodeName,
 		nodeHasOutputConnection,
diff --git a/packages/editor-ui/src/views/NodeView.v2.vue b/packages/editor-ui/src/views/NodeView.v2.vue
index 8ce1e97941..3c2273d42a 100644
--- a/packages/editor-ui/src/views/NodeView.v2.vue
+++ b/packages/editor-ui/src/views/NodeView.v2.vue
@@ -60,7 +60,6 @@ import {
 	STICKY_NODE_TYPE,
 	VALID_WORKFLOW_IMPORT_URL_REGEX,
 	VIEWS,
-	WORKFLOW_LM_CHAT_MODAL_KEY,
 } from '@/constants';
 import { useSourceControlStore } from '@/stores/sourceControl.store';
 import { useNodeCreatorStore } from '@/stores/nodeCreator.store';
@@ -249,6 +248,8 @@ const keyBindingsEnabled = computed(() => {
 	return !ndvStore.activeNode && uiStore.activeModals.length === 0;
 });
 
+const isChatOpen = computed(() => workflowsStore.isChatPanelOpen);
+
 /**
  * Initialization
  */
@@ -1207,7 +1208,7 @@ const chatTriggerNodePinnedData = computed(() => {
 });
 
 async function onOpenChat() {
-	uiStore.openModal(WORKFLOW_LM_CHAT_MODAL_KEY);
+	workflowsStore.setPanelOpen('chat', !workflowsStore.isChatPanelOpen);
 
 	const payload = {
 		workflow_id: workflowId.value,
@@ -1633,7 +1634,11 @@ onBeforeUnmount(() => {
 				@mouseleave="onRunWorkflowButtonMouseLeave"
 				@click="onRunWorkflow"
 			/>
-			<CanvasChatButton v-if="containsChatTriggerNodes" @click="onOpenChat" />
+			<CanvasChatButton
+				v-if="containsChatTriggerNodes"
+				:outline="isChatOpen === false"
+				@click="onOpenChat"
+			/>
 			<CanvasStopCurrentExecutionButton
 				v-if="isStopExecutionButtonVisible"
 				:stopping="isStoppingExecution"
diff --git a/packages/editor-ui/src/views/NodeView.vue b/packages/editor-ui/src/views/NodeView.vue
index 9c1b1f3be6..39d5a7c672 100644
--- a/packages/editor-ui/src/views/NodeView.vue
+++ b/packages/editor-ui/src/views/NodeView.vue
@@ -34,7 +34,6 @@ import {
 	NODE_CREATOR_OPEN_SOURCES,
 	CHAT_TRIGGER_NODE_TYPE,
 	MANUAL_CHAT_TRIGGER_NODE_TYPE,
-	WORKFLOW_LM_CHAT_MODAL_KEY,
 	AI_NODE_CREATOR_VIEW,
 	DRAG_EVENT_DATA_KEY,
 	UPDATE_WEBHOOK_ID_NODE_TYPES,
@@ -455,14 +454,14 @@ export default defineComponent({
 				)
 			);
 		},
+		canvasChatNode() {
+			return this.nodes.find((node) => node.type === CHAT_TRIGGER_NODE_TYPE);
+		},
 		isManualChatOnly(): boolean {
 			if (!this.canvasChatNode) return false;
 
 			return this.containsChatNodes && this.triggerNodes.length === 1 && !this.pinnedChatNodeData;
 		},
-		canvasChatNode() {
-			return this.nodes.find((node) => node.type === CHAT_TRIGGER_NODE_TYPE);
-		},
 		pinnedChatNodeData() {
 			if (!this.canvasChatNode) return null;
 
@@ -513,6 +512,9 @@ export default defineComponent({
 				: (this.projectsStore.currentProject ?? this.projectsStore.personalProject);
 			return getResourcePermissions(project?.scopes);
 		},
+		isChatOpen() {
+			return this.workflowsStore.isChatPanelOpen;
+		},
 	},
 	watch: {
 		// Listen to route changes and load the workflow accordingly
@@ -863,7 +865,7 @@ export default defineComponent({
 			};
 			this.$telemetry.track('User clicked chat open button', telemetryPayload);
 			void this.externalHooks.run('nodeView.onOpenChat', telemetryPayload);
-			this.uiStore.openModal(WORKFLOW_LM_CHAT_MODAL_KEY);
+			this.workflowsStore.setPanelOpen('chat', !this.workflowsStore.isChatPanelOpen);
 		},
 
 		async onRunWorkflow() {
@@ -4651,6 +4653,7 @@ export default defineComponent({
 					size="large"
 					icon="comment"
 					type="primary"
+					:outline="isChatOpen === false"
 					data-test-id="workflow-chat-button"
 					@click.stop="onOpenChat"
 				/>

From 770230fbfe0b9e86527254e201c4602fbced94ff Mon Sep 17 00:00:00 2001
From: Elias Meire <elias@meire.dev>
Date: Wed, 13 Nov 2024 11:44:16 +0100
Subject: [PATCH 03/19] fix(Google Drive Node): Fix file upload for streams
 (#11698)

---
 .../Drive/test/v2/node/file/upload.test.ts    | 72 +++++++++++++++++--
 .../Google/Drive/test/v2/node/helpers.ts      | 23 ++++++
 .../Drive/v2/actions/file/upload.operation.ts | 13 ++--
 .../nodes/Google/Drive/v2/helpers/utils.ts    | 26 +++++++
 4 files changed, 122 insertions(+), 12 deletions(-)

diff --git a/packages/nodes-base/nodes/Google/Drive/test/v2/node/file/upload.test.ts b/packages/nodes-base/nodes/Google/Drive/test/v2/node/file/upload.test.ts
index 1eadf887fd..80446db6ce 100644
--- a/packages/nodes-base/nodes/Google/Drive/test/v2/node/file/upload.test.ts
+++ b/packages/nodes-base/nodes/Google/Drive/test/v2/node/file/upload.test.ts
@@ -6,7 +6,7 @@ import * as upload from '../../../../v2/actions/file/upload.operation';
 import * as transport from '../../../../v2/transport';
 import * as utils from '../../../../v2/helpers/utils';
 
-import { createMockExecuteFunction, driveNode } from '../helpers';
+import { createMockExecuteFunction, createTestStream, driveNode } from '../helpers';
 
 jest.mock('../../../../v2/transport', () => {
 	const originalModule = jest.requireActual('../../../../v2/transport');
@@ -30,7 +30,7 @@ jest.mock('../../../../v2/helpers/utils', () => {
 		getItemBinaryData: jest.fn(async function () {
 			return {
 				contentLength: '123',
-				fileContent: 'Hello Drive!',
+				fileContent: Buffer.from('Hello Drive!'),
 				originalFilename: 'original.txt',
 				mimeType: 'text/plain',
 			};
@@ -43,13 +43,17 @@ describe('test GoogleDriveV2: file upload', () => {
 		nock.disableNetConnect();
 	});
 
+	beforeEach(() => {
+		jest.clearAllMocks();
+	});
+
 	afterAll(() => {
 		nock.restore();
 		jest.unmock('../../../../v2/transport');
 		jest.unmock('../../../../v2/helpers/utils');
 	});
 
-	it('should be called with', async () => {
+	it('should upload buffers', async () => {
 		const nodeParameters = {
 			name: 'newFile.txt',
 			folderId: {
@@ -73,10 +77,10 @@ describe('test GoogleDriveV2: file upload', () => {
 		expect(transport.googleApiRequest).toHaveBeenCalledWith(
 			'POST',
 			'/upload/drive/v3/files',
+			expect.any(Buffer),
+			{ uploadType: 'media' },
 			undefined,
-			{ uploadType: 'resumable' },
-			undefined,
-			{ returnFullResponse: true },
+			{ headers: { 'Content-Length': '123', 'Content-Type': 'text/plain' } },
 		);
 		expect(transport.googleApiRequest).toHaveBeenCalledWith(
 			'PATCH',
@@ -94,4 +98,60 @@ describe('test GoogleDriveV2: file upload', () => {
 		expect(utils.getItemBinaryData).toBeCalledTimes(1);
 		expect(utils.getItemBinaryData).toHaveBeenCalled();
 	});
+
+	it('should stream large files in 2MB chunks', async () => {
+		const nodeParameters = {
+			name: 'newFile.jpg',
+			folderId: {
+				__rl: true,
+				value: 'folderIDxxxxxx',
+				mode: 'list',
+				cachedResultName: 'testFolder 3',
+				cachedResultUrl: 'https://drive.google.com/drive/folders/folderIDxxxxxx',
+			},
+			options: {
+				simplifyOutput: true,
+			},
+		};
+
+		const fakeExecuteFunction = createMockExecuteFunction(nodeParameters, driveNode);
+		const httpRequestSpy = jest.spyOn(fakeExecuteFunction.helpers, 'httpRequest');
+
+		const fileSize = 7 * 1024 * 1024; // 7MB
+		jest.mocked(utils.getItemBinaryData).mockResolvedValue({
+			mimeType: 'image/jpg',
+			originalFilename: 'test.jpg',
+			contentLength: fileSize,
+			fileContent: createTestStream(fileSize),
+		});
+
+		await upload.execute.call(fakeExecuteFunction, 0);
+
+		// 4 chunks: 7MB = 3x2MB + 1x1MB
+		expect(httpRequestSpy).toHaveBeenCalledTimes(4);
+		expect(httpRequestSpy).toHaveBeenCalledWith(
+			expect.objectContaining({ body: expect.any(Buffer) }),
+		);
+		expect(transport.googleApiRequest).toBeCalledTimes(2);
+		expect(transport.googleApiRequest).toHaveBeenCalledWith(
+			'POST',
+			'/upload/drive/v3/files',
+			undefined,
+			{ uploadType: 'resumable' },
+			undefined,
+			{ returnFullResponse: true },
+		);
+		expect(transport.googleApiRequest).toHaveBeenCalledWith(
+			'PATCH',
+			'/drive/v3/files/undefined',
+			{ mimeType: 'image/jpg', name: 'newFile.jpg', originalFilename: 'test.jpg' },
+			{
+				addParents: 'folderIDxxxxxx',
+				supportsAllDrives: true,
+				corpora: 'allDrives',
+				includeItemsFromAllDrives: true,
+				spaces: 'appDataFolder, drive',
+			},
+		);
+	});
 });
diff --git a/packages/nodes-base/nodes/Google/Drive/test/v2/node/helpers.ts b/packages/nodes-base/nodes/Google/Drive/test/v2/node/helpers.ts
index b04a33e2e2..522f28afdb 100644
--- a/packages/nodes-base/nodes/Google/Drive/test/v2/node/helpers.ts
+++ b/packages/nodes-base/nodes/Google/Drive/test/v2/node/helpers.ts
@@ -2,6 +2,7 @@ import type { IDataObject, IExecuteFunctions, IGetNodeParameterOptions, INode }
 
 import { get } from 'lodash';
 import { constructExecutionMetaData, returnJsonArray } from 'n8n-core';
+import { Readable } from 'stream';
 
 export const driveNode: INode = {
 	id: '11',
@@ -40,3 +41,25 @@ export const createMockExecuteFunction = (
 	} as unknown as IExecuteFunctions;
 	return fakeExecuteFunction;
 };
+
+export function createTestStream(byteSize: number) {
+	let bytesSent = 0;
+	const CHUNK_SIZE = 64 * 1024; // 64kB chunks (default NodeJS highWaterMark)
+
+	return new Readable({
+		read() {
+			const remainingBytes = byteSize - bytesSent;
+
+			if (remainingBytes <= 0) {
+				this.push(null);
+				return;
+			}
+
+			const chunkSize = Math.min(CHUNK_SIZE, remainingBytes);
+			const chunk = Buffer.alloc(chunkSize, 'A'); // Test data just a string of "A"
+
+			bytesSent += chunkSize;
+			this.push(chunk);
+		},
+	});
+}
diff --git a/packages/nodes-base/nodes/Google/Drive/v2/actions/file/upload.operation.ts b/packages/nodes-base/nodes/Google/Drive/v2/actions/file/upload.operation.ts
index da4ca39016..f81dc3478e 100644
--- a/packages/nodes-base/nodes/Google/Drive/v2/actions/file/upload.operation.ts
+++ b/packages/nodes-base/nodes/Google/Drive/v2/actions/file/upload.operation.ts
@@ -12,6 +12,7 @@ import {
 	setFileProperties,
 	setUpdateCommonParams,
 	setParentFolder,
+	processInChunks,
 } from '../../helpers/utils';
 import { updateDisplayOptions } from '@utils/utilities';
 
@@ -129,16 +130,17 @@ export async function execute(this: IExecuteFunctions, i: number): Promise<INode
 
 		const uploadUrl = resumableUpload.headers.location;
 
-		let offset = 0;
-		for await (const chunk of fileContent) {
-			const nextOffset = offset + Number(chunk.length);
+		// 2MB chunks, needs to be a multiple of 256kB for Google Drive API
+		const chunkSizeBytes = 2048 * 1024;
+
+		await processInChunks(fileContent, chunkSizeBytes, async (chunk, offset) => {
 			try {
 				const response = await this.helpers.httpRequest({
 					method: 'PUT',
 					url: uploadUrl,
 					headers: {
 						'Content-Length': chunk.length,
-						'Content-Range': `bytes ${offset}-${nextOffset - 1}/${contentLength}`,
+						'Content-Range': `bytes ${offset}-${offset + chunk.byteLength - 1}/${contentLength}`,
 					},
 					body: chunk,
 				});
@@ -146,8 +148,7 @@ export async function execute(this: IExecuteFunctions, i: number): Promise<INode
 			} catch (error) {
 				if (error.response?.status !== 308) throw error;
 			}
-			offset = nextOffset;
-		}
+		});
 	}
 
 	const options = this.getNodeParameter('options', i, {});
diff --git a/packages/nodes-base/nodes/Google/Drive/v2/helpers/utils.ts b/packages/nodes-base/nodes/Google/Drive/v2/helpers/utils.ts
index 62f029931d..a31f85beeb 100644
--- a/packages/nodes-base/nodes/Google/Drive/v2/helpers/utils.ts
+++ b/packages/nodes-base/nodes/Google/Drive/v2/helpers/utils.ts
@@ -131,3 +131,29 @@ export function setParentFolder(
 		return 'root';
 	}
 }
+
+export async function processInChunks(
+	stream: Readable,
+	chunkSize: number,
+	process: (chunk: Buffer, offset: number) => void | Promise<void>,
+) {
+	let buffer = Buffer.alloc(0);
+	let offset = 0;
+
+	for await (const chunk of stream) {
+		buffer = Buffer.concat([buffer, chunk]);
+
+		while (buffer.length >= chunkSize) {
+			const chunkToProcess = buffer.subarray(0, chunkSize);
+			await process(chunkToProcess, offset);
+
+			buffer = buffer.subarray(chunkSize);
+			offset += chunkSize;
+		}
+	}
+
+	// Process last chunk, could be smaller than chunkSize
+	if (buffer.length > 0) {
+		await process(buffer, offset);
+	}
+}

From 40ade151724f4af28a6ed959fd9363450ea711fd Mon Sep 17 00:00:00 2001
From: Eugene <eugene@n8n.io>
Date: Wed, 13 Nov 2024 12:07:01 +0100
Subject: [PATCH 04/19] fix(In-Memory Vector Store Node): Fix displaying
 execution data of connected embedding nodes (#11701)

---
 .../VectorStoreInMemory.node.ts               |  2 +-
 .../shared/MemoryVectorStoreManager.test.ts   | 44 +++++++++++++++++++
 .../shared/MemoryVectorStoreManager.ts        |  9 ++++
 3 files changed, 54 insertions(+), 1 deletion(-)
 create mode 100644 packages/@n8n/nodes-langchain/nodes/vector_store/shared/MemoryVectorStoreManager.test.ts

diff --git a/packages/@n8n/nodes-langchain/nodes/vector_store/VectorStoreInMemory/VectorStoreInMemory.node.ts b/packages/@n8n/nodes-langchain/nodes/vector_store/VectorStoreInMemory/VectorStoreInMemory.node.ts
index cbd2cef75a..5508f957f8 100644
--- a/packages/@n8n/nodes-langchain/nodes/vector_store/VectorStoreInMemory/VectorStoreInMemory.node.ts
+++ b/packages/@n8n/nodes-langchain/nodes/vector_store/VectorStoreInMemory/VectorStoreInMemory.node.ts
@@ -54,6 +54,6 @@ export class VectorStoreInMemory extends createVectorStoreNode({
 		const workflowId = context.getWorkflow().id;
 		const vectorStoreInstance = MemoryVectorStoreManager.getInstance(embeddings);
 
-		void vectorStoreInstance.addDocuments(`${workflowId}__${memoryKey}`, documents, clearStore);
+		await vectorStoreInstance.addDocuments(`${workflowId}__${memoryKey}`, documents, clearStore);
 	},
 }) {}
diff --git a/packages/@n8n/nodes-langchain/nodes/vector_store/shared/MemoryVectorStoreManager.test.ts b/packages/@n8n/nodes-langchain/nodes/vector_store/shared/MemoryVectorStoreManager.test.ts
new file mode 100644
index 0000000000..6229868f32
--- /dev/null
+++ b/packages/@n8n/nodes-langchain/nodes/vector_store/shared/MemoryVectorStoreManager.test.ts
@@ -0,0 +1,44 @@
+import type { OpenAIEmbeddings } from '@langchain/openai';
+
+import { MemoryVectorStoreManager } from './MemoryVectorStoreManager';
+import { mock } from 'jest-mock-extended';
+
+describe('MemoryVectorStoreManager', () => {
+	it('should create an instance of MemoryVectorStoreManager', () => {
+		const embeddings = mock<OpenAIEmbeddings>();
+
+		const instance = MemoryVectorStoreManager.getInstance(embeddings);
+		expect(instance).toBeInstanceOf(MemoryVectorStoreManager);
+	});
+
+	it('should return existing instance', () => {
+		const embeddings = mock<OpenAIEmbeddings>();
+
+		const instance1 = MemoryVectorStoreManager.getInstance(embeddings);
+		const instance2 = MemoryVectorStoreManager.getInstance(embeddings);
+		expect(instance1).toBe(instance2);
+	});
+
+	it('should update embeddings in existing instance', () => {
+		const embeddings1 = mock<OpenAIEmbeddings>();
+		const embeddings2 = mock<OpenAIEmbeddings>();
+
+		const instance = MemoryVectorStoreManager.getInstance(embeddings1);
+		MemoryVectorStoreManager.getInstance(embeddings2);
+
+		expect((instance as any).embeddings).toBe(embeddings2);
+	});
+
+	it('should update embeddings in existing vector store instances', async () => {
+		const embeddings1 = mock<OpenAIEmbeddings>();
+		const embeddings2 = mock<OpenAIEmbeddings>();
+
+		const instance1 = MemoryVectorStoreManager.getInstance(embeddings1);
+		await instance1.getVectorStore('test');
+
+		const instance2 = MemoryVectorStoreManager.getInstance(embeddings2);
+		const vectorStoreInstance2 = await instance2.getVectorStore('test');
+
+		expect((vectorStoreInstance2 as any).embeddings).toBe(embeddings2);
+	});
+});
diff --git a/packages/@n8n/nodes-langchain/nodes/vector_store/shared/MemoryVectorStoreManager.ts b/packages/@n8n/nodes-langchain/nodes/vector_store/shared/MemoryVectorStoreManager.ts
index 1076fb93ba..5c507a5196 100644
--- a/packages/@n8n/nodes-langchain/nodes/vector_store/shared/MemoryVectorStoreManager.ts
+++ b/packages/@n8n/nodes-langchain/nodes/vector_store/shared/MemoryVectorStoreManager.ts
@@ -14,7 +14,16 @@ export class MemoryVectorStoreManager {
 	public static getInstance(embeddings: Embeddings): MemoryVectorStoreManager {
 		if (!MemoryVectorStoreManager.instance) {
 			MemoryVectorStoreManager.instance = new MemoryVectorStoreManager(embeddings);
+		} else {
+			// We need to update the embeddings in the existing instance.
+			// This is important as embeddings instance is wrapped in a logWrapper,
+			// which relies on supplyDataFunctions context which changes on each workflow run
+			MemoryVectorStoreManager.instance.embeddings = embeddings;
+			MemoryVectorStoreManager.instance.vectorStoreBuffer.forEach((vectorStoreInstance) => {
+				vectorStoreInstance.embeddings = embeddings;
+			});
 		}
+
 		return MemoryVectorStoreManager.instance;
 	}
 

From 94b5873248212a5500f02cf3c0d74df6f9d8fb26 Mon Sep 17 00:00:00 2001
From: Michael Kret <88898367+michael-radency@users.noreply.github.com>
Date: Wed, 13 Nov 2024 13:08:56 +0200
Subject: [PATCH 05/19] fix(n8n Form Node): Trigger page stack in waiting if
 error in workflow (#11671)

---
 packages/cli/src/response-helper.ts           |  8 ++
 .../cli/templates/form-trigger-409.handlebars | 74 +++++++++++++++++++
 2 files changed, 82 insertions(+)
 create mode 100644 packages/cli/templates/form-trigger-409.handlebars

diff --git a/packages/cli/src/response-helper.ts b/packages/cli/src/response-helper.ts
index 0dff1625cb..2b993c266c 100644
--- a/packages/cli/src/response-helper.ts
+++ b/packages/cli/src/response-helper.ts
@@ -103,6 +103,14 @@ export function sendErrorResponse(res: Response, error: Error) {
 			}
 		}
 
+		if (error.errorCode === 409 && originalUrl && originalUrl.includes('form-waiting')) {
+			//codes other than 200  breaks redirection to form-waiting page from form trigger
+			//render form page instead of json
+			return res.render('form-trigger-409', {
+				message: error.message,
+			});
+		}
+
 		httpStatusCode = error.httpStatusCode;
 
 		if (error.errorCode) {
diff --git a/packages/cli/templates/form-trigger-409.handlebars b/packages/cli/templates/form-trigger-409.handlebars
new file mode 100644
index 0000000000..6f34e5080d
--- /dev/null
+++ b/packages/cli/templates/form-trigger-409.handlebars
@@ -0,0 +1,74 @@
+<html lang='en'>
+
+	<head>
+		<meta charset='UTF-8' />
+		<meta name='viewport' content='width=device-width, initial-scale=1.0' />
+		<link rel='icon' type='image/png' href='https://n8n.io/favicon.ico' />
+		<link
+			href='http://fonts.googleapis.com/css?family=Open+Sans'
+			rel='stylesheet'
+			type='text/css'
+		/>
+		<title>Problem loading form</title>
+		<style>
+			*, ::after, ::before { box-sizing: border-box; margin: 0; padding: 0; } body { font-family:
+			Open Sans, sans-serif; font-weight: 400; font-size: 12px; display: flex; flex-direction:
+			column; justify-content: start; background-color: #FBFCFE; } .container { margin: auto;
+			text-align: center; padding-top: 24px; width: 448px; } .card { padding: 24px;
+			background-color: white; border: 1px solid #DBDFE7; border-radius: 8px; box-shadow: 0px 4px
+			16px 0px #634DFF0F; margin-bottom: 16px; } .n8n-link a { color: #7E8186; font-weight: 600;
+			font-size: 12px; text-decoration: none; } .n8n-link svg { display: inline-block;
+			vertical-align: middle; } .header h1 { color: #525356; font-size: 20px; font-weight: 400;
+			padding-bottom: 8px; } .header p { color: #7E8186; font-size: 14px; font-weight: 400; }
+		</style>
+	</head>
+
+	<body>
+		<div class='container'>
+			<section>
+				<div class='card'>
+					<div class='header'>
+						<h1>Problem loading form</h1>
+						<p>{{message}}</p>
+					</div>
+				</div>
+				<div class='n8n-link'>
+					<a
+						href='https://n8n.io/?utm_source=n8n-internal&amp;utm_medium=form-trigger&amp'
+						target='_blank'
+					>
+						Form automated with
+						<svg
+							width='73'
+							height='20'
+							viewBox='0 0 73 20'
+							fill='none'
+							xmlns='http://www.w3.org/2000/svg'
+						>
+							<path
+								fill-rule='evenodd'
+								clip-rule='evenodd'
+								d='M40.2373 4C40.2373 6.20915 38.4464 8 36.2373 8C34.3735 8 32.8074 6.72525 32.3633 5H26.7787C25.801 5 24.9666 5.70685 24.8059 6.6712L24.6415 7.6576C24.4854 8.59415 24.0116 9.40925 23.3417 10C24.0116 10.5907 24.4854 11.4058 24.6415 12.3424L24.8059 13.3288C24.9666 14.2931 25.801 15 26.7787 15H28.3633C28.8074 13.2747 30.3735 12 32.2373 12C34.4464 12 36.2373 13.7908 36.2373 16C36.2373 18.2092 34.4464 20 32.2373 20C30.3735 20 28.8074 18.7253 28.3633 17H26.7787C24.8233 17 23.1546 15.5864 22.8331 13.6576L22.6687 12.6712C22.508 11.7069 21.6736 11 20.6959 11H19.0645C18.5652 12.64 17.0406 13.8334 15.2373 13.8334C13.434 13.8334 11.9094 12.64 11.4101 11H9.06449C8.56519 12.64 7.04059 13.8334 5.2373 13.8334C3.02817 13.8334 1.2373 12.0424 1.2373 9.83335C1.2373 7.6242 3.02817 5.83335 5.2373 5.83335C7.16069 5.83335 8.76699 7.19085 9.15039 9H11.3242C11.7076 7.19085 13.3139 5.83335 15.2373 5.83335C17.1607 5.83335 18.767 7.19085 19.1504 9H20.6959C21.6736 9 22.508 8.29315 22.6687 7.3288L22.8331 6.3424C23.1546 4.41365 24.8233 3 26.7787 3H32.3633C32.8074 1.27478 34.3735 0 36.2373 0C38.4464 0 40.2373 1.79086 40.2373 4ZM38.2373 4C38.2373 5.10455 37.3419 6 36.2373 6C35.1327 6 34.2373 5.10455 34.2373 4C34.2373 2.89543 35.1327 2 36.2373 2C37.3419 2 38.2373 2.89543 38.2373 4ZM5.2373 11.8334C6.34189 11.8334 7.23729 10.9379 7.23729 9.83335C7.23729 8.72875 6.34189 7.83335 5.2373 7.83335C4.13273 7.83335 3.2373 8.72875 3.2373 9.83335C3.2373 10.9379 4.13273 11.8334 5.2373 11.8334ZM15.2373 11.8334C16.3419 11.8334 17.2373 10.9379 17.2373 9.83335C17.2373 8.72875 16.3419 7.83335 15.2373 7.83335C14.1327 7.83335 13.2373 8.72875 13.2373 9.83335C13.2373 10.9379 14.1327 11.8334 15.2373 11.8334ZM32.2373 18C33.3419 18 34.2373 17.1045 34.2373 16C34.2373 14.8954 33.3419 14 32.2373 14C31.1327 14 30.2373 14.8954 30.2373 16C30.2373 17.1045 31.1327 18 32.2373 18Z'
+								fill='#EA4B71'
+							></path>
+							<path
+								d='M44.2393 15.0007H46.3277V10.5791C46.3277 9.12704 47.2088 8.49074 48.204 8.49074C49.183 8.49074 49.9498 9.14334 49.9498 10.4812V15.0007H52.038V10.057C52.038 7.91969 50.798 6.67969 48.8567 6.67969C47.633 6.67969 46.9477 7.16914 46.4582 7.80544H46.3277L46.1482 6.84284H44.2393V15.0007Z'
+								fill='#101330'
+							></path>
+							<path
+								d='M60.0318 9.50205V9.40415C60.7498 9.0452 61.4678 8.4252 61.4678 7.20155C61.4678 5.43945 60.0153 4.37891 58.0088 4.37891C55.9528 4.37891 54.4843 5.5047 54.4843 7.23415C54.4843 8.4089 55.1698 9.0452 55.9203 9.40415V9.50205C55.0883 9.79575 54.0928 10.6768 54.0928 12.1452C54.0928 13.9237 55.5613 15.1637 57.9923 15.1637C60.4233 15.1637 61.8428 13.9237 61.8428 12.1452C61.8428 10.6768 60.8638 9.81205 60.0318 9.50205ZM57.9923 5.87995C58.8083 5.87995 59.4118 6.40205 59.4118 7.2831C59.4118 8.16415 58.7918 8.6863 57.9923 8.6863C57.1928 8.6863 56.5238 8.16415 56.5238 7.2831C56.5238 6.38575 57.1603 5.87995 57.9923 5.87995ZM57.9923 13.5974C57.0458 13.5974 56.2793 12.9937 56.2793 11.9658C56.2793 11.0358 56.9153 10.3342 57.9758 10.3342C59.0203 10.3342 59.6568 11.0195 59.6568 11.9984C59.6568 12.9937 58.9223 13.5974 57.9923 13.5974Z'
+								fill='#101330'
+							></path>
+							<path
+								d='M63.9639 15.0007H66.0524V10.5791C66.0524 9.12704 66.9334 8.49074 67.9289 8.49074C68.9079 8.49074 69.6744 9.14334 69.6744 10.4812V15.0007H71.7629V10.057C71.7629 7.91969 70.5229 6.67969 68.5814 6.67969C67.3579 6.67969 66.6724 7.16914 66.1829 7.80544H66.0524L65.8729 6.84284H63.9639V15.0007Z'
+								fill='#101330'
+							></path>
+						</svg>
+
+					</a>
+				</div>
+			</section>
+		</div>
+	</body>
+
+</html>
\ No newline at end of file

From f0492bd3bb0d94802a2707fb1cf861313b6ea808 Mon Sep 17 00:00:00 2001
From: Michael Kret <88898367+michael-radency@users.noreply.github.com>
Date: Wed, 13 Nov 2024 13:13:50 +0200
Subject: [PATCH 06/19] fix(n8n Form Node): Open form page if form trigger has
 pin data (#11673)

---
 packages/editor-ui/src/composables/useRunWorkflow.ts | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/editor-ui/src/composables/useRunWorkflow.ts b/packages/editor-ui/src/composables/useRunWorkflow.ts
index a944a93348..4b755e7749 100644
--- a/packages/editor-ui/src/composables/useRunWorkflow.ts
+++ b/packages/editor-ui/src/composables/useRunWorkflow.ts
@@ -353,7 +353,10 @@ export function useRunWorkflow(useRunWorkflowOpts: { router: ReturnType<typeof u
 
 		let isFormShown =
 			!options.destinationNode &&
-			workflowsStore.allNodes.some((node) => node.type === FORM_TRIGGER_NODE_TYPE);
+			workflowsStore.allNodes.some(
+				(node) =>
+					node.type === FORM_TRIGGER_NODE_TYPE && !workflowsStore?.pinnedWorkflowData?.[node.name],
+			);
 
 		const resolveWaitingNodesData = async (): Promise<void> => {
 			return await new Promise<void>((resolve) => {

From 9bd79fceebc4453d0fe40ae5f628d5e31ff2b326 Mon Sep 17 00:00:00 2001
From: Michael Kret <88898367+michael-radency@users.noreply.github.com>
Date: Wed, 13 Nov 2024 13:30:56 +0200
Subject: [PATCH 07/19] fix(Switch Node): Maintain output connections (#11162)

---
 cypress/e2e/5-ndv.cy.ts                       |   2 +-
 .../editor-ui/src/components/NodeSettings.vue |  31 ++--
 .../editor-ui/src/stores/workflows.store.ts   |   6 +-
 .../src/utils/nodeSettingsUtils.test.ts       | 162 ++++++++++++++++++
 .../editor-ui/src/utils/nodeSettingsUtils.ts  | 133 ++++++++++++++
 5 files changed, 311 insertions(+), 23 deletions(-)
 create mode 100644 packages/editor-ui/src/utils/nodeSettingsUtils.test.ts
 create mode 100644 packages/editor-ui/src/utils/nodeSettingsUtils.ts

diff --git a/cypress/e2e/5-ndv.cy.ts b/cypress/e2e/5-ndv.cy.ts
index 70a62bb244..96b917d4c3 100644
--- a/cypress/e2e/5-ndv.cy.ts
+++ b/cypress/e2e/5-ndv.cy.ts
@@ -81,7 +81,7 @@ describe('NDV', () => {
 		ndv.getters.backToCanvas().click();
 		workflowPage.actions.executeWorkflow();
 		workflowPage.actions.openNode('Merge');
-		ndv.getters.outputPanel().contains('1 item').should('exist');
+		ndv.getters.outputPanel().contains('2 items').should('exist');
 		cy.contains('span', 'zero').should('exist');
 	});
 
diff --git a/packages/editor-ui/src/components/NodeSettings.vue b/packages/editor-ui/src/components/NodeSettings.vue
index 0fb8f011c1..1d7eb03885 100644
--- a/packages/editor-ui/src/components/NodeSettings.vue
+++ b/packages/editor-ui/src/components/NodeSettings.vue
@@ -22,11 +22,7 @@ import type {
 	IUpdateInformation,
 } from '@/Interface';
 
-import {
-	COMMUNITY_NODES_INSTALLATION_DOCS_URL,
-	CUSTOM_NODES_DOCS_URL,
-	SHOULD_CLEAR_NODE_OUTPUTS,
-} from '@/constants';
+import { COMMUNITY_NODES_INSTALLATION_DOCS_URL, CUSTOM_NODES_DOCS_URL } from '@/constants';
 
 import NodeTitle from '@/components/NodeTitle.vue';
 import ParameterInputList from '@/components/ParameterInputList.vue';
@@ -47,11 +43,11 @@ import { useCredentialsStore } from '@/stores/credentials.store';
 import type { EventBus } from 'n8n-design-system';
 import { useExternalHooks } from '@/composables/useExternalHooks';
 import { useNodeHelpers } from '@/composables/useNodeHelpers';
-import { useToast } from '@/composables/useToast';
 import { useI18n } from '@/composables/useI18n';
 import { useTelemetry } from '@/composables/useTelemetry';
 import { importCurlEventBus, ndvEventBus } from '@/event-bus';
 import { ProjectTypes } from '@/types/projects.types';
+import { updateDynamicConnections } from '@/utils/nodeSettingsUtils';
 
 const props = withDefaults(
 	defineProps<{
@@ -94,7 +90,6 @@ const telemetry = useTelemetry();
 const nodeHelpers = useNodeHelpers();
 const externalHooks = useExternalHooks();
 const i18n = useI18n();
-const { showMessage } = useToast();
 
 const nodeValid = ref(true);
 const openPanel = ref<'params' | 'settings'>('params');
@@ -483,20 +478,6 @@ const valueChanged = (parameterData: IUpdateInformation) => {
 			return;
 		}
 
-		if (
-			parameterData.type &&
-			workflowsStore.nodeHasOutputConnection(_node.name) &&
-			SHOULD_CLEAR_NODE_OUTPUTS[nodeType.name]?.eventTypes.includes(parameterData.type) &&
-			SHOULD_CLEAR_NODE_OUTPUTS[nodeType.name]?.parameterPaths.includes(parameterData.name)
-		) {
-			workflowsStore.removeAllNodeConnection(_node, { preserveInputConnections: true });
-			showMessage({
-				type: 'warning',
-				title: i18n.baseText('nodeSettings.outputCleared.title'),
-				message: i18n.baseText('nodeSettings.outputCleared.message'),
-			});
-		}
-
 		// Get only the parameters which are different to the defaults
 		let nodeParameters = NodeHelpers.getNodeParameters(
 			nodeType.properties,
@@ -566,6 +547,14 @@ const valueChanged = (parameterData: IUpdateInformation) => {
 			value: nodeParameters,
 		};
 
+		const connections = workflowsStore.allConnections;
+
+		const updatedConnections = updateDynamicConnections(_node, connections, parameterData);
+
+		if (updatedConnections) {
+			workflowsStore.setConnections(updatedConnections, true);
+		}
+
 		workflowsStore.setNodeParameters(updateInformation);
 
 		void externalHooks.run('nodeSettings.valueChanged', {
diff --git a/packages/editor-ui/src/stores/workflows.store.ts b/packages/editor-ui/src/stores/workflows.store.ts
index c1b16f291b..a9305f23f2 100644
--- a/packages/editor-ui/src/stores/workflows.store.ts
+++ b/packages/editor-ui/src/stores/workflows.store.ts
@@ -1054,8 +1054,12 @@ export const useWorkflowsStore = defineStore(STORES.WORKFLOWS, () => {
 		}, {});
 	}
 
-	function setConnections(connections: IConnections): void {
+	function setConnections(connections: IConnections, updateWorkflow = false): void {
 		workflow.value.connections = connections;
+
+		if (updateWorkflow) {
+			updateCachedWorkflow();
+		}
 	}
 
 	function resetAllNodesIssues(): boolean {
diff --git a/packages/editor-ui/src/utils/nodeSettingsUtils.test.ts b/packages/editor-ui/src/utils/nodeSettingsUtils.test.ts
new file mode 100644
index 0000000000..a5b122b893
--- /dev/null
+++ b/packages/editor-ui/src/utils/nodeSettingsUtils.test.ts
@@ -0,0 +1,162 @@
+import { describe, it, expect, afterAll } from 'vitest';
+import { mock } from 'vitest-mock-extended';
+import type { IConnections, NodeParameterValueType } from 'n8n-workflow';
+import { updateDynamicConnections } from './nodeSettingsUtils';
+import { SWITCH_NODE_TYPE } from '@/constants';
+import type { INodeUi, IUpdateInformation } from '@/Interface';
+
+describe('updateDynamicConnections', () => {
+	afterAll(() => {
+		vi.clearAllMocks();
+	});
+	it('should remove extra outputs when the number of outputs decreases', () => {
+		const node = mock<INodeUi>({
+			name: 'TestNode',
+			type: SWITCH_NODE_TYPE,
+			parameters: { numberOutputs: 3 },
+		});
+
+		const connections = mock<IConnections>({
+			TestNode: {
+				main: [[{ node: 'Node1' }], [{ node: 'Node2' }], [{ node: 'Node3' }]],
+			},
+		});
+
+		const parameterData = mock<IUpdateInformation<number>>({
+			name: 'parameters.numberOutputs',
+			value: 2,
+		});
+
+		const updatedConnections = updateDynamicConnections(node, connections, parameterData);
+
+		expect(updatedConnections?.TestNode.main).toHaveLength(2);
+	});
+
+	it('should splice connections when a rule is removed', () => {
+		const node = mock<INodeUi>({
+			name: 'TestNode',
+			type: SWITCH_NODE_TYPE,
+			parameters: {
+				rules: { values: [{}, {}, {}] },
+				options: {},
+			},
+		});
+
+		const connections = mock<IConnections>({
+			TestNode: {
+				main: [[{ node: 'Node1' }], [{ node: 'Node2' }], [{ node: 'Node3' }]],
+			},
+		});
+
+		const parameterData = mock<IUpdateInformation<number>>({
+			name: 'parameters.rules.values[1]',
+			value: undefined,
+		});
+
+		const updatedConnections = updateDynamicConnections(node, connections, parameterData);
+
+		expect(updatedConnections?.TestNode.main).toHaveLength(2);
+		expect(updatedConnections?.TestNode.main[1][0].node).toEqual('Node3');
+	});
+
+	it('should handle fallbackOutput === "extra" and all rules removed', () => {
+		const node = mock<INodeUi>({
+			name: 'TestNode',
+			type: SWITCH_NODE_TYPE,
+			parameters: {
+				options: { fallbackOutput: 'extra' },
+			},
+		});
+
+		const connections = mock<IConnections>({
+			TestNode: {
+				main: [[{ node: 'Node1' }], [{ node: 'Node2' }], [{ node: 'Node3' }]],
+			},
+		});
+
+		const parameterData = mock<IUpdateInformation<number>>({
+			name: 'parameters.rules.values',
+			value: undefined,
+		});
+
+		const updatedConnections = updateDynamicConnections(node, connections, parameterData);
+
+		expect(updatedConnections?.TestNode.main).toHaveLength(1);
+		expect(updatedConnections?.TestNode.main[0][0].node).toEqual('Node3');
+	});
+
+	it('should add a new connection when a rule is added', () => {
+		const node = mock<INodeUi>({
+			name: 'TestNode',
+			type: SWITCH_NODE_TYPE,
+			parameters: {
+				rules: { values: [{}, {}] },
+				options: { fallbackOutput: 'none' },
+			},
+		});
+
+		const connections = mock<IConnections>({
+			TestNode: {
+				main: [[{ node: 'Node1' }], [{ node: 'Node2' }]],
+			},
+		});
+
+		const parameterData = mock<IUpdateInformation<NodeParameterValueType>>({
+			name: 'parameters.rules.values',
+			value: [{}, {}, {}],
+		});
+
+		const updatedConnections = updateDynamicConnections(node, connections, parameterData);
+
+		expect(updatedConnections?.TestNode.main).toHaveLength(3);
+		expect(updatedConnections?.TestNode.main[2]).toEqual([]);
+	});
+
+	it('should handle extra output when rule is added and fallbackOutput is extra', () => {
+		const node = mock<INodeUi>({
+			name: 'TestNode',
+			type: SWITCH_NODE_TYPE,
+			parameters: {
+				rules: { values: [{}, {}] },
+				options: { fallbackOutput: 'extra' },
+			},
+		});
+
+		const connections = mock<IConnections>({
+			TestNode: {
+				main: [[{ node: 'Node1' }], [{ node: 'Node2' }], [{ node: 'Node3' }]],
+			},
+		});
+
+		const parameterData = mock<IUpdateInformation<NodeParameterValueType>>({
+			name: 'parameters.rules.values',
+			value: [{}, {}, {}],
+		});
+
+		const updatedConnections = updateDynamicConnections(node, connections, parameterData);
+
+		expect(updatedConnections?.TestNode.main).toHaveLength(4);
+		expect(updatedConnections?.TestNode.main[2]).toEqual([]);
+		expect(updatedConnections?.TestNode.main[3][0].node).toEqual('Node3');
+	});
+
+	it('should return null if no conditions are met', () => {
+		const node = mock<INodeUi>({
+			name: 'TestNode',
+			type: 'otherNodeType',
+		});
+
+		const connections = mock<IConnections>({
+			TestNode: { main: [] },
+		});
+
+		const parameterData = mock<IUpdateInformation<number>>({
+			name: 'parameters.otherParameter',
+			value: 3,
+		});
+
+		const result = updateDynamicConnections(node, connections, parameterData);
+
+		expect(result).toBeNull();
+	});
+});
diff --git a/packages/editor-ui/src/utils/nodeSettingsUtils.ts b/packages/editor-ui/src/utils/nodeSettingsUtils.ts
new file mode 100644
index 0000000000..f4966dfb4f
--- /dev/null
+++ b/packages/editor-ui/src/utils/nodeSettingsUtils.ts
@@ -0,0 +1,133 @@
+import type {
+	IConnection,
+	IConnections,
+	IDataObject,
+	NodeInputConnections,
+	NodeParameterValueType,
+} from 'n8n-workflow';
+import type { INodeUi, IUpdateInformation } from '@/Interface';
+import { SWITCH_NODE_TYPE } from '@/constants';
+import { isEqual } from 'lodash-es';
+
+import { captureException } from '@sentry/vue';
+
+export function updateDynamicConnections(
+	node: INodeUi,
+	workflowConnections: IConnections,
+	parameterData: IUpdateInformation<NodeParameterValueType>,
+) {
+	const connections = { ...workflowConnections };
+
+	try {
+		if (parameterData.name.includes('conditions') || !connections[node.name]?.main) return null;
+
+		if (node.type === SWITCH_NODE_TYPE && parameterData.name === 'parameters.numberOutputs') {
+			const curentNumberOutputs = node.parameters?.numberOutputs as number;
+			const newNumberOutputs = parameterData.value as number;
+
+			// remove extra outputs
+			if (newNumberOutputs < curentNumberOutputs) {
+				connections[node.name].main = connections[node.name].main.slice(0, newNumberOutputs);
+				return connections;
+			}
+		}
+
+		if (
+			node.type === SWITCH_NODE_TYPE &&
+			parameterData.name === 'parameters.options.fallbackOutput'
+		) {
+			const curentFallbackOutput = (node.parameters?.options as { fallbackOutput: string })
+				?.fallbackOutput as string;
+			if (curentFallbackOutput === 'extra') {
+				if (!parameterData.value || parameterData.value !== 'extra') {
+					connections[node.name].main = connections[node.name].main.slice(0, -1);
+					return connections;
+				}
+			}
+		}
+
+		if (node.type === SWITCH_NODE_TYPE && parameterData.name.includes('parameters.rules.values')) {
+			const { fallbackOutput } = node.parameters?.options as { fallbackOutput: string };
+
+			if (parameterData.value === undefined) {
+				function extractIndex(path: string): number | null {
+					const match = path.match(/parameters\.rules\.values\[(\d+)\]$/);
+					return match ? parseInt(match[1], 10) : null;
+				}
+
+				const index = extractIndex(parameterData.name);
+
+				// rule was removed
+				if (index !== null) {
+					connections[node.name].main.splice(index, 1);
+					return connections;
+				}
+
+				// all rules were removed
+				if (parameterData.name === 'parameters.rules.values') {
+					if (fallbackOutput === 'extra') {
+						connections[node.name].main = [
+							connections[node.name].main[connections[node.name].main.length - 1],
+						];
+					} else {
+						connections[node.name].main = [];
+					}
+
+					return connections;
+				}
+			} else if (parameterData.name === 'parameters.rules.values') {
+				const curentRulesvalues = (node.parameters?.rules as { values: IDataObject[] })?.values;
+				let lastConnection: IConnection[] | undefined = undefined;
+				if (
+					fallbackOutput === 'extra' &&
+					connections[node.name].main.length === curentRulesvalues.length + 1
+				) {
+					lastConnection = connections[node.name].main.pop();
+				}
+				// rule was added
+				const currentRulesLength = (node.parameters?.rules as { values: IDataObject[] })?.values
+					?.length;
+
+				const newRulesLength = (parameterData.value as IDataObject[])?.length;
+
+				if (newRulesLength - currentRulesLength === 1) {
+					connections[node.name].main = [...connections[node.name].main, []];
+
+					if (lastConnection) {
+						connections[node.name].main.push(lastConnection);
+					}
+
+					return connections;
+				} else {
+					// order was changed
+					const newRulesvalues = parameterData.value as IDataObject[];
+					const updatedConnectionsIndex: number[] = [];
+
+					for (const rule of curentRulesvalues) {
+						const index = newRulesvalues.findIndex((newRule) => isEqual(rule, newRule));
+						if (index !== -1) {
+							updatedConnectionsIndex.push(index);
+						}
+					}
+
+					const reorderedConnections: NodeInputConnections = [];
+
+					for (const index of updatedConnectionsIndex) {
+						reorderedConnections.push(connections[node.name].main[index] ?? []);
+					}
+
+					if (lastConnection) {
+						reorderedConnections.push(lastConnection);
+					}
+
+					connections[node.name].main = reorderedConnections;
+					return connections;
+				}
+			}
+		}
+	} catch (error) {
+		captureException(error);
+	}
+
+	return null;
+}

From ed3ad6d684597f7c4b7419dfa81d476e66f10eba Mon Sep 17 00:00:00 2001
From: Michael Kret <88898367+michael-radency@users.noreply.github.com>
Date: Wed, 13 Nov 2024 13:44:44 +0200
Subject: [PATCH 08/19] fix(n8n Form Node): Find completion page (#11674)

---
 .../webhooks/__tests__/waiting-forms.test.ts  | 199 ++++++++++++++++++
 packages/cli/src/webhooks/waiting-forms.ts    |  62 +++---
 2 files changed, 234 insertions(+), 27 deletions(-)
 create mode 100644 packages/cli/src/webhooks/__tests__/waiting-forms.test.ts

diff --git a/packages/cli/src/webhooks/__tests__/waiting-forms.test.ts b/packages/cli/src/webhooks/__tests__/waiting-forms.test.ts
new file mode 100644
index 0000000000..bec6f95d7f
--- /dev/null
+++ b/packages/cli/src/webhooks/__tests__/waiting-forms.test.ts
@@ -0,0 +1,199 @@
+import { mock } from 'jest-mock-extended';
+import { FORM_NODE_TYPE, type Workflow } from 'n8n-workflow';
+
+import type { ExecutionRepository } from '@/databases/repositories/execution.repository';
+import { WaitingForms } from '@/webhooks/waiting-forms';
+
+describe('WaitingForms', () => {
+	const executionRepository = mock<ExecutionRepository>();
+	const waitingWebhooks = new WaitingForms(mock(), mock(), executionRepository);
+
+	beforeEach(() => {
+		jest.restoreAllMocks();
+	});
+
+	describe('findCompletionPage', () => {
+		it('should return lastNodeExecuted if it is a non-disabled form completion node', () => {
+			const workflow = mock<Workflow>({
+				getParentNodes: jest.fn().mockReturnValue([]),
+				nodes: {
+					Form1: {
+						disabled: undefined,
+						type: FORM_NODE_TYPE,
+						parameters: {
+							operation: 'completion',
+						},
+					},
+				},
+			});
+
+			const result = waitingWebhooks.findCompletionPage(workflow, {}, 'Form1');
+			expect(result).toBe('Form1');
+		});
+
+		it('should return undefined if lastNodeExecuted is disabled', () => {
+			const workflow = mock<Workflow>({
+				getParentNodes: jest.fn().mockReturnValue([]),
+				nodes: {
+					Form1: {
+						disabled: true,
+						type: FORM_NODE_TYPE,
+						parameters: {
+							operation: 'completion',
+						},
+					},
+				},
+			});
+
+			const result = waitingWebhooks.findCompletionPage(workflow, {}, 'Form1');
+			expect(result).toBeUndefined();
+		});
+
+		it('should return undefined if lastNodeExecuted is not a form node', () => {
+			const workflow = mock<Workflow>({
+				getParentNodes: jest.fn().mockReturnValue([]),
+				nodes: {
+					NonForm: {
+						disabled: undefined,
+						type: 'other-node-type',
+						parameters: {},
+					},
+				},
+			});
+
+			const result = waitingWebhooks.findCompletionPage(workflow, {}, 'NonForm');
+			expect(result).toBeUndefined();
+		});
+
+		it('should return undefined if lastNodeExecuted operation is not completion', () => {
+			const workflow = mock<Workflow>({
+				getParentNodes: jest.fn().mockReturnValue([]),
+				nodes: {
+					Form1: {
+						disabled: undefined,
+						type: FORM_NODE_TYPE,
+						parameters: {
+							operation: 'page',
+						},
+					},
+				},
+			});
+
+			const result = waitingWebhooks.findCompletionPage(workflow, {}, 'Form1');
+			expect(result).toBeUndefined();
+		});
+
+		it('should find first valid completion form in parent nodes if lastNodeExecuted is not valid', () => {
+			const workflow = mock<Workflow>({
+				getParentNodes: jest.fn().mockReturnValue(['Form1', 'Form2', 'Form3']),
+				nodes: {
+					LastNode: {
+						disabled: undefined,
+						type: 'other-node-type',
+						parameters: {},
+					},
+					Form1: {
+						disabled: true,
+						type: FORM_NODE_TYPE,
+						parameters: {
+							operation: 'completion',
+						},
+					},
+					Form2: {
+						disabled: undefined,
+						type: FORM_NODE_TYPE,
+						parameters: {
+							operation: 'completion',
+						},
+					},
+					Form3: {
+						disabled: undefined,
+						type: FORM_NODE_TYPE,
+						parameters: {
+							operation: 'completion',
+						},
+					},
+				},
+			});
+
+			const runData = {
+				Form2: [],
+				Form3: [],
+			};
+
+			const result = waitingWebhooks.findCompletionPage(workflow, runData, 'LastNode');
+			expect(result).toBe('Form3');
+		});
+
+		it('should return undefined if no valid completion form is found in parent nodes', () => {
+			const workflow = mock<Workflow>({
+				getParentNodes: jest.fn().mockReturnValue(['Form1', 'Form2']),
+				nodes: {
+					LastNode: {
+						disabled: undefined,
+						type: 'other-node-type',
+						parameters: {},
+					},
+					Form1: {
+						disabled: true,
+						type: FORM_NODE_TYPE,
+						parameters: {
+							operation: 'completion',
+						},
+					},
+					Form2: {
+						disabled: undefined,
+						type: FORM_NODE_TYPE,
+						parameters: {
+							operation: 'submit',
+						},
+					},
+				},
+			});
+
+			const result = waitingWebhooks.findCompletionPage(workflow, {}, 'LastNode');
+			expect(result).toBeUndefined();
+		});
+
+		it('should skip parent nodes without runData', () => {
+			const workflow = mock<Workflow>({
+				getParentNodes: jest.fn().mockReturnValue(['Form1', 'Form2', 'Form3']),
+				nodes: {
+					LastNode: {
+						disabled: undefined,
+						type: 'other-node-type',
+						parameters: {},
+					},
+					Form1: {
+						disabled: undefined,
+						type: FORM_NODE_TYPE,
+						parameters: {
+							operation: 'completion',
+						},
+					},
+					Form2: {
+						disabled: undefined,
+						type: FORM_NODE_TYPE,
+						parameters: {
+							operation: 'completion',
+						},
+					},
+					Form3: {
+						disabled: undefined,
+						type: FORM_NODE_TYPE,
+						parameters: {
+							operation: 'completion',
+						},
+					},
+				},
+			});
+
+			const runData = {
+				Form2: [],
+			};
+
+			const result = waitingWebhooks.findCompletionPage(workflow, runData, 'LastNode');
+			expect(result).toBe('Form2');
+		});
+	});
+});
diff --git a/packages/cli/src/webhooks/waiting-forms.ts b/packages/cli/src/webhooks/waiting-forms.ts
index 5a491c1fb3..cd2de74ed0 100644
--- a/packages/cli/src/webhooks/waiting-forms.ts
+++ b/packages/cli/src/webhooks/waiting-forms.ts
@@ -1,5 +1,6 @@
 import axios from 'axios';
 import type express from 'express';
+import type { IRunData } from 'n8n-workflow';
 import { FORM_NODE_TYPE, sleep, Workflow } from 'n8n-workflow';
 import { Service } from 'typedi';
 
@@ -57,6 +58,29 @@ export class WaitingForms extends WaitingWebhooks {
 		} catch (error) {}
 	}
 
+	findCompletionPage(workflow: Workflow, runData: IRunData, lastNodeExecuted: string) {
+		const parentNodes = workflow.getParentNodes(lastNodeExecuted);
+		const lastNode = workflow.nodes[lastNodeExecuted];
+
+		if (
+			!lastNode.disabled &&
+			lastNode.type === FORM_NODE_TYPE &&
+			lastNode.parameters.operation === 'completion'
+		) {
+			return lastNodeExecuted;
+		} else {
+			return parentNodes.reverse().find((nodeName) => {
+				const node = workflow.nodes[nodeName];
+				return (
+					!node.disabled &&
+					node.type === FORM_NODE_TYPE &&
+					node.parameters.operation === 'completion' &&
+					runData[nodeName]
+				);
+			});
+		}
+	}
+
 	async executeWebhook(
 		req: WaitingWebhookRequest,
 		res: express.Response,
@@ -89,35 +113,19 @@ export class WaitingForms extends WaitingWebhooks {
 			throw new ConflictError(`The execution "${executionId}" is running already.`);
 		}
 
-		let completionPage;
+		let lastNodeExecuted = execution.data.resultData.lastNodeExecuted as string;
+
 		if (execution.finished) {
+			// find the completion page to render
+			// if there is no completion page, render the default page
 			const workflow = this.getWorkflow(execution);
 
-			const parentNodes = workflow.getParentNodes(
-				execution.data.resultData.lastNodeExecuted as string,
+			const completionPage = this.findCompletionPage(
+				workflow,
+				execution.data.resultData.runData,
+				lastNodeExecuted,
 			);
 
-			const lastNodeExecuted = execution.data.resultData.lastNodeExecuted as string;
-			const lastNode = workflow.nodes[lastNodeExecuted];
-
-			if (
-				!lastNode.disabled &&
-				lastNode.type === FORM_NODE_TYPE &&
-				lastNode.parameters.operation === 'completion'
-			) {
-				completionPage = lastNodeExecuted;
-			} else {
-				completionPage = Object.keys(workflow.nodes).find((nodeName) => {
-					const node = workflow.nodes[nodeName];
-					return (
-						parentNodes.includes(nodeName) &&
-						!node.disabled &&
-						node.type === FORM_NODE_TYPE &&
-						node.parameters.operation === 'completion'
-					);
-				});
-			}
-
 			if (!completionPage) {
 				res.render('form-trigger-completion', {
 					title: 'Form Submitted',
@@ -128,16 +136,16 @@ export class WaitingForms extends WaitingWebhooks {
 				return {
 					noWebhookResponse: true,
 				};
+			} else {
+				lastNodeExecuted = completionPage;
 			}
 		}
 
-		const targetNode = completionPage || (execution.data.resultData.lastNodeExecuted as string);
-
 		return await this.getWebhookExecutionData({
 			execution,
 			req,
 			res,
-			lastNodeExecuted: targetNode,
+			lastNodeExecuted,
 			executionId,
 			suffix,
 		});

From 3202e8c9461ed0df6d7561c7d89a45082929e690 Mon Sep 17 00:00:00 2001
From: Michael Kret <88898367+michael-radency@users.noreply.github.com>
Date: Wed, 13 Nov 2024 14:16:49 +0200
Subject: [PATCH 09/19] fix(Notion Node): Safe access in simplifyProperty
 (no-changelog) (#11712)

---
 .../nodes/Notion/shared/GenericFunctions.ts   | 24 +++++++++----------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/packages/nodes-base/nodes/Notion/shared/GenericFunctions.ts b/packages/nodes-base/nodes/Notion/shared/GenericFunctions.ts
index 68270ce05a..bf483b66a0 100644
--- a/packages/nodes-base/nodes/Notion/shared/GenericFunctions.ts
+++ b/packages/nodes-base/nodes/Notion/shared/GenericFunctions.ts
@@ -575,7 +575,7 @@ export function mapFilters(filtersList: IDataObject[], timezone: string) {
 		}
 
 		return Object.assign(obj, {
-			['property']: getNameAndType(value.key as string).name,
+			['property']: getNameAndType(value.key as string)?.name,
 			[key]: { [`${value.condition}`]: valuePropertyName },
 		});
 	}, {});
@@ -606,7 +606,7 @@ function simplifyProperty(property: any) {
 	) {
 		result = property[type];
 	} else if (['created_by', 'last_edited_by', 'select'].includes(property.type as string)) {
-		result = property[type] ? property[type].name : null;
+		result = property[type] ? property[type]?.name : null;
 	} else if (['people'].includes(property.type as string)) {
 		if (Array.isArray(property[type])) {
 			result = property[type].map((person: any) => person.person?.email || {});
@@ -615,35 +615,35 @@ function simplifyProperty(property: any) {
 		}
 	} else if (['multi_select'].includes(property.type as string)) {
 		if (Array.isArray(property[type])) {
-			result = property[type].map((e: IDataObject) => e.name || {});
+			result = property[type].map((e: IDataObject) => e?.name || {});
 		} else {
-			result = property[type].options.map((e: IDataObject) => e.name || {});
+			result = property[type].options.map((e: IDataObject) => e?.name || {});
 		}
 	} else if (['relation'].includes(property.type as string)) {
 		if (Array.isArray(property[type])) {
-			result = property[type].map((e: IDataObject) => e.id || {});
+			result = property[type].map((e: IDataObject) => e?.id || {});
 		} else {
-			result = property[type].database_id;
+			result = property[type]?.database_id;
 		}
 	} else if (['formula'].includes(property.type as string)) {
-		result = property[type][property[type].type];
+		result = property[type]?.[property[type]?.type];
 	} else if (['rollup'].includes(property.type as string)) {
-		const rollupFunction = property[type].function as string;
+		const rollupFunction = property[type]?.function as string;
 		if (rollupFunction.startsWith('count') || rollupFunction.includes('empty')) {
-			result = property[type].number;
+			result = property[type]?.number;
 			if (rollupFunction.includes('percent')) {
 				result = result * 100;
 			}
-		} else if (rollupFunction.startsWith('show') && property[type].type === 'array') {
+		} else if (rollupFunction.startsWith('show') && property[type]?.type === 'array') {
 			const elements = property[type].array.map(simplifyProperty).flat();
 			result = rollupFunction === 'show_unique' ? [...new Set(elements as string)] : elements;
 		}
 	} else if (['files'].includes(property.type as string)) {
 		result = property[type].map(
-			(file: { type: string; [key: string]: any }) => file[file.type].url,
+			(file: { type: string; [key: string]: any }) => file[file.type]?.url,
 		);
 	} else if (['status'].includes(property.type as string)) {
-		result = property[type].name;
+		result = property[type]?.name;
 	}
 	return result;
 }

From 0d8aada49005d6a6078e8460003a0de61a8f423c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E0=A4=95=E0=A4=BE=E0=A4=B0=E0=A4=A4=E0=A5=8B=E0=A4=AB?=
 =?UTF-8?q?=E0=A5=8D=E0=A4=AB=E0=A5=87=E0=A4=B2=E0=A4=B8=E0=A5=8D=E0=A4=95?=
 =?UTF-8?q?=E0=A5=8D=E0=A4=B0=E0=A4=BF=E0=A4=AA=E0=A5=8D=E0=A4=9F=E2=84=A2?=
 <netroy@users.noreply.github.com>
Date: Wed, 13 Nov 2024 14:18:21 +0100
Subject: [PATCH 10/19] feat(core): Make all http requests made with
 `httpRequestWithAuthentication` abortable (#11704)

---
 packages/core/src/NodeExecuteFunctions.ts | 9 +++++++++
 packages/workflow/src/Interfaces.ts       | 3 ++-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/packages/core/src/NodeExecuteFunctions.ts b/packages/core/src/NodeExecuteFunctions.ts
index e645309644..b3701c1ca3 100644
--- a/packages/core/src/NodeExecuteFunctions.ts
+++ b/packages/core/src/NodeExecuteFunctions.ts
@@ -918,6 +918,10 @@ function convertN8nRequestToAxios(n8nRequest: IHttpRequestOptions): AxiosRequest
 
 	axiosRequest.params = n8nRequest.qs;
 
+	if (n8nRequest.abortSignal) {
+		axiosRequest.signal = n8nRequest.abortSignal;
+	}
+
 	if (n8nRequest.baseURL !== undefined) {
 		axiosRequest.baseURL = n8nRequest.baseURL;
 	}
@@ -1718,6 +1722,11 @@ export async function httpRequestWithAuthentication(
 ) {
 	removeEmptyBody(requestOptions);
 
+	// Cancel this request on execution cancellation
+	if ('getExecutionCancelSignal' in this) {
+		requestOptions.abortSignal = this.getExecutionCancelSignal();
+	}
+
 	let credentialsDecrypted: ICredentialDataDecryptedObject | undefined;
 	try {
 		const parentTypes = additionalData.credentialsHelper.getParentTypes(credentialsType);
diff --git a/packages/workflow/src/Interfaces.ts b/packages/workflow/src/Interfaces.ts
index 271fd0838e..41cee333d1 100644
--- a/packages/workflow/src/Interfaces.ts
+++ b/packages/workflow/src/Interfaces.ts
@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 
 import type { CallbackManager as CallbackManagerLC } from '@langchain/core/callbacks/manager';
-import type { AxiosProxyConfig } from 'axios';
+import type { AxiosProxyConfig, GenericAbortSignal } from 'axios';
 import type * as express from 'express';
 import type FormData from 'form-data';
 import type { PathLike } from 'fs';
@@ -529,6 +529,7 @@ export interface IHttpRequestOptions {
 	};
 	timeout?: number;
 	json?: boolean;
+	abortSignal?: GenericAbortSignal;
 }
 
 /**

From ca8cb455ba59831295c238afb11aeab6ad18428e Mon Sep 17 00:00:00 2001
From: Elias Meire <elias@meire.dev>
Date: Wed, 13 Nov 2024 14:47:27 +0100
Subject: [PATCH 11/19] fix(editor): Prevent error being thrown in RLC while
 loading (#11676)

---
 .../components/ResourceLocator/ResourceLocatorDropdown.vue | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/editor-ui/src/components/ResourceLocator/ResourceLocatorDropdown.vue b/packages/editor-ui/src/components/ResourceLocator/ResourceLocatorDropdown.vue
index 01c7b4071d..a4e00af9f7 100644
--- a/packages/editor-ui/src/components/ResourceLocator/ResourceLocatorDropdown.vue
+++ b/packages/editor-ui/src/components/ResourceLocator/ResourceLocatorDropdown.vue
@@ -145,7 +145,12 @@ function onKeyDown(e: KeyboardEvent) {
 			}
 		}
 	} else if (e.key === 'Enter') {
-		emit('update:modelValue', sortedResources.value[hoverIndex.value].value);
+		const selected = sortedResources.value[hoverIndex.value]?.value;
+
+		// Selected resource can be empty when loading or empty results
+		if (selected) {
+			emit('update:modelValue', selected);
+		}
 	}
 }
 

From b22142ddb85d8baa550c25ba296a231906544aa1 Mon Sep 17 00:00:00 2001
From: oleg <me@olegivaniv.com>
Date: Wed, 13 Nov 2024 15:33:02 +0100
Subject: [PATCH 12/19] fix(editor): Fix canvasNodes reactivity in canvas chat
 (no-changelog) (#11717)

---
 .../editor-ui/src/components/CanvasChat/CanvasChat.vue    | 3 ++-
 .../components/CanvasChat/composables/useChatTrigger.ts   | 8 ++++----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/packages/editor-ui/src/components/CanvasChat/CanvasChat.vue b/packages/editor-ui/src/components/CanvasChat/CanvasChat.vue
index 4d551a67be..51bf1bf8be 100644
--- a/packages/editor-ui/src/components/CanvasChat/CanvasChat.vue
+++ b/packages/editor-ui/src/components/CanvasChat/CanvasChat.vue
@@ -52,6 +52,7 @@ const isChatOpen = computed(() => {
 	const result = workflowsStore.isChatPanelOpen;
 	return result;
 });
+const canvasNodes = computed(() => workflowsStore.allNodes);
 const isLogsOpen = computed(() => workflowsStore.isLogsPanelOpen);
 const previousChatMessages = computed(() => workflowsStore.getPastChatMessages);
 
@@ -70,7 +71,7 @@ const { runWorkflow } = useRunWorkflow({ router });
 const { chatTriggerNode, connectedNode, allowFileUploads, setChatTriggerNode, setConnectedNode } =
 	useChatTrigger({
 		workflow,
-		canvasNodes: workflowsStore.allNodes,
+		canvasNodes,
 		getNodeByName: workflowsStore.getNodeByName,
 		getNodeType: nodeTypesStore.getNodeType,
 	});
diff --git a/packages/editor-ui/src/components/CanvasChat/composables/useChatTrigger.ts b/packages/editor-ui/src/components/CanvasChat/composables/useChatTrigger.ts
index 9ec2e346a6..7d0cff0d8d 100644
--- a/packages/editor-ui/src/components/CanvasChat/composables/useChatTrigger.ts
+++ b/packages/editor-ui/src/components/CanvasChat/composables/useChatTrigger.ts
@@ -1,5 +1,5 @@
-import type { ComputedRef } from 'vue';
-import { ref, computed } from 'vue';
+import type { ComputedRef, MaybeRef } from 'vue';
+import { ref, computed, unref } from 'vue';
 import {
 	CHAIN_SUMMARIZATION_LANGCHAIN_NODE_TYPE,
 	NodeConnectionType,
@@ -19,7 +19,7 @@ import type { INodeUi } from '@/Interface';
 export interface ChatTriggerDependencies {
 	getNodeByName: (name: string) => INodeUi | null;
 	getNodeType: (type: string, version: number) => INodeTypeDescription | null;
-	canvasNodes: INodeUi[];
+	canvasNodes: MaybeRef<INodeUi[]>;
 	workflow: ComputedRef<Workflow>;
 }
 
@@ -52,7 +52,7 @@ export function useChatTrigger({
 
 	/** Gets the chat trigger node from the workflow */
 	function setChatTriggerNode() {
-		const triggerNode = canvasNodes.find((node) =>
+		const triggerNode = unref(canvasNodes).find((node) =>
 			[CHAT_TRIGGER_NODE_TYPE, MANUAL_CHAT_TRIGGER_NODE_TYPE].includes(node.type),
 		);
 

From 70d315b3d5b8f5f3e0f39527bba11e254a52028e Mon Sep 17 00:00:00 2001
From: Jon <jonathan.bennetts@gmail.com>
Date: Wed, 13 Nov 2024 14:43:25 +0000
Subject: [PATCH 13/19] fix(Facebook Lead Ads Trigger Node): Fix issue with
 optional fields (#11692)

---
 .../nodes/FacebookLeadAds/FacebookLeadAdsTrigger.node.ts    | 5 ++++-
 .../nodes-base/nodes/FacebookLeadAds/GenericFunctions.ts    | 6 +++---
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/packages/nodes-base/nodes/FacebookLeadAds/FacebookLeadAdsTrigger.node.ts b/packages/nodes-base/nodes/FacebookLeadAds/FacebookLeadAdsTrigger.node.ts
index 5a1c06f91d..325ac81d4a 100644
--- a/packages/nodes-base/nodes/FacebookLeadAds/FacebookLeadAdsTrigger.node.ts
+++ b/packages/nodes-base/nodes/FacebookLeadAds/FacebookLeadAdsTrigger.node.ts
@@ -273,7 +273,10 @@ export class FacebookLeadAdsTrigger implements INodeType {
 						return {
 							id: lead.id,
 							data: lead.field_data.reduce(
-								(acc, field) => ({ ...acc, [field.name]: field.values[0] }),
+								(acc, field) => ({
+									...acc,
+									[field.name]: field.values && field.values.length > 0 ? field.values[0] : null,
+								}),
 								{},
 							),
 							form: {
diff --git a/packages/nodes-base/nodes/FacebookLeadAds/GenericFunctions.ts b/packages/nodes-base/nodes/FacebookLeadAds/GenericFunctions.ts
index a608605096..5d4950ea07 100644
--- a/packages/nodes-base/nodes/FacebookLeadAds/GenericFunctions.ts
+++ b/packages/nodes-base/nodes/FacebookLeadAds/GenericFunctions.ts
@@ -33,7 +33,7 @@ export async function facebookApiRequest(
 		qs,
 		body,
 		gzip: true,
-		uri: `https://graph.facebook.com/v17.0${resource}`,
+		uri: `https://graph.facebook.com/v21.0${resource}`,
 		json: true,
 	};
 
@@ -89,7 +89,7 @@ export async function facebookAppApiRequest(
 		method,
 		qs,
 		gzip: true,
-		uri: `https://graph.facebook.com/v17.0${resource}`,
+		uri: `https://graph.facebook.com/v21.0${resource}`,
 		json: true,
 	};
 
@@ -181,7 +181,7 @@ export async function facebookPageApiRequest(
 		qs,
 		body,
 		gzip: true,
-		uri: `https://graph.facebook.com/v17.0${resource}`,
+		uri: `https://graph.facebook.com/v21.0${resource}`,
 		json: true,
 	};
 

From 6d5ee832966fab96043b0d65697c059ced61d334 Mon Sep 17 00:00:00 2001
From: Shireen Missi <94372015+ShireenMissi@users.noreply.github.com>
Date: Wed, 13 Nov 2024 15:23:24 +0000
Subject: [PATCH 14/19] fix(core): Continue with error output reverse items in
 success branch (#11684)

---
 packages/core/src/WorkflowExecute.ts          |   2 +-
 packages/core/test/WorkflowExecute.test.ts    |   6 +-
 .../core/test/workflows/error_outputs.json    | 331 +++++++-----------
 3 files changed, 139 insertions(+), 200 deletions(-)

diff --git a/packages/core/src/WorkflowExecute.ts b/packages/core/src/WorkflowExecute.ts
index f8c32351bb..bb1b1633df 100644
--- a/packages/core/src/WorkflowExecute.ts
+++ b/packages/core/src/WorkflowExecute.ts
@@ -1243,7 +1243,7 @@ export class WorkflowExecute {
 											: [];
 
 										while (items.length) {
-											const item = items.pop();
+											const item = items.shift();
 											if (item === undefined) {
 												continue;
 											}
diff --git a/packages/core/test/WorkflowExecute.test.ts b/packages/core/test/WorkflowExecute.test.ts
index 6d1927fb88..ab69a7574b 100644
--- a/packages/core/test/WorkflowExecute.test.ts
+++ b/packages/core/test/WorkflowExecute.test.ts
@@ -188,7 +188,11 @@ describe('WorkflowExecute', () => {
 						if (nodeData.data === undefined) {
 							return null;
 						}
-						return nodeData.data.main[0];
+						return nodeData.data.main[0]!.map((entry) => {
+							// remove pairedItem from entry if it is an error output test
+							if (testData.description.includes('error_outputs')) delete entry.pairedItem;
+							return entry;
+						});
 					});
 
 					expect(resultData).toEqual(testData.output.nodeData[nodeName]);
diff --git a/packages/core/test/workflows/error_outputs.json b/packages/core/test/workflows/error_outputs.json
index f8e698bd52..5e143b644e 100644
--- a/packages/core/test/workflows/error_outputs.json
+++ b/packages/core/test/workflows/error_outputs.json
@@ -1,13 +1,13 @@
 {
-	"name": "Error Output - Test Workflow",
+	"name": "My workflow 105",
 	"nodes": [
 		{
 			"parameters": {},
-			"id": "c41b46f0-3e76-4655-b5ea-4d15af58c138",
+			"id": "a94bc1fb-1f39-404b-b149-a76c4fbaed25",
 			"name": "When clicking \"Execute Workflow\"",
 			"type": "n8n-nodes-base.manualTrigger",
 			"typeVersion": 1,
-			"position": [-680, 460]
+			"position": [-60, 780]
 		},
 		{
 			"parameters": {
@@ -21,11 +21,11 @@
 				},
 				"options": {}
 			},
-			"id": "247f4118-d80f-49ab-8d9a-0cdbbb9271df",
+			"id": "6ba26bdf-91e2-4f18-8f4c-09e98aa4a9df",
 			"name": "Success",
 			"type": "n8n-nodes-base.set",
 			"typeVersion": 3.2,
-			"position": [200, 860]
+			"position": [820, 1180]
 		},
 		{
 			"parameters": {
@@ -39,21 +39,21 @@
 				},
 				"options": {}
 			},
-			"id": "311e3650-d89c-405a-9c8d-c238f48a8a5a",
+			"id": "e3d1eadf-0994-4806-97ce-c5c5f673c624",
 			"name": "Error",
 			"type": "n8n-nodes-base.set",
 			"typeVersion": 3.2,
-			"position": [200, 1040]
+			"position": [820, 1360]
 		},
 		{
 			"parameters": {
 				"jsCode": "return [\n  {\n    \"id\": \"23423532\",\n    \"name\": \"Jay Gatsby\",\n    \"email\": \"gatsby@west-egg.com\",\n    \"notes\": \"Keeps asking about a green light??\",\n    \"country\": \"US\",\n    \"created\": \"1925-04-10\"\n  },\n  {\n    \"id\": \"23423533\",\n    \"name\": \"José Arcadio Buendía\",\n    \"email\": \"jab@macondo.co\",\n    \"notes\": \"Lots of people named after him. Very confusing\",\n    \"country\": \"CO\",\n    \"created\": \"1967-05-05\"\n  },\n  {\n    \"id\": \"23423534\",\n    \"name\": \"Max Sendak\",\n    \"email\": \"info@in-and-out-of-weeks.org\",\n    \"notes\": \"Keeps rolling his terrible eyes\",\n    \"country\": \"US\",\n    \"created\": \"1963-04-09\"\n  },\n  {\n    \"id\": \"23423535\",\n    \"name\": \"Zaphod Beeblebrox\",\n    \"email\": \"captain@heartofgold.com\",\n    \"notes\": \"Felt like I was talking to more than one person\",\n    \"country\": null,\n    \"created\": \"1979-10-12\"\n  },\n  {\n    \"id\": \"23423536\",\n    \"name\": \"Edmund Pevensie\",\n    \"email\": \"edmund@narnia.gov\",\n    \"notes\": \"Passionate sailor\",\n    \"country\": \"UK\",\n    \"created\": \"1950-10-16\"\n  }\n]"
 			},
-			"id": "179d4fe7-1ae7-4957-a77d-12c3ca6d141b",
+			"id": "01adfc2d-141d-4843-b2d6-04115a476bc1",
 			"name": "Mock Data",
 			"type": "n8n-nodes-base.code",
 			"typeVersion": 2,
-			"position": [-460, 460]
+			"position": [160, 780]
 		},
 		{
 			"parameters": {
@@ -61,11 +61,11 @@
 				"height": 414,
 				"width": 564
 			},
-			"id": "1ec2a8b6-54e2-4319-90b3-30b387855b36",
+			"id": "8ca689eb-7910-43ad-bd10-fae35a8fc203",
 			"name": "Sticky Note",
 			"type": "n8n-nodes-base.stickyNote",
 			"typeVersion": 1,
-			"position": [-160, 780]
+			"position": [460, 1100]
 		},
 		{
 			"parameters": {
@@ -73,11 +73,11 @@
 				"height": 279,
 				"width": 564
 			},
-			"id": "49a2b7d9-8bd1-4cdf-9649-2d93668b0f8f",
+			"id": "a17460d6-b0c0-432d-ac6f-8ff684357c8d",
 			"name": "Sticky Note1",
 			"type": "n8n-nodes-base.stickyNote",
 			"typeVersion": 1,
-			"position": [-160, 140]
+			"position": [460, 460]
 		},
 		{
 			"parameters": {
@@ -91,22 +91,22 @@
 				},
 				"options": {}
 			},
-			"id": "9852f1d9-95b4-4ef7-bb18-8f0bab81a0bc",
+			"id": "46df5463-4289-4e61-9f80-87e035931bda",
 			"name": "Combined",
 			"type": "n8n-nodes-base.set",
 			"typeVersion": 3.2,
-			"position": [180, 240]
+			"position": [800, 560]
 		},
 		{
 			"parameters": {
 				"mode": "runOnceForEachItem",
 				"jsCode": "// Add a new field called 'myNewField' to the JSON of the item\n$input.item.json.myNewField = 1;\n\nif ($input.item.json.country === 'US') {\n  throw new Error('This is an error');\n}\n\nreturn $input.item;"
 			},
-			"id": "40d4dba3-3db7-4eb5-aa27-e76f955a5e09",
+			"id": "a4708520-aaca-4618-b7a2-94da268fba37",
 			"name": "Throw Error",
 			"type": "n8n-nodes-base.code",
 			"typeVersion": 2,
-			"position": [-140, 960],
+			"position": [480, 1280],
 			"errorOutput": true,
 			"onError": "continueErrorOutput"
 		},
@@ -116,22 +116,22 @@
 				"height": 279,
 				"width": 564
 			},
-			"id": "8eb3dd54-c1dd-4167-abfa-c06d044c63f3",
+			"id": "f0a450cd-4124-490d-964f-a71b645f770c",
 			"name": "Sticky Note2",
 			"type": "n8n-nodes-base.stickyNote",
 			"typeVersion": 1,
-			"position": [-160, 460]
+			"position": [460, 780]
 		},
 		{
 			"parameters": {
 				"mode": "runOnceForEachItem",
 				"jsCode": "// Add a new field called 'myNewField' to the JSON of the item\n$input.item.json.myNewField = 1;\n\nif ($input.item.json.country === 'US') {\n  throw new Error('This is an error');\n}\n\nreturn $input.item;"
 			},
-			"id": "19a3d6ac-e610-4296-9b7a-9ed19d242bdb",
+			"id": "823f12e6-cbfc-4545-8505-fab158d1effe",
 			"name": "Throw Error2",
 			"type": "n8n-nodes-base.code",
 			"typeVersion": 2,
-			"position": [-120, 560],
+			"position": [500, 880],
 			"onError": "continueRegularOutput"
 		},
 		{
@@ -146,22 +146,22 @@
 				},
 				"options": {}
 			},
-			"id": "5f803fdc-7d88-4c12-8886-6092cfbc03c6",
+			"id": "8f88d130-9a13-4236-81c0-157f8a8990c0",
 			"name": "Combined1",
 			"type": "n8n-nodes-base.set",
 			"typeVersion": 3.2,
-			"position": [180, 560]
+			"position": [800, 880]
 		},
 		{
 			"parameters": {
 				"mode": "runOnceForEachItem",
 				"jsCode": "// Add a new field called 'myNewField' to the JSON of the item\n$input.item.json.myNewField = 1;\n\nif ($input.item.json.country === 'US') {\n  throw new Error('This is an error');\n}\n\nreturn $input.item;"
 			},
-			"id": "c2696c1f-1abd-4549-9ad9-e62017dc14b8",
+			"id": "1a3f4beb-0d1e-44fe-a411-5bd1096ffd74",
 			"name": "Throw Error1",
 			"type": "n8n-nodes-base.code",
 			"typeVersion": 2,
-			"position": [-120, 240],
+			"position": [500, 560],
 			"continueOnFail": true
 		},
 		{
@@ -176,11 +176,11 @@
 				},
 				"options": {}
 			},
-			"id": "01740d7e-e572-408a-9fae-729068803113",
+			"id": "c617a3d7-15e3-49b4-a7dd-d45c5e059a22",
 			"name": "Success1",
 			"type": "n8n-nodes-base.set",
 			"typeVersion": 3.2,
-			"position": [200, 1320]
+			"position": [820, 1640]
 		},
 		{
 			"parameters": {
@@ -188,22 +188,22 @@
 				"height": 509.71047006830065,
 				"width": 1183.725293692246
 			},
-			"id": "ed409181-4847-4d65-af45-f45078a6343e",
+			"id": "046de2cf-970a-4925-b87d-16e8cca511fd",
 			"name": "Sticky Note3",
 			"type": "n8n-nodes-base.stickyNote",
 			"typeVersion": 1,
-			"position": [-160, 1240]
+			"position": [460, 1560]
 		},
 		{
 			"parameters": {
 				"mode": "runOnceForEachItem",
 				"jsCode": "// Add a new field called 'myNewField' to the JSON of the item\n$input.item.json.myNewField = 1;\n\nif ($input.item.json.country === 'US') {\n  throw new Error('This is an error');\n}\n\nreturn $input.item;"
 			},
-			"id": "93d03f38-b928-4b4b-832a-3f1a5deebb2d",
+			"id": "9ec21de1-dfca-4fff-b5a7-a56364239d7b",
 			"name": "Throw Error3",
 			"type": "n8n-nodes-base.code",
 			"typeVersion": 2,
-			"position": [-140, 1420],
+			"position": [480, 1740],
 			"errorOutput": true,
 			"onError": "continueErrorOutput"
 		},
@@ -211,11 +211,11 @@
 			"parameters": {
 				"options": {}
 			},
-			"id": "c92a6ce5-41ea-4fb9-a07b-c4e98f905b12",
+			"id": "e3605953-75cf-4036-99f7-05e3971a6a75",
 			"name": "Edit Fields",
 			"type": "n8n-nodes-base.set",
 			"typeVersion": 3.2,
-			"position": [420, 1500],
+			"position": [1040, 1820],
 			"onError": "continueErrorOutput"
 		},
 		{
@@ -230,11 +230,11 @@
 				},
 				"options": {}
 			},
-			"id": "ab838cc1-0987-4b41-bdc5-fe17f38e0691",
+			"id": "a71cfb77-adfd-4c77-9a8e-7e58cbd0931b",
 			"name": "Success2",
 			"type": "n8n-nodes-base.set",
 			"typeVersion": 3.2,
-			"position": [700, 1360]
+			"position": [1320, 1680]
 		},
 		{
 			"parameters": {
@@ -248,11 +248,11 @@
 				},
 				"options": {}
 			},
-			"id": "22e04172-19b9-4735-9dd0-a3e2fa3bf000",
+			"id": "ea9d02e9-1716-4f69-a14a-9133f5184886",
 			"name": "Error2",
 			"type": "n8n-nodes-base.set",
 			"typeVersion": 3.2,
-			"position": [700, 1580]
+			"position": [1320, 1900]
 		},
 		{
 			"parameters": {
@@ -266,101 +266,19 @@
 				},
 				"options": {}
 			},
-			"id": "69e7257a-1ba8-46ba-9394-d38d65b2e567",
+			"id": "17780679-f7a3-4b1b-b6ee-f3f61e0843ad",
 			"name": "Error1",
 			"type": "n8n-nodes-base.set",
 			"typeVersion": 3.2,
-			"position": [200, 1500]
+			"position": [820, 1820]
 		}
 	],
 	"pinData": {
-		"Error": [
-			{
-				"json": {
-					"id": "23423534",
-					"name": "Max Sendak",
-					"email": "info@in-and-out-of-weeks.org",
-					"notes": "Keeps rolling his terrible eyes",
-					"country": "US",
-					"created": "1963-04-09",
-					"error": "This is an error [line 5, for item 2]",
-					"originalName": "Max Sendak"
-				},
-				"pairedItem": {
-					"item": 0
-				}
-			},
-			{
-				"json": {
-					"id": "23423532",
-					"name": "Jay Gatsby",
-					"email": "gatsby@west-egg.com",
-					"notes": "Keeps asking about a green light??",
-					"country": "US",
-					"created": "1925-04-10",
-					"error": "This is an error [line 5, for item 0]",
-					"originalName": "Jay Gatsby"
-				},
-				"pairedItem": {
-					"item": 1
-				}
-			}
-		],
-		"Success": [
-			{
-				"json": {
-					"id": "23423536",
-					"name": "Edmund Pevensie",
-					"email": "edmund@narnia.gov",
-					"notes": "Passionate sailor",
-					"country": "UK",
-					"created": "1950-10-16",
-					"myNewField": 1,
-					"originalName": "Edmund Pevensie"
-				},
-				"pairedItem": {
-					"item": 0
-				}
-			},
-			{
-				"json": {
-					"id": "23423535",
-					"name": "Zaphod Beeblebrox",
-					"email": "captain@heartofgold.com",
-					"notes": "Felt like I was talking to more than one person",
-					"country": null,
-					"created": "1979-10-12",
-					"myNewField": 1,
-					"originalName": "Zaphod Beeblebrox"
-				},
-				"pairedItem": {
-					"item": 1
-				}
-			},
-			{
-				"json": {
-					"id": "23423533",
-					"name": "José Arcadio Buendía",
-					"email": "jab@macondo.co",
-					"notes": "Lots of people named after him. Very confusing",
-					"country": "CO",
-					"created": "1967-05-05",
-					"myNewField": 1,
-					"originalName": "José Arcadio Buendía"
-				},
-				"pairedItem": {
-					"item": 2
-				}
-			}
-		],
 		"Combined": [
 			{
 				"json": {
 					"error": "This is an error [line 5, for item 0]",
 					"originalName": "Jay Gatsby"
-				},
-				"pairedItem": {
-					"item": 0
 				}
 			},
 			{
@@ -373,18 +291,12 @@
 					"created": "1967-05-05",
 					"myNewField": 1,
 					"originalName": "José Arcadio Buendía"
-				},
-				"pairedItem": {
-					"item": 1
 				}
 			},
 			{
 				"json": {
 					"error": "This is an error [line 5, for item 2]",
 					"originalName": "Max Sendak"
-				},
-				"pairedItem": {
-					"item": 2
 				}
 			},
 			{
@@ -397,9 +309,6 @@
 					"created": "1979-10-12",
 					"myNewField": 1,
 					"originalName": "Zaphod Beeblebrox"
-				},
-				"pairedItem": {
-					"item": 3
 				}
 			},
 			{
@@ -412,9 +321,6 @@
 					"created": "1950-10-16",
 					"myNewField": 1,
 					"originalName": "Edmund Pevensie"
-				},
-				"pairedItem": {
-					"item": 4
 				}
 			}
 		],
@@ -423,9 +329,6 @@
 				"json": {
 					"error": "This is an error [line 5, for item 0]",
 					"originalName": "Jay Gatsby"
-				},
-				"pairedItem": {
-					"item": 0
 				}
 			},
 			{
@@ -438,18 +341,12 @@
 					"created": "1967-05-05",
 					"myNewField": 1,
 					"originalName": "José Arcadio Buendía"
-				},
-				"pairedItem": {
-					"item": 1
 				}
 			},
 			{
 				"json": {
 					"error": "This is an error [line 5, for item 2]",
 					"originalName": "Max Sendak"
-				},
-				"pairedItem": {
-					"item": 2
 				}
 			},
 			{
@@ -462,9 +359,6 @@
 					"created": "1979-10-12",
 					"myNewField": 1,
 					"originalName": "Zaphod Beeblebrox"
-				},
-				"pairedItem": {
-					"item": 3
 				}
 			},
 			{
@@ -477,26 +371,20 @@
 					"created": "1950-10-16",
 					"myNewField": 1,
 					"originalName": "Edmund Pevensie"
-				},
-				"pairedItem": {
-					"item": 4
 				}
 			}
 		],
 		"Success1": [
 			{
 				"json": {
-					"id": "23423536",
-					"name": "Edmund Pevensie",
-					"email": "edmund@narnia.gov",
-					"notes": "Passionate sailor",
-					"country": "UK",
-					"created": "1950-10-16",
+					"id": "23423533",
+					"name": "José Arcadio Buendía",
+					"email": "jab@macondo.co",
+					"notes": "Lots of people named after him. Very confusing",
+					"country": "CO",
+					"created": "1967-05-05",
 					"myNewField": 1,
-					"originalName": "Edmund Pevensie"
-				},
-				"pairedItem": {
-					"item": 0
+					"originalName": "José Arcadio Buendía"
 				}
 			},
 			{
@@ -509,43 +397,22 @@
 					"created": "1979-10-12",
 					"myNewField": 1,
 					"originalName": "Zaphod Beeblebrox"
-				},
-				"pairedItem": {
-					"item": 1
 				}
 			},
 			{
 				"json": {
-					"id": "23423533",
-					"name": "José Arcadio Buendía",
-					"email": "jab@macondo.co",
-					"notes": "Lots of people named after him. Very confusing",
-					"country": "CO",
-					"created": "1967-05-05",
+					"id": "23423536",
+					"name": "Edmund Pevensie",
+					"email": "edmund@narnia.gov",
+					"notes": "Passionate sailor",
+					"country": "UK",
+					"created": "1950-10-16",
 					"myNewField": 1,
-					"originalName": "José Arcadio Buendía"
-				},
-				"pairedItem": {
-					"item": 2
+					"originalName": "Edmund Pevensie"
 				}
 			}
 		],
 		"Error1": [
-			{
-				"json": {
-					"id": "23423534",
-					"name": "Max Sendak",
-					"email": "info@in-and-out-of-weeks.org",
-					"notes": "Keeps rolling his terrible eyes",
-					"country": "US",
-					"created": "1963-04-09",
-					"error": "This is an error [line 5, for item 2]",
-					"originalName": "Max Sendak"
-				},
-				"pairedItem": {
-					"item": 0
-				}
-			},
 			{
 				"json": {
 					"id": "23423532",
@@ -556,9 +423,18 @@
 					"created": "1925-04-10",
 					"error": "This is an error [line 5, for item 0]",
 					"originalName": "Jay Gatsby"
-				},
-				"pairedItem": {
-					"item": 1
+				}
+			},
+			{
+				"json": {
+					"id": "23423534",
+					"name": "Max Sendak",
+					"email": "info@in-and-out-of-weeks.org",
+					"notes": "Keeps rolling his terrible eyes",
+					"country": "US",
+					"created": "1963-04-09",
+					"error": "This is an error [line 5, for item 2]",
+					"originalName": "Max Sendak"
 				}
 			}
 		],
@@ -573,9 +449,6 @@
 					"created": "1925-04-10",
 					"error": "This is an error [line 5, for item 0]",
 					"originalName": "Jay Gatsby"
-				},
-				"pairedItem": {
-					"item": 0
 				}
 			},
 			{
@@ -588,9 +461,70 @@
 					"created": "1963-04-09",
 					"error": "This is an error [line 5, for item 2]",
 					"originalName": "Max Sendak"
-				},
-				"pairedItem": {
-					"item": 1
+				}
+			}
+		],
+		"Error": [
+			{
+				"json": {
+					"id": "23423532",
+					"name": "Jay Gatsby",
+					"email": "gatsby@west-egg.com",
+					"notes": "Keeps asking about a green light??",
+					"country": "US",
+					"created": "1925-04-10",
+					"error": "This is an error [line 5, for item 0]",
+					"originalName": "Jay Gatsby"
+				}
+			},
+			{
+				"json": {
+					"id": "23423534",
+					"name": "Max Sendak",
+					"email": "info@in-and-out-of-weeks.org",
+					"notes": "Keeps rolling his terrible eyes",
+					"country": "US",
+					"created": "1963-04-09",
+					"error": "This is an error [line 5, for item 2]",
+					"originalName": "Max Sendak"
+				}
+			}
+		],
+		"Success": [
+			{
+				"json": {
+					"id": "23423533",
+					"name": "José Arcadio Buendía",
+					"email": "jab@macondo.co",
+					"notes": "Lots of people named after him. Very confusing",
+					"country": "CO",
+					"created": "1967-05-05",
+					"myNewField": 1,
+					"originalName": "José Arcadio Buendía"
+				}
+			},
+			{
+				"json": {
+					"id": "23423535",
+					"name": "Zaphod Beeblebrox",
+					"email": "captain@heartofgold.com",
+					"notes": "Felt like I was talking to more than one person",
+					"country": null,
+					"created": "1979-10-12",
+					"myNewField": 1,
+					"originalName": "Zaphod Beeblebrox"
+				}
+			},
+			{
+				"json": {
+					"id": "23423536",
+					"name": "Edmund Pevensie",
+					"email": "edmund@narnia.gov",
+					"notes": "Passionate sailor",
+					"country": "UK",
+					"created": "1950-10-16",
+					"myNewField": 1,
+					"originalName": "Edmund Pevensie"
 				}
 			}
 		]
@@ -725,10 +659,11 @@
 	"settings": {
 		"executionOrder": "v1"
 	},
-	"versionId": "e73e1eda-293c-4ee2-87b9-923873241774",
-	"id": "UgoluWRMeg7fPLCB",
+	"versionId": "94aaa2ce-558a-4fed-948a-09860174272a",
 	"meta": {
-		"instanceId": "021d3c82ba2d3bc090cbf4fc81c9312668bcc34297e022bb3438c5c88a43a5ff"
+		"templateCredsSetupCompleted": true,
+		"instanceId": "27cc9b56542ad45b38725555722c50a1c3fee1670bbb67980558314ee08517c4"
 	},
+	"id": "FJvJXVvjM5rw3sUM",
 	"tags": []
 }

From 145d0921b217bbd4b625beaacfa14429560bf51b Mon Sep 17 00:00:00 2001
From: Jon <jonathan.bennetts@gmail.com>
Date: Wed, 13 Nov 2024 15:40:00 +0000
Subject: [PATCH 15/19] fix(Google BigQuery Node): Add item index to insert
 error (#11702)

---
 .../Google/BigQuery/v2/actions/database/insert.operation.ts      | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/nodes-base/nodes/Google/BigQuery/v2/actions/database/insert.operation.ts b/packages/nodes-base/nodes/Google/BigQuery/v2/actions/database/insert.operation.ts
index 1eb66904b3..18d53996c1 100644
--- a/packages/nodes-base/nodes/Google/BigQuery/v2/actions/database/insert.operation.ts
+++ b/packages/nodes-base/nodes/Google/BigQuery/v2/actions/database/insert.operation.ts
@@ -275,6 +275,7 @@ export async function execute(this: IExecuteFunctions): Promise<INodeExecutionDa
 				: '';
 			throw new NodeOperationError(this.getNode(), `${failedMessage}${stoppedMessage}`, {
 				description: errors.join('\n, '),
+				itemIndex: i,
 			});
 		}
 

From 0fd684d90c830f8b0aab12b7f78a1fa5619c62c9 Mon Sep 17 00:00:00 2001
From: Michael Kret <88898367+michael-radency@users.noreply.github.com>
Date: Wed, 13 Nov 2024 18:10:34 +0200
Subject: [PATCH 16/19] feat: Github star button in-app (#11695)

---
 cypress/e2e/1-workflows.cy.ts                 |   4 +
 cypress/e2e/17-workflow-tags.cy.ts            |   2 +
 cypress/e2e/19-execution.cy.ts                |   1 +
 cypress/e2e/20-workflow-executions.cy.ts      |   1 +
 .../e2e/34-template-credentials-setup.cy.ts   |   1 +
 cypress/e2e/45-ai-assistant.cy.ts             |   1 +
 cypress/e2e/5-ndv.cy.ts                       |   3 +
 packages/editor-ui/package.json               |   1 +
 .../src/components/MainHeader/MainHeader.vue  |  47 +++++-
 pnpm-lock.yaml                                | 158 +++++-------------
 10 files changed, 97 insertions(+), 122 deletions(-)

diff --git a/cypress/e2e/1-workflows.cy.ts b/cypress/e2e/1-workflows.cy.ts
index a6683bbee4..eb93c07ee6 100644
--- a/cypress/e2e/1-workflows.cy.ts
+++ b/cypress/e2e/1-workflows.cy.ts
@@ -23,6 +23,7 @@ describe('Workflows', () => {
 	});
 
 	it('should create multiple new workflows using add workflow button', () => {
+		cy.viewport(1920, 1080);
 		[...Array(multipleWorkflowsCount).keys()].forEach(() => {
 			cy.visit(WorkflowsPage.url);
 			WorkflowsPage.getters.createWorkflowButton().click();
@@ -35,6 +36,7 @@ describe('Workflows', () => {
 	});
 
 	it('should search for a workflow', () => {
+		cy.viewport(1920, 1080);
 		// One Result
 		WorkflowsPage.getters.searchBar().type('Empty State Card Workflow');
 		WorkflowsPage.getters.workflowCards().should('have.length', 1);
@@ -60,6 +62,7 @@ describe('Workflows', () => {
 	});
 
 	it('should delete all the workflows', () => {
+		cy.viewport(1920, 1080);
 		WorkflowsPage.getters.workflowCards().should('have.length', multipleWorkflowsCount + 1);
 
 		WorkflowsPage.getters.workflowCards().each(($el) => {
@@ -75,6 +78,7 @@ describe('Workflows', () => {
 	});
 
 	it('should respect tag querystring filter when listing workflows', () => {
+		cy.viewport(1920, 1080);
 		WorkflowsPage.getters.newWorkflowButtonCard().click();
 
 		cy.createFixtureWorkflow('Test_workflow_2.json', getUniqueWorkflowName('My New Workflow'));
diff --git a/cypress/e2e/17-workflow-tags.cy.ts b/cypress/e2e/17-workflow-tags.cy.ts
index 26ea7cbe2c..e8dacca2b8 100644
--- a/cypress/e2e/17-workflow-tags.cy.ts
+++ b/cypress/e2e/17-workflow-tags.cy.ts
@@ -53,6 +53,7 @@ describe('Workflow tags', () => {
 	});
 
 	it('should detach a tag inline by clicking on X on tag pill', () => {
+		cy.viewport(1920, 1080);
 		wf.getters.createTagButton().click();
 		wf.actions.addTags(TEST_TAGS);
 		wf.getters.nthTagPill(1).click();
@@ -73,6 +74,7 @@ describe('Workflow tags', () => {
 	});
 
 	it('should not show non existing tag as a selectable option', () => {
+		cy.viewport(1920, 1080);
 		const NON_EXISTING_TAG = 'My Test Tag';
 
 		wf.getters.createTagButton().click();
diff --git a/cypress/e2e/19-execution.cy.ts b/cypress/e2e/19-execution.cy.ts
index 5be2399253..b8b30dd7a9 100644
--- a/cypress/e2e/19-execution.cy.ts
+++ b/cypress/e2e/19-execution.cy.ts
@@ -514,6 +514,7 @@ describe('Execution', () => {
 	});
 
 	it('should send proper payload for node rerun', () => {
+		cy.viewport(1920, 1080);
 		cy.createFixtureWorkflow('Multiple_trigger_node_rerun.json', 'Multiple trigger node rerun');
 
 		workflowPage.getters.zoomToFitButton().click();
diff --git a/cypress/e2e/20-workflow-executions.cy.ts b/cypress/e2e/20-workflow-executions.cy.ts
index 5788af171c..bfa9bca1d9 100644
--- a/cypress/e2e/20-workflow-executions.cy.ts
+++ b/cypress/e2e/20-workflow-executions.cy.ts
@@ -101,6 +101,7 @@ describe('Workflow Executions', () => {
 		});
 
 		it('should show workflow data in executions tab after hard reload and modify name and tags', () => {
+			cy.viewport(1920, 1080);
 			executionsTab.actions.switchToExecutionsTab();
 			checkMainHeaderELements();
 			workflowPage.getters.saveButton().find('button').should('not.exist');
diff --git a/cypress/e2e/34-template-credentials-setup.cy.ts b/cypress/e2e/34-template-credentials-setup.cy.ts
index 815f4b1ceb..a2f9a019f7 100644
--- a/cypress/e2e/34-template-credentials-setup.cy.ts
+++ b/cypress/e2e/34-template-credentials-setup.cy.ts
@@ -182,6 +182,7 @@ describe('Template credentials setup', () => {
 		});
 
 		it('should fill credentials from workflow editor', () => {
+			cy.viewport(1920, 1080);
 			templateCredentialsSetupPage.visitTemplateCredentialSetupPage(testTemplate.id);
 			templateCredentialsSetupPage.getters.skipLink().click();
 
diff --git a/cypress/e2e/45-ai-assistant.cy.ts b/cypress/e2e/45-ai-assistant.cy.ts
index 9b50fef44a..7f9c79e0e6 100644
--- a/cypress/e2e/45-ai-assistant.cy.ts
+++ b/cypress/e2e/45-ai-assistant.cy.ts
@@ -36,6 +36,7 @@ describe('AI Assistant::enabled', () => {
 	});
 
 	it('renders placeholder UI', () => {
+		cy.viewport(1920, 1080);
 		aiAssistant.getters.askAssistantFloatingButton().should('be.visible');
 		aiAssistant.getters.askAssistantFloatingButton().click();
 		aiAssistant.getters.askAssistantChat().should('be.visible');
diff --git a/cypress/e2e/5-ndv.cy.ts b/cypress/e2e/5-ndv.cy.ts
index 96b917d4c3..9ad1fceae1 100644
--- a/cypress/e2e/5-ndv.cy.ts
+++ b/cypress/e2e/5-ndv.cy.ts
@@ -66,6 +66,7 @@ describe('NDV', () => {
 	});
 
 	it('should disconect Switch outputs if rules order was changed', () => {
+		cy.viewport(1920, 1080);
 		cy.createFixtureWorkflow('NDV-test-switch_reorder.json', 'NDV test switch reorder');
 		workflowPage.actions.zoomToFit();
 
@@ -232,6 +233,7 @@ describe('NDV', () => {
 			ndv.getters.outputPanel().find('[class*=_pagination]').should('exist');
 		});
 		it('should display large schema', () => {
+			cy.viewport(1920, 1080);
 			cy.createFixtureWorkflow(
 				'Test_workflow_schema_test_pinned_data.json',
 				'NDV test schema view 2',
@@ -718,6 +720,7 @@ describe('NDV', () => {
 	});
 
 	it('Should open appropriate node creator after clicking on connection hint link', () => {
+		cy.viewport(1920, 1080);
 		const nodeCreator = new NodeCreator();
 		const hintMapper = {
 			Memory: 'AI Nodes',
diff --git a/packages/editor-ui/package.json b/packages/editor-ui/package.json
index 5d5c63a298..cc3744924c 100644
--- a/packages/editor-ui/package.json
+++ b/packages/editor-ui/package.json
@@ -74,6 +74,7 @@
     "vue": "catalog:frontend",
     "vue-agile": "^2.0.0",
     "vue-chartjs": "^5.2.0",
+    "vue-github-button": "^3.1.3",
     "vue-i18n": "^9.2.2",
     "vue-json-pretty": "2.2.4",
     "vue-markdown-render": "catalog:frontend",
diff --git a/packages/editor-ui/src/components/MainHeader/MainHeader.vue b/packages/editor-ui/src/components/MainHeader/MainHeader.vue
index 0625d2ff2c..67428421e0 100644
--- a/packages/editor-ui/src/components/MainHeader/MainHeader.vue
+++ b/packages/editor-ui/src/components/MainHeader/MainHeader.vue
@@ -18,6 +18,8 @@ import { useWorkflowsStore } from '@/stores/workflows.store';
 import { useExecutionsStore } from '@/stores/executions.store';
 import { usePushConnection } from '@/composables/usePushConnection';
 
+import GithubButton from 'vue-github-button';
+
 const router = useRouter();
 const route = useRoute();
 const locale = useI18n();
@@ -161,7 +163,7 @@ async function navigateToExecutionsView(openInNewTab: boolean) {
 </script>
 
 <template>
-	<div>
+	<div class="container">
 		<div :class="{ 'main-header': true, expanded: !uiStore.sidebarMenuCollapsed }">
 			<div v-show="!hideMenuBar" class="top-menu">
 				<WorkflowDetails
@@ -174,18 +176,35 @@ async function navigateToExecutionsView(openInNewTab: boolean) {
 					:active="workflow.active"
 					:read-only="readOnly"
 				/>
-				<TabBar
-					v-if="onWorkflowPage"
-					:items="tabBarItems"
-					:model-value="activeHeaderTab"
-					@update:model-value="onTabSelected"
-				/>
 			</div>
+			<TabBar
+				v-if="onWorkflowPage"
+				:items="tabBarItems"
+				:model-value="activeHeaderTab"
+				@update:model-value="onTabSelected"
+			/>
+		</div>
+		<div class="github-button">
+			<GithubButton
+				href="https://github.com/n8n-io/n8n"
+				:data-color-scheme="uiStore.appliedTheme"
+				data-size="large"
+				data-show-count="true"
+				aria-label="Star n8n-io/n8n on GitHub"
+				>Star</GithubButton
+			>
 		</div>
 	</div>
 </template>
 
 <style lang="scss">
+.container {
+	display: flex;
+	position: relative;
+	width: 100%;
+	align-items: center;
+}
+
 .main-header {
 	background-color: var(--color-background-xlight);
 	height: $header-height;
@@ -201,6 +220,18 @@ async function navigateToExecutionsView(openInNewTab: boolean) {
 	font-size: 0.9em;
 	height: $header-height;
 	font-weight: 400;
-	padding: 0 var(--spacing-m) 0 var(--spacing-xs);
+	padding: 0 var(--spacing-m) 0 var(--spacing-m);
+}
+
+.github-button {
+	display: flex;
+	position: relative;
+	align-items: center;
+	height: $header-height;
+	padding-left: var(--spacing-m);
+	padding-right: var(--spacing-m);
+	background-color: var(--color-background-xlight);
+	border-bottom: var(--border-width-base) var(--border-style-base) var(--color-foreground-base);
+	border-left: var(--border-width-base) var(--border-style-base) var(--color-foreground-base);
 }
 </style>
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 10e0fbf08b..dd9248e414 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -265,7 +265,7 @@ importers:
         version: 4.0.7
       axios:
         specifier: 'catalog:'
-        version: 1.7.4
+        version: 1.7.4(debug@4.3.7)
       dotenv:
         specifier: 8.6.0
         version: 8.6.0
@@ -333,7 +333,7 @@ importers:
     dependencies:
       axios:
         specifier: 'catalog:'
-        version: 1.7.4
+        version: 1.7.4(debug@4.3.7)
 
   packages/@n8n/codemirror-lang:
     dependencies:
@@ -407,7 +407,7 @@ importers:
         version: 3.666.0(@aws-sdk/client-sts@3.666.0)
       '@getzep/zep-cloud':
         specifier: 1.0.12
-        version: 1.0.12(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))(encoding@0.1.13)(langchain@0.3.5(7umjwzmwnymi4lyinuvazmp6ki))
+        version: 1.0.12(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))(encoding@0.1.13)(langchain@0.3.5(4ubssgvn2k3t3hxnzmxuoc2aja))
       '@getzep/zep-js':
         specifier: 0.9.0
         version: 0.9.0
@@ -434,7 +434,7 @@ importers:
         version: 0.3.1(@aws-sdk/client-sso-oidc@3.666.0(@aws-sdk/client-sts@3.666.0))(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))(encoding@0.1.13)
       '@langchain/community':
         specifier: 0.3.11
-        version: 0.3.11(simkpjwqw7qnwbripe37u5qu7a)
+        version: 0.3.11(tzffvezibmkr4px5bpuitcp7xu)
       '@langchain/core':
         specifier: 'catalog:'
         version: 0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8))
@@ -521,7 +521,7 @@ importers:
         version: 23.0.1
       langchain:
         specifier: 0.3.5
-        version: 0.3.5(7umjwzmwnymi4lyinuvazmp6ki)
+        version: 0.3.5(4ubssgvn2k3t3hxnzmxuoc2aja)
       lodash:
         specifier: 'catalog:'
         version: 4.17.21
@@ -774,7 +774,7 @@ importers:
         version: 1.11.0
       axios:
         specifier: 'catalog:'
-        version: 1.7.4
+        version: 1.7.4(debug@4.3.7)
       bcryptjs:
         specifier: 2.4.3
         version: 2.4.3
@@ -1093,7 +1093,7 @@ importers:
     dependencies:
       '@langchain/core':
         specifier: 'catalog:'
-        version: 0.3.15(openai@4.69.0(zod@3.23.8))
+        version: 0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8))
       '@n8n/client-oauth2':
         specifier: workspace:*
         version: link:../@n8n/client-oauth2
@@ -1105,7 +1105,7 @@ importers:
         version: 1.11.0
       axios:
         specifier: 'catalog:'
-        version: 1.7.4
+        version: 1.7.4(debug@4.3.7)
       concat-stream:
         specifier: 2.0.0
         version: 2.0.0
@@ -1395,7 +1395,7 @@ importers:
         version: 10.11.0(vue@3.5.11(typescript@5.6.2))
       axios:
         specifier: 'catalog:'
-        version: 1.7.4
+        version: 1.7.4(debug@4.3.7)
       bowser:
         specifier: 2.11.0
         version: 2.11.0
@@ -1477,6 +1477,9 @@ importers:
       vue-chartjs:
         specifier: ^5.2.0
         version: 5.2.0(chart.js@4.4.0)(vue@3.5.11(typescript@5.6.2))
+      vue-github-button:
+        specifier: ^3.1.3
+        version: 3.1.3
       vue-i18n:
         specifier: ^9.2.2
         version: 9.2.2(vue@3.5.11(typescript@5.6.2))
@@ -1872,7 +1875,7 @@ importers:
         version: 0.15.2
       axios:
         specifier: 'catalog:'
-        version: 1.7.4
+        version: 1.7.4(debug@4.3.7)
       callsites:
         specifier: 3.1.0
         version: 3.1.0
@@ -1918,7 +1921,7 @@ importers:
     devDependencies:
       '@langchain/core':
         specifier: 'catalog:'
-        version: 0.3.15(openai@4.69.0)
+        version: 0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8))
       '@types/deep-equal':
         specifier: ^1.0.1
         version: 1.0.1
@@ -5392,6 +5395,7 @@ packages:
   '@xmldom/xmldom@0.8.6':
     resolution: {integrity: sha512-uRjjusqpoqfmRkTaNuLJ2VohVr67Q5YwDATW3VU7PfzTj6IRaihGrYI7zckGZjxQPBIp63nfvJbM+Yu5ICh0Bg==}
     engines: {node: '>=10.0.0'}
+    deprecated: this version has critical issues, please update to the latest version
 
   a-sync-waterfall@1.0.1:
     resolution: {integrity: sha512-RYTOHHdWipFUliRFMCS4X2Yn2X8M87V/OpSqWzKKOGhzqyUxzyVmhHDH9sAvG+ZuQf/TAOFsLCpMw09I1ufUnA==}
@@ -7632,6 +7636,9 @@ packages:
   getpass@0.1.7:
     resolution: {integrity: sha512-0fzj9JxOLfJ+XGLhR8ze3unN0KZCgZwiSSDz168VERjK8Wl8kVSdcu2kspd4s4wtAa1y/qrVRiAA0WclVsu0ng==}
 
+  github-buttons@2.29.1:
+    resolution: {integrity: sha512-TV3YgAKda5hPz75n7QXmGCsSzgVya1vvmBieebg3EB5ScmashTZ0FldViG1aU2d4V5rcAGrtQ7k5uAaCo0A4PA==}
+
   github-from-package@0.0.0:
     resolution: {integrity: sha512-SyHy3T1v2NUXn29OsWdxmK6RwHD+vkj3v8en8AOBZ1wBQ/hCAQ5bAQTD02kW4W9tUp/3Qh6J8r9EvntiyCmOOw==}
 
@@ -12074,6 +12081,9 @@ packages:
     peerDependencies:
       eslint: '>=6.0.0'
 
+  vue-github-button@3.1.3:
+    resolution: {integrity: sha512-ZdOnUuYJL/wUsxISsC96TARzCdf1twaWooZoI14+g4RHsJltPY+Agw6Ox6pjuMqMX0uhSK1JOMFUFNCQGlcZGA==}
+
   vue-i18n@9.2.2:
     resolution: {integrity: sha512-yswpwtj89rTBhegUAv9Mu37LNznyu3NpyLQmozF3i1hYOhwpG8RjcjIFIIfnu+2MDZJGSZPXaKWvnQA71Yv9TQ==}
     engines: {node: '>= 14'}
@@ -14066,7 +14076,7 @@ snapshots:
   '@gar/promisify@1.1.3':
     optional: true
 
-  '@getzep/zep-cloud@1.0.12(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))(encoding@0.1.13)(langchain@0.3.5(7umjwzmwnymi4lyinuvazmp6ki))':
+  '@getzep/zep-cloud@1.0.12(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))(encoding@0.1.13)(langchain@0.3.5(4ubssgvn2k3t3hxnzmxuoc2aja))':
     dependencies:
       form-data: 4.0.0
       node-fetch: 2.7.0(encoding@0.1.13)
@@ -14075,7 +14085,7 @@ snapshots:
       zod: 3.23.8
     optionalDependencies:
       '@langchain/core': 0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8))
-      langchain: 0.3.5(7umjwzmwnymi4lyinuvazmp6ki)
+      langchain: 0.3.5(4ubssgvn2k3t3hxnzmxuoc2aja)
     transitivePeerDependencies:
       - encoding
 
@@ -14542,7 +14552,7 @@ snapshots:
       - aws-crt
       - encoding
 
-  '@langchain/community@0.3.11(simkpjwqw7qnwbripe37u5qu7a)':
+  '@langchain/community@0.3.11(tzffvezibmkr4px5bpuitcp7xu)':
     dependencies:
       '@ibm-cloud/watsonx-ai': 1.1.2
       '@langchain/core': 0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8))
@@ -14552,7 +14562,7 @@ snapshots:
       flat: 5.0.2
       ibm-cloud-sdk-core: 5.1.0
       js-yaml: 4.1.0
-      langchain: 0.3.5(7umjwzmwnymi4lyinuvazmp6ki)
+      langchain: 0.3.5(4ubssgvn2k3t3hxnzmxuoc2aja)
       langsmith: 0.2.3(openai@4.69.0(encoding@0.1.13)(zod@3.23.8))
       uuid: 10.0.0
       zod: 3.23.8
@@ -14565,7 +14575,7 @@ snapshots:
       '@aws-sdk/client-s3': 3.666.0
       '@aws-sdk/credential-provider-node': 3.666.0(@aws-sdk/client-sso-oidc@3.666.0(@aws-sdk/client-sts@3.666.0))(@aws-sdk/client-sts@3.666.0)
       '@azure/storage-blob': 12.18.0(encoding@0.1.13)
-      '@getzep/zep-cloud': 1.0.12(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))(encoding@0.1.13)(langchain@0.3.5(7umjwzmwnymi4lyinuvazmp6ki))
+      '@getzep/zep-cloud': 1.0.12(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))(encoding@0.1.13)(langchain@0.3.5(4ubssgvn2k3t3hxnzmxuoc2aja))
       '@getzep/zep-js': 0.9.0
       '@google-ai/generativelanguage': 2.6.0(encoding@0.1.13)
       '@google-cloud/storage': 7.12.1(encoding@0.1.13)
@@ -14629,38 +14639,6 @@ snapshots:
     transitivePeerDependencies:
       - openai
 
-  '@langchain/core@0.3.15(openai@4.69.0(zod@3.23.8))':
-    dependencies:
-      ansi-styles: 5.2.0
-      camelcase: 6.3.0
-      decamelize: 1.2.0
-      js-tiktoken: 1.0.12
-      langsmith: 0.2.3(openai@4.69.0(zod@3.23.8))
-      mustache: 4.2.0
-      p-queue: 6.6.2
-      p-retry: 4.6.2
-      uuid: 10.0.0
-      zod: 3.23.8
-      zod-to-json-schema: 3.23.3(zod@3.23.8)
-    transitivePeerDependencies:
-      - openai
-
-  '@langchain/core@0.3.15(openai@4.69.0)':
-    dependencies:
-      ansi-styles: 5.2.0
-      camelcase: 6.3.0
-      decamelize: 1.2.0
-      js-tiktoken: 1.0.12
-      langsmith: 0.2.3(openai@4.69.0)
-      mustache: 4.2.0
-      p-queue: 6.6.2
-      p-retry: 4.6.2
-      uuid: 10.0.0
-      zod: 3.23.8
-      zod-to-json-schema: 3.23.3(zod@3.23.8)
-    transitivePeerDependencies:
-      - openai
-
   '@langchain/google-common@0.1.1(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))(zod@3.23.8)':
     dependencies:
       '@langchain/core': 0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8))
@@ -15278,7 +15256,7 @@ snapshots:
 
   '@rudderstack/rudder-sdk-node@2.0.9(tslib@2.6.2)':
     dependencies:
-      axios: 1.7.4
+      axios: 1.7.4(debug@4.3.7)
       axios-retry: 3.7.0
       component-type: 1.2.1
       join-component: 1.1.0
@@ -17534,23 +17512,7 @@ snapshots:
       '@babel/runtime': 7.24.7
       is-retry-allowed: 2.2.0
 
-  axios@1.7.4:
-    dependencies:
-      follow-redirects: 1.15.6(debug@4.3.6)
-      form-data: 4.0.0
-      proxy-from-env: 1.1.0
-    transitivePeerDependencies:
-      - debug
-
   axios@1.7.4(debug@4.3.7):
-    dependencies:
-      follow-redirects: 1.15.6(debug@4.3.7)
-      form-data: 4.0.0
-      proxy-from-env: 1.1.0
-    transitivePeerDependencies:
-      - debug
-
-  axios@1.7.7:
     dependencies:
       follow-redirects: 1.15.6(debug@4.3.6)
       form-data: 4.0.0
@@ -19226,7 +19188,7 @@ snapshots:
 
   eslint-import-resolver-node@0.3.9:
     dependencies:
-      debug: 3.2.7(supports-color@5.5.0)
+      debug: 3.2.7(supports-color@8.1.1)
       is-core-module: 2.13.1
       resolve: 1.22.8
     transitivePeerDependencies:
@@ -19251,7 +19213,7 @@ snapshots:
 
   eslint-module-utils@2.8.0(@typescript-eslint/parser@7.2.0(eslint@8.57.0)(typescript@5.6.2))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.2.0(eslint@8.57.0)(typescript@5.6.2))(eslint-plugin-import@2.29.1)(eslint@8.57.0))(eslint@8.57.0):
     dependencies:
-      debug: 3.2.7(supports-color@5.5.0)
+      debug: 3.2.7(supports-color@8.1.1)
     optionalDependencies:
       '@typescript-eslint/parser': 7.2.0(eslint@8.57.0)(typescript@5.6.2)
       eslint: 8.57.0
@@ -19271,7 +19233,7 @@ snapshots:
       array.prototype.findlastindex: 1.2.3
       array.prototype.flat: 1.3.2
       array.prototype.flatmap: 1.3.2
-      debug: 3.2.7(supports-color@5.5.0)
+      debug: 3.2.7(supports-color@8.1.1)
       doctrine: 2.1.0
       eslint: 8.57.0
       eslint-import-resolver-node: 0.3.9
@@ -19983,6 +19945,8 @@ snapshots:
     dependencies:
       assert-plus: 1.0.0
 
+  github-buttons@2.29.1: {}
+
   github-from-package@0.0.0: {}
 
   github-slugger@2.0.0: {}
@@ -20062,7 +20026,7 @@ snapshots:
       array-parallel: 0.1.3
       array-series: 0.1.5
       cross-spawn: 4.0.2
-      debug: 3.2.7(supports-color@5.5.0)
+      debug: 3.2.7(supports-color@8.1.1)
     transitivePeerDependencies:
       - supports-color
 
@@ -20448,7 +20412,7 @@ snapshots:
 
   infisical-node@1.3.0:
     dependencies:
-      axios: 1.7.7
+      axios: 1.7.7(debug@4.3.6)
       dotenv: 16.3.1
       tweetnacl: 1.0.3
       tweetnacl-util: 0.15.1
@@ -21378,7 +21342,7 @@ snapshots:
 
   kuler@2.0.0: {}
 
-  langchain@0.3.5(7umjwzmwnymi4lyinuvazmp6ki):
+  langchain@0.3.5(4ubssgvn2k3t3hxnzmxuoc2aja):
     dependencies:
       '@langchain/core': 0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8))
       '@langchain/openai': 0.3.11(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))(encoding@0.1.13)
@@ -21402,7 +21366,7 @@ snapshots:
       '@langchain/groq': 0.1.2(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))(encoding@0.1.13)
       '@langchain/mistralai': 0.1.1(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))(encoding@0.1.13)
       '@langchain/ollama': 0.1.1(@langchain/core@0.3.15(openai@4.69.0(encoding@0.1.13)(zod@3.23.8)))
-      axios: 1.7.4
+      axios: 1.7.4(debug@4.3.7)
       cheerio: 1.0.0
       handlebars: 4.7.8
     transitivePeerDependencies:
@@ -21421,28 +21385,6 @@ snapshots:
     optionalDependencies:
       openai: 4.69.0(encoding@0.1.13)(zod@3.23.8)
 
-  langsmith@0.2.3(openai@4.69.0(zod@3.23.8)):
-    dependencies:
-      '@types/uuid': 10.0.0
-      commander: 10.0.1
-      p-queue: 6.6.2
-      p-retry: 4.6.2
-      semver: 7.6.0
-      uuid: 10.0.0
-    optionalDependencies:
-      openai: 4.69.0(zod@3.23.8)
-
-  langsmith@0.2.3(openai@4.69.0):
-    dependencies:
-      '@types/uuid': 10.0.0
-      commander: 10.0.1
-      p-queue: 6.6.2
-      p-retry: 4.6.2
-      semver: 7.6.0
-      uuid: 10.0.0
-    optionalDependencies:
-      openai: 4.69.0(zod@3.23.8)
-
   lazy-ass@1.6.0: {}
 
   ldapts@4.2.6:
@@ -22777,22 +22719,6 @@ snapshots:
       - encoding
       - supports-color
 
-  openai@4.69.0(zod@3.23.8):
-    dependencies:
-      '@types/node': 18.16.16
-      '@types/node-fetch': 2.6.4
-      abort-controller: 3.0.0
-      agentkeepalive: 4.2.1
-      form-data-encoder: 1.7.2
-      formdata-node: 4.4.1
-      node-fetch: 2.7.0(encoding@0.1.13)
-    optionalDependencies:
-      zod: 3.23.8
-    transitivePeerDependencies:
-      - encoding
-      - supports-color
-    optional: true
-
   openapi-sampler@1.5.1:
     dependencies:
       '@types/json-schema': 7.0.15
@@ -22973,7 +22899,7 @@ snapshots:
 
   pdf-parse@1.1.1:
     dependencies:
-      debug: 3.2.7(supports-color@5.5.0)
+      debug: 3.2.7(supports-color@8.1.1)
       node-ensure: 0.0.0
     transitivePeerDependencies:
       - supports-color
@@ -23175,7 +23101,7 @@ snapshots:
 
   posthog-node@3.2.1:
     dependencies:
-      axios: 1.7.7
+      axios: 1.7.7(debug@4.3.6)
       rusha: 0.8.14
     transitivePeerDependencies:
       - debug
@@ -23804,7 +23730,7 @@ snapshots:
 
   rhea@1.0.24:
     dependencies:
-      debug: 3.2.7(supports-color@5.5.0)
+      debug: 3.2.7(supports-color@8.1.1)
     transitivePeerDependencies:
       - supports-color
 
@@ -24180,7 +24106,7 @@ snapshots:
       asn1.js: 5.4.1
       asn1.js-rfc2560: 5.0.1(asn1.js@5.4.1)
       asn1.js-rfc5280: 3.0.0
-      axios: 1.7.7
+      axios: 1.7.7(debug@4.3.6)
       big-integer: 1.6.51
       bignumber.js: 9.1.2
       binascii: 0.0.2
@@ -25420,6 +25346,10 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  vue-github-button@3.1.3:
+    dependencies:
+      github-buttons: 2.29.1
+
   vue-i18n@9.2.2(vue@3.5.11(typescript@5.6.2)):
     dependencies:
       '@intlify/core-base': 9.2.2

From e28ec6ec014847590fdfd9a70c05ed63579f0863 Mon Sep 17 00:00:00 2001
From: Justin Ellingwood <justin@n8n.io>
Date: Wed, 13 Nov 2024 17:43:26 +0000
Subject: [PATCH 17/19] docs: Update npm package README.md to put minimum
 version to v18 (no-changelog) (#11726)

---
 packages/cli/README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/cli/README.md b/packages/cli/README.md
index 526f463167..0235c694da 100644
--- a/packages/cli/README.md
+++ b/packages/cli/README.md
@@ -48,7 +48,7 @@ It will download everything that is needed to start n8n.
 You can then access n8n by opening:
 [http://localhost:5678](http://localhost:5678)
 
-**Note:** The minimum required version for Node.js is v14.15. Make sure to update Node.js to v14.15 or above.
+**Note:** The minimum required version for Node.js is v18. Make sure to update Node.js to v18 or above.
 
 ### Run with Docker
 

From a91abeeff5f614e22741b6942a5cd8bc498a97fa Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 13 Nov 2024 16:53:54 +0000
Subject: [PATCH 18/19] :rocket: Release 1.68.0 (#11725)

Co-authored-by: ShireenMissi <94372015+ShireenMissi@users.noreply.github.com>
---
 CHANGELOG.md                               | 64 ++++++++++++++++++++++
 package.json                               |  2 +-
 packages/@n8n/chat/package.json            |  2 +-
 packages/@n8n/config/package.json          |  2 +-
 packages/@n8n/nodes-langchain/package.json |  2 +-
 packages/@n8n/task-runner/package.json     |  2 +-
 packages/cli/package.json                  |  2 +-
 packages/core/package.json                 |  2 +-
 packages/design-system/package.json        |  2 +-
 packages/editor-ui/package.json            |  2 +-
 packages/node-dev/package.json             |  2 +-
 packages/nodes-base/package.json           |  2 +-
 packages/workflow/package.json             |  2 +-
 13 files changed, 76 insertions(+), 12 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index f85ab264be..7c7a1e036f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,67 @@
+# [1.68.0](https://github.com/n8n-io/n8n/compare/n8n@1.67.0...n8n@1.68.0) (2024-11-13)
+
+
+### Bug Fixes
+
+* **AI Agent Node:** Throw better errors for non-tool agents when using structured tools ([#11582](https://github.com/n8n-io/n8n/issues/11582)) ([9b6123d](https://github.com/n8n-io/n8n/commit/9b6123dfb2648f880c7829211fa07666611ad0ea))
+* **Auto-fixing Output Parser Node:** Only run retry chain on parsing errors ([#11569](https://github.com/n8n-io/n8n/issues/11569)) ([21b31e4](https://github.com/n8n-io/n8n/commit/21b31e488ff6ab0bcf3c79edcd17b9e37d4c64a4))
+* **core:** Continue with error output reverse items in success branch ([#11684](https://github.com/n8n-io/n8n/issues/11684)) ([6d5ee83](https://github.com/n8n-io/n8n/commit/6d5ee832966fab96043b0d65697c059ced61d334))
+* **core:** Ensure task runner server closes websocket connection correctly ([#11633](https://github.com/n8n-io/n8n/issues/11633)) ([b496bf3](https://github.com/n8n-io/n8n/commit/b496bf3147d2cd873d24371be02cb7ea5dbd8621))
+* **core:** Handle websocket connection error more gracefully in task runners ([#11635](https://github.com/n8n-io/n8n/issues/11635)) ([af7d6e6](https://github.com/n8n-io/n8n/commit/af7d6e68d0436ff8a3d4e8410dc8ee4f3a035c44))
+* **core:** Improve model sub-nodes error handling ([#11418](https://github.com/n8n-io/n8n/issues/11418)) ([57467d0](https://github.com/n8n-io/n8n/commit/57467d0285d67509322630c4c01130022f274a41))
+* **core:** Make push work for waiting webhooks ([#11678](https://github.com/n8n-io/n8n/issues/11678)) ([600479b](https://github.com/n8n-io/n8n/commit/600479bf36ba8870d4aecacad19a2dc5f2d97959))
+* **core:** Revert all the context helpers changes ([#11616](https://github.com/n8n-io/n8n/issues/11616)) ([20fd38f](https://github.com/n8n-io/n8n/commit/20fd38f3517f7ef35604ba16abb4d951270b4d50))
+* **core:** Set the authentication methad to `email` during startup if the SAML configuration in the database has been corrupted ([#11600](https://github.com/n8n-io/n8n/issues/11600)) ([6439291](https://github.com/n8n-io/n8n/commit/6439291738dec16261979d6d835acbc63743d51a))
+* **core:** Use cached value in retrieval of personal project owner ([#11533](https://github.com/n8n-io/n8n/issues/11533)) ([04029d8](https://github.com/n8n-io/n8n/commit/04029d82a11b52990890380ba7094055b18e7c1f))
+* Credentials save button is hidden unless you make changes to the ([#11492](https://github.com/n8n-io/n8n/issues/11492)) ([835fbfe](https://github.com/n8n-io/n8n/commit/835fbfe337dd8dc0d0b0318c7227e174484e1328))
+* **editor:** Add stickies to node insert position conflict check allowlist ([#11624](https://github.com/n8n-io/n8n/issues/11624)) ([fc39e3c](https://github.com/n8n-io/n8n/commit/fc39e3ca16231c176957e2504d55df6b416874fe))
+* **editor:** Adjust Scrollbar Width of RunData Header Row ([#11561](https://github.com/n8n-io/n8n/issues/11561)) ([d17d76a](https://github.com/n8n-io/n8n/commit/d17d76a85d5425bc091d29fc84605ffbccbca984))
+* **editor:** Cap NDV Output View Tab Index to prevent rare edge case ([#11614](https://github.com/n8n-io/n8n/issues/11614)) ([a6c8ee4](https://github.com/n8n-io/n8n/commit/a6c8ee4a82e6055766dc1307f79c774c17bb5f4d))
+* **editor:** Do not show hover tooltip when autocomplete is active ([#11653](https://github.com/n8n-io/n8n/issues/11653)) ([23caf43](https://github.com/n8n-io/n8n/commit/23caf43e30342a21d45c825f438aa1e6193601d1))
+* **editor:** Enable pinning main output with error and always allow unpinning ([#11452](https://github.com/n8n-io/n8n/issues/11452)) ([40c8882](https://github.com/n8n-io/n8n/commit/40c88822acdcda6401bd92b9cf89d013c44b8453))
+* **editor:** Fix collapsing nested items in expression modal schema view ([#11645](https://github.com/n8n-io/n8n/issues/11645)) ([41dea52](https://github.com/n8n-io/n8n/commit/41dea522fbfb1c9acee51f47f384973914454b5f))
+* **editor:** Fix default workflow settings ([#11632](https://github.com/n8n-io/n8n/issues/11632)) ([658568e](https://github.com/n8n-io/n8n/commit/658568e2700bfd5b61da53f3052403d0098c2d90))
+* **editor:** Fix duplicate chat trigger ([#11693](https://github.com/n8n-io/n8n/issues/11693)) ([a025848](https://github.com/n8n-io/n8n/commit/a025848ec4be96f74d4de2ab104256b6d89bb837))
+* **editor:** Fix hiding SQL query output when trying to select ([#11649](https://github.com/n8n-io/n8n/issues/11649)) ([4dbf2f4](https://github.com/n8n-io/n8n/commit/4dbf2f4256111985b367030020f1494b8a8b95af))
+* **editor:** Fix scrolling in code edit modal ([#11647](https://github.com/n8n-io/n8n/issues/11647)) ([8f695f3](https://github.com/n8n-io/n8n/commit/8f695f3417820e7b9bb04b78972f6abbd61abbe8))
+* **editor:** Prevent error being thrown in RLC while loading ([#11676](https://github.com/n8n-io/n8n/issues/11676)) ([ca8cb45](https://github.com/n8n-io/n8n/commit/ca8cb455ba59831295c238afb11aeab6ad18428e))
+* **editor:** Prevent NodeCreator from swallowing AskAssistant enter event ([#11532](https://github.com/n8n-io/n8n/issues/11532)) ([db94f16](https://github.com/n8n-io/n8n/commit/db94f169fcd03983fc78a3b4c5e11543610825bf))
+* **editor:** Show node executing status shortly before switching to success on new canvas ([#11675](https://github.com/n8n-io/n8n/issues/11675)) ([b0ba24c](https://github.com/n8n-io/n8n/commit/b0ba24cbbc55cebc26e9f62ead7396c4c8fbd062))
+* **editor:** Show only error title and 'Open errored node' button; hide 'Ask Assistant' in root for sub-node errors ([#11573](https://github.com/n8n-io/n8n/issues/11573)) ([8cba100](https://github.com/n8n-io/n8n/commit/8cba1004888f60ca653ee069501c13b3cadcc561))
+* **Facebook Lead Ads Trigger Node:** Fix issue with optional fields ([#11692](https://github.com/n8n-io/n8n/issues/11692)) ([70d315b](https://github.com/n8n-io/n8n/commit/70d315b3d5b8f5f3e0f39527bba11e254a52028e))
+* **Google BigQuery Node:** Add item index to insert error ([#11702](https://github.com/n8n-io/n8n/issues/11702)) ([145d092](https://github.com/n8n-io/n8n/commit/145d0921b217bbd4b625beaacfa14429560bf51b))
+* **Google Drive Node:** Fix file upload for streams ([#11698](https://github.com/n8n-io/n8n/issues/11698)) ([770230f](https://github.com/n8n-io/n8n/commit/770230fbfe0b9e86527254e201c4602fbced94ff))
+* **In-Memory Vector Store Node:** Fix displaying execution data of connected embedding nodes ([#11701](https://github.com/n8n-io/n8n/issues/11701)) ([40ade15](https://github.com/n8n-io/n8n/commit/40ade151724f4af28a6ed959fd9363450ea711fd))
+* **Item List Output Parser Node:** Fix number of items parameter issue ([#11696](https://github.com/n8n-io/n8n/issues/11696)) ([01ebe9d](https://github.com/n8n-io/n8n/commit/01ebe9dd38629afbab954fb489f3ef2bb7ab5b34))
+* **n8n Form Node:** Find completion page ([#11674](https://github.com/n8n-io/n8n/issues/11674)) ([ed3ad6d](https://github.com/n8n-io/n8n/commit/ed3ad6d684597f7c4b7419dfa81d476e66f10eba))
+* **n8n Form Node:** Open form page if form trigger has pin data ([#11673](https://github.com/n8n-io/n8n/issues/11673)) ([f0492bd](https://github.com/n8n-io/n8n/commit/f0492bd3bb0d94802a2707fb1cf861313b6ea808))
+* **n8n Form Node:** Trigger page stack in waiting if error in workflow ([#11671](https://github.com/n8n-io/n8n/issues/11671)) ([94b5873](https://github.com/n8n-io/n8n/commit/94b5873248212a5500f02cf3c0d74df6f9d8fb26))
+* **n8n Form Trigger Node:** Checkboxes different sizes ([#11677](https://github.com/n8n-io/n8n/issues/11677)) ([c08d23c](https://github.com/n8n-io/n8n/commit/c08d23c00f01bb6fcb3b75f02e0338af375f9b32))
+* NDV search bugs ([#11613](https://github.com/n8n-io/n8n/issues/11613)) ([c32cf64](https://github.com/n8n-io/n8n/commit/c32cf644a6b8c21558e802449329877845de70b1))
+* **Notion Node:** Extract page url ([#11643](https://github.com/n8n-io/n8n/issues/11643)) ([cbdd535](https://github.com/n8n-io/n8n/commit/cbdd535fe0cb4e032ea82f008dcf35cc5f2264c2))
+* **Redis Chat Memory Node:** Respect the SSL flag from the credential ([#11689](https://github.com/n8n-io/n8n/issues/11689)) ([b5cbf75](https://github.com/n8n-io/n8n/commit/b5cbf7566d351d8a8e9972f13ff5867ff1c8d7d0))
+* **Supabase Node:** Reset query parameters in get many operation ([#11630](https://github.com/n8n-io/n8n/issues/11630)) ([7458229](https://github.com/n8n-io/n8n/commit/74582290c04d2dd32300b1a6c7715862ae837d34))
+* **Switch Node:** Maintain output connections ([#11162](https://github.com/n8n-io/n8n/issues/11162)) ([9bd79fc](https://github.com/n8n-io/n8n/commit/9bd79fceebc4453d0fe40ae5f628d5e31ff2b326))
+
+
+### Features
+
+* **AI Transform Node:** Show warning for binary data ([#11560](https://github.com/n8n-io/n8n/issues/11560)) ([ddbb263](https://github.com/n8n-io/n8n/commit/ddbb263dce0fc458abc95d850217251bb49d2b83))
+* **core:** Make all http requests made with `httpRequestWithAuthentication` abortable ([#11704](https://github.com/n8n-io/n8n/issues/11704)) ([0d8aada](https://github.com/n8n-io/n8n/commit/0d8aada49005d6a6078e8460003a0de61a8f423c))
+* **editor:** Improve how we show default Agent prompt and Memory session parameters ([#11491](https://github.com/n8n-io/n8n/issues/11491)) ([565f8cd](https://github.com/n8n-io/n8n/commit/565f8cd8c78b534a50e272997d659d162fa86625))
+* **editor:** Improve workflow loading performance on new canvas ([#11629](https://github.com/n8n-io/n8n/issues/11629)) ([f1e2df7](https://github.com/n8n-io/n8n/commit/f1e2df7d0753aa0f33cf299100a063bf89cc8b35))
+* **editor:** Redesign Canvas Chat ([#11634](https://github.com/n8n-io/n8n/issues/11634)) ([a412ab7](https://github.com/n8n-io/n8n/commit/a412ab7ebfcd6aa9051a8ca36e34f1067102c998))
+* **editor:** Restrict when a ChatTrigger Node is added automatically ([#11523](https://github.com/n8n-io/n8n/issues/11523)) ([93a6f85](https://github.com/n8n-io/n8n/commit/93a6f858fa3eb53f8b48b2a3d6b7377279dd6ed1))
+* Github star button in-app ([#11695](https://github.com/n8n-io/n8n/issues/11695)) ([0fd684d](https://github.com/n8n-io/n8n/commit/0fd684d90c830f8b0aab12b7f78a1fa5619c62c9))
+* **Oura Node:** Update node for v2 api ([#11604](https://github.com/n8n-io/n8n/issues/11604)) ([3348fbb](https://github.com/n8n-io/n8n/commit/3348fbb1547c430ff8707b298640e3461d3f6536))
+
+
+### Performance Improvements
+
+* **editor:** Add lint rules for optimization-friendly syntax ([#11681](https://github.com/n8n-io/n8n/issues/11681)) ([88295c7](https://github.com/n8n-io/n8n/commit/88295c70495ae3d017674d5745972a346fcbaf12))
+
+
+
 # [1.67.0](https://github.com/n8n-io/n8n/compare/n8n@1.66.0...n8n@1.67.0) (2024-11-06)
 
 
diff --git a/package.json b/package.json
index c7d4512b2e..bdf3221845 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "n8n-monorepo",
-  "version": "1.67.0",
+  "version": "1.68.0",
   "private": true,
   "engines": {
     "node": ">=20.15",
diff --git a/packages/@n8n/chat/package.json b/packages/@n8n/chat/package.json
index a6098892f0..6ad77655b4 100644
--- a/packages/@n8n/chat/package.json
+++ b/packages/@n8n/chat/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@n8n/chat",
-  "version": "0.30.0",
+  "version": "0.31.0",
   "scripts": {
     "dev": "pnpm run storybook",
     "build": "pnpm build:vite && pnpm build:bundle",
diff --git a/packages/@n8n/config/package.json b/packages/@n8n/config/package.json
index 4867390bf7..20d1aec726 100644
--- a/packages/@n8n/config/package.json
+++ b/packages/@n8n/config/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@n8n/config",
-  "version": "1.17.0",
+  "version": "1.18.0",
   "scripts": {
     "clean": "rimraf dist .turbo",
     "dev": "pnpm watch",
diff --git a/packages/@n8n/nodes-langchain/package.json b/packages/@n8n/nodes-langchain/package.json
index 38acd88c9a..23805646ee 100644
--- a/packages/@n8n/nodes-langchain/package.json
+++ b/packages/@n8n/nodes-langchain/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@n8n/n8n-nodes-langchain",
-  "version": "1.67.0",
+  "version": "1.68.0",
   "description": "",
   "main": "index.js",
   "scripts": {
diff --git a/packages/@n8n/task-runner/package.json b/packages/@n8n/task-runner/package.json
index 8350667099..b595fefe6e 100644
--- a/packages/@n8n/task-runner/package.json
+++ b/packages/@n8n/task-runner/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@n8n/task-runner",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "scripts": {
     "clean": "rimraf dist .turbo",
     "start": "node dist/start.js",
diff --git a/packages/cli/package.json b/packages/cli/package.json
index 5c589116ee..88f8438931 100644
--- a/packages/cli/package.json
+++ b/packages/cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "n8n",
-  "version": "1.67.0",
+  "version": "1.68.0",
   "description": "n8n Workflow Automation Tool",
   "main": "dist/index",
   "types": "dist/index.d.ts",
diff --git a/packages/core/package.json b/packages/core/package.json
index 8628aa92ef..5ad1ac4d5d 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "n8n-core",
-  "version": "1.67.0",
+  "version": "1.68.0",
   "description": "Core functionality of n8n",
   "main": "dist/index",
   "types": "dist/index.d.ts",
diff --git a/packages/design-system/package.json b/packages/design-system/package.json
index 94f1cba0aa..11da59ddaa 100644
--- a/packages/design-system/package.json
+++ b/packages/design-system/package.json
@@ -1,6 +1,6 @@
 {
   "name": "n8n-design-system",
-  "version": "1.57.0",
+  "version": "1.58.0",
   "main": "src/main.ts",
   "import": "src/main.ts",
   "scripts": {
diff --git a/packages/editor-ui/package.json b/packages/editor-ui/package.json
index cc3744924c..c9b866bb37 100644
--- a/packages/editor-ui/package.json
+++ b/packages/editor-ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "n8n-editor-ui",
-  "version": "1.67.0",
+  "version": "1.68.0",
   "description": "Workflow Editor UI for n8n",
   "main": "index.js",
   "scripts": {
diff --git a/packages/node-dev/package.json b/packages/node-dev/package.json
index 60e8ed6095..37a0c88f27 100644
--- a/packages/node-dev/package.json
+++ b/packages/node-dev/package.json
@@ -1,6 +1,6 @@
 {
   "name": "n8n-node-dev",
-  "version": "1.67.0",
+  "version": "1.68.0",
   "description": "CLI to simplify n8n credentials/node development",
   "main": "dist/src/index",
   "types": "dist/src/index.d.ts",
diff --git a/packages/nodes-base/package.json b/packages/nodes-base/package.json
index 539112b430..1de487f7ad 100644
--- a/packages/nodes-base/package.json
+++ b/packages/nodes-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "n8n-nodes-base",
-  "version": "1.67.0",
+  "version": "1.68.0",
   "description": "Base nodes of n8n",
   "main": "index.js",
   "scripts": {
diff --git a/packages/workflow/package.json b/packages/workflow/package.json
index bbb75b7540..16589e19c4 100644
--- a/packages/workflow/package.json
+++ b/packages/workflow/package.json
@@ -1,6 +1,6 @@
 {
   "name": "n8n-workflow",
-  "version": "1.66.0",
+  "version": "1.67.0",
   "description": "Workflow base code of n8n",
   "main": "dist/index.js",
   "module": "src/index.ts",

From 8a0ad0f910feeada6d0c63e81c3e97a1a6e44de7 Mon Sep 17 00:00:00 2001
From: Ivan Atanasov <ivan.atanasov@n8n.io>
Date: Thu, 14 Nov 2024 12:19:12 +0100
Subject: [PATCH 19/19] fix(editor): Improve formatting of expired trial error
 message (#11708)

---
 .vscode/launch.json                           |   4 +-
 .../src/composables/usePushConnection.test.ts | 111 ++++++++++++++++++
 .../src/composables/usePushConnection.ts      |   1 +
 .../src/composables/useToast.test.ts          |  55 +++++++++
 4 files changed, 168 insertions(+), 3 deletions(-)
 create mode 100644 packages/editor-ui/src/composables/useToast.test.ts

diff --git a/.vscode/launch.json b/.vscode/launch.json
index 448d745236..5501fe4439 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -47,9 +47,7 @@
 			"request": "launch",
 			"skipFiles": ["<node_internals>/**"],
 			"type": "node",
-			"env": {
-				// "N8N_PORT": "5679",
-			},
+			"envFile": "${workspaceFolder}/.env",
 			"outputCapture": "std",
 			"killBehavior": "polite"
 		},
diff --git a/packages/editor-ui/src/composables/usePushConnection.test.ts b/packages/editor-ui/src/composables/usePushConnection.test.ts
index c21fc76702..819b9e842e 100644
--- a/packages/editor-ui/src/composables/usePushConnection.test.ts
+++ b/packages/editor-ui/src/composables/usePushConnection.test.ts
@@ -5,6 +5,10 @@ import type { PushMessage, PushPayload } from '@n8n/api-types';
 import { usePushConnection } from '@/composables/usePushConnection';
 import { usePushConnectionStore } from '@/stores/pushConnection.store';
 import { useOrchestrationStore } from '@/stores/orchestration.store';
+import { useUIStore } from '@/stores/ui.store';
+import { useWorkflowsStore } from '@/stores/workflows.store';
+import { useToast } from '@/composables/useToast';
+import type { WorkflowOperationError } from 'n8n-workflow';
 
 vi.mock('vue-router', () => {
 	return {
@@ -16,6 +20,19 @@ vi.mock('vue-router', () => {
 	};
 });
 
+vi.mock('@/composables/useToast', () => {
+	const showMessage = vi.fn();
+	const showError = vi.fn();
+	return {
+		useToast: () => {
+			return {
+				showMessage,
+				showError,
+			};
+		},
+	};
+});
+
 vi.useFakeTimers();
 
 describe('usePushConnection()', () => {
@@ -23,6 +40,9 @@ describe('usePushConnection()', () => {
 	let pushStore: ReturnType<typeof usePushConnectionStore>;
 	let orchestrationStore: ReturnType<typeof useOrchestrationStore>;
 	let pushConnection: ReturnType<typeof usePushConnection>;
+	let uiStore: ReturnType<typeof useUIStore>;
+	let workflowsStore: ReturnType<typeof useWorkflowsStore>;
+	let toast: ReturnType<typeof useToast>;
 
 	beforeEach(() => {
 		setActivePinia(createPinia());
@@ -30,7 +50,14 @@ describe('usePushConnection()', () => {
 		router = vi.mocked(useRouter)();
 		pushStore = usePushConnectionStore();
 		orchestrationStore = useOrchestrationStore();
+		uiStore = useUIStore();
+		workflowsStore = useWorkflowsStore();
 		pushConnection = usePushConnection({ router });
+		toast = useToast();
+	});
+
+	afterEach(() => {
+		vi.restoreAllMocks();
 	});
 
 	describe('initialize()', () => {
@@ -106,5 +133,89 @@ describe('usePushConnection()', () => {
 				expect(result).toBeTruthy();
 			});
 		});
+
+		describe('executionFinished', () => {
+			it('should handle executionFinished event correctly', async () => {
+				const event: PushMessage = {
+					type: 'executionFinished',
+					data: {
+						executionId: '1',
+						data: {
+							data: {
+								resultData: {
+									runData: {},
+								},
+							},
+							finished: true,
+							mode: 'manual',
+							startedAt: new Date(),
+							stoppedAt: new Date(),
+							status: 'success',
+						},
+					},
+				};
+
+				workflowsStore.activeExecutionId = '1';
+				uiStore.isActionActive.workflowRunning = true;
+
+				const result = await pushConnection.pushMessageReceived(event);
+
+				expect(result).toBeTruthy();
+				expect(workflowsStore.workflowExecutionData).toBeDefined();
+				expect(uiStore.isActionActive['workflowRunning']).toBeTruthy();
+
+				expect(toast.showMessage).toHaveBeenCalledWith({
+					title: 'Workflow executed successfully',
+					type: 'success',
+				});
+			});
+
+			it('should handle isManualExecutionCancelled correctly', async () => {
+				const event: PushMessage = {
+					type: 'executionFinished',
+					data: {
+						executionId: '1',
+						data: {
+							data: {
+								startData: {},
+								resultData: {
+									runData: {
+										'Last Node': [],
+									},
+									lastNodeExecuted: 'Last Node',
+									error: {
+										message:
+											'Your trial has ended. <a href="https://app.n8n.cloud/account/change-plan">Upgrade now</a> to keep automating',
+										name: 'NodeApiError',
+										node: 'Last Node',
+									} as unknown as WorkflowOperationError,
+								},
+							},
+							startedAt: new Date(),
+							mode: 'manual',
+							status: 'running',
+						},
+					},
+				};
+
+				workflowsStore.activeExecutionId = '1';
+				uiStore.isActionActive['workflowRunning'] = true;
+
+				const result = await pushConnection.pushMessageReceived(event);
+
+				expect(useToast().showMessage).toHaveBeenCalledWith({
+					message:
+						'Your trial has ended. <a href="https://app.n8n.cloud/account/change-plan">Upgrade now</a> to keep automating',
+					title: 'Problem in node ‘Last Node‘',
+					type: 'error',
+					duration: 0,
+					dangerouslyUseHTMLString: true,
+				});
+
+				expect(result).toBeTruthy();
+				expect(workflowsStore.workflowExecutionData).toBeDefined();
+				expect(uiStore.isActionActive.workflowRunning).toBeTruthy();
+			});
+		});
 	});
 });
diff --git a/packages/editor-ui/src/composables/usePushConnection.ts b/packages/editor-ui/src/composables/usePushConnection.ts
index ea9f79d27e..a5976d35d4 100644
--- a/packages/editor-ui/src/composables/usePushConnection.ts
+++ b/packages/editor-ui/src/composables/usePushConnection.ts
@@ -423,6 +423,7 @@ export function usePushConnection({ router }: { router: ReturnType<typeof useRou
 							message: runDataExecutedErrorMessage,
 							type: 'error',
 							duration: 0,
+							dangerouslyUseHTMLString: true,
 						});
 					}
 				}
diff --git a/packages/editor-ui/src/composables/useToast.test.ts b/packages/editor-ui/src/composables/useToast.test.ts
new file mode 100644
index 0000000000..f476a29d70
--- /dev/null
+++ b/packages/editor-ui/src/composables/useToast.test.ts
@@ -0,0 +1,55 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { useToast } from './useToast';
+import { createPinia, setActivePinia } from 'pinia';
+import { ElNotification as Notification } from 'element-plus';
+
+vi.mock('element-plus', async () => {
+	const original = await vi.importActual('element-plus');
+	return {
+		...original,
+		ElNotification: vi.fn(),
+		ElTooltip: vi.fn(),
+	};
+});
+
+describe('useToast', () => {
+	let toast: ReturnType<typeof useToast>;
+
+	beforeEach(() => {
+		setActivePinia(createPinia());
+
+		toast = useToast();
+	});
+
+	afterEach(() => {
+		vi.restoreAllMocks();
+	});
+
+	it('should show a message', () => {
+		const messageData = { message: 'Test message', title: 'Test title' };
+		toast.showMessage(messageData);
+
+		expect(Notification).toHaveBeenCalledWith(
+			expect.objectContaining({
+				message: 'Test message',
+				title: 'Test title',
+			}),
+		);
+	});
+
+	it('should sanitize message and title', () => {
+		const messageData = {
+			message: '<script>alert("xss")</script>',
+			title: '<script>alert("xss")</script>',
+		};
+
+		toast.showMessage(messageData);
+
+		expect(Notification).toHaveBeenCalledWith(
+			expect.objectContaining({
+				message: 'alert("xss")',
+				title: 'alert("xss")',
+			}),
+		);
+	});
+});