👌 Fix code snippet overflow, placeholder text and telemetry events

n8n-io · Sep 5, 2024 · 900095c · 900095c
1 parent f6d99fb
commit 900095c
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 24 deletions.
diff --git a/packages/design-system/src/components/AskAssistantChat/AskAssistantChat.stories.ts b/packages/design-system/src/components/AskAssistantChat/AskAssistantChat.stories.ts
@@ -262,7 +262,7 @@ WithCodeSnippet.args = {
 			content:
 				'To filter every other item in the Code node, you can use the following JavaScript code snippet. This code will iterate through the incoming items and only pass through every other item.',
 			codeSnippet:
-				'```javascript\nconst filteredItems = items.filter((item, index) => index % 2 === 0);\nreturn filteredItems;\n```',
+				"node.on('input', function(msg) {\n  if (msg.seed) { dummyjson.seed = msg.seed; }\n  try {\n      var value = dummyjson.parse(node.template, {mockdata: msg});\n      if (node.syntax === 'json') {\n          try { value = JSON.parse(value); }\n          catch(e) { node.error(RED._('datagen.errors.json-error')); }\n      }\n      if (node.fieldType === 'msg') {\n          RED.util.setMessageProperty(msg,node.field,value);\n      }\n      else if (node.fieldType === 'flow') {\n          node.context().flow.set(node.field,value);\n      }\n      else if (node.fieldType === 'global') {\n          node.context().global.set(node.field,value);\n      }\n      node.send(msg);\n  }\n  catch(e) {",
 			read: true,
 		},
 	]),

diff --git a/packages/design-system/src/components/AskAssistantChat/AskAssistantChat.vue b/packages/design-system/src/components/AskAssistantChat/AskAssistantChat.vue
@@ -254,9 +254,6 @@ function growInput() {
 					<p>
 						{{ t('assistantChat.placeholder.4') }}
 					</p>
-					<p>
-						{{ t('assistantChat.placeholder.5') }}
-					</p>
 				</div>
 			</div>
 		</div>
@@ -422,8 +419,9 @@ p {
 	background-color: var(--color-foreground-xlight);
 	border-radius: var(--border-radius-base);
 	padding: var(--spacing-2xs);
-	max-height: 218px; // 12 lines
 	font-family: var(--font-family-monospace);
+	max-height: 218px; // 12 lines
+	overflow: auto;
 
 	pre {
 		white-space-collapse: collapse;

diff --git a/packages/design-system/src/locale/lang/en.ts b/packages/design-system/src/locale/lang/en.ts
@@ -42,9 +42,7 @@ export default {
 		'I can answer most questions about building workflows in n8n.',
 	'assistantChat.placeholder.2': 'For specific tasks, you’ll see the',
 	'assistantChat.placeholder.3': 'button in the UI.',
-	'assistantChat.placeholder.4':
-		'Clicking it starts a context-aware session, often leading to better results with less effort for you.',
-	'assistantChat.placeholder.5': 'How can I help?',
+	'assistantChat.placeholder.4': 'How can I help?',
 	'assistantChat.inputPlaceholder': 'Enter your response...',
 	'inlineAskAssistantButton.asked': 'Asked',
 } as N8nLocale;
diff --git a/packages/editor-ui/src/components/NDVFloatingNodes.vue b/packages/editor-ui/src/components/NDVFloatingNodes.vue
@@ -143,7 +143,7 @@ defineExpose({
 
 <style lang="scss" module>
 .floatingNodes {
-	position: fixed;
+	position: absolute;
 	bottom: 0;
 	top: 0;
 	right: 0;

diff --git a/packages/editor-ui/src/stores/assistant.store.ts b/packages/editor-ui/src/stores/assistant.store.ts
@@ -275,19 +275,14 @@ export const useAssistantStore = defineStore(STORES.ASSISTANT, () => {
 				'Assistant session started',
 				{
 					chat_session_id: currentSessionId.value,
-					task: 'error',
+					task: isSupportChatSessionInProgress.value ? 'support' : 'error',
 				},
 				{ withPostHog: true },
 			);
 			// Track first user message in support chat now that we have a session id
 			if (usersMessages.value.length === 1 && isSupportChatSessionInProgress.value) {
 				const firstUserMessage = usersMessages.value[0] as ChatUI.TextMessage;
-				telemetry.track('User sent message in Assistant', {
-					message: firstUserMessage.content,
-					is_quick_reply: false,
-					chat_session_id: currentSessionId.value,
-					message_number: 1,
-				});
+				trackUserMessage(firstUserMessage.content, false);
 			}
 		} else if (currentSessionId.value !== response.sessionId) {
 			return;
@@ -483,20 +478,26 @@ export const useAssistantStore = defineStore(STORES.ASSISTANT, () => {
 				() => onDoneStreaming(id),
 				(e) => handleServiceError(e, id),
 			);
-			if (currentSessionId.value) {
-				telemetry.track('User sent message in Assistant', {
-					message: chatMessage.text,
-					is_quick_reply: !!chatMessage.quickReplyType,
-					chat_session_id: currentSessionId.value,
-					message_number: usersMessages.value.length,
-				});
-			}
+			trackUserMessage(chatMessage.text, !!chatMessage.quickReplyType);
 		} catch (e: unknown) {
 			// in case of assert
 			handleServiceError(e, id);
 		}
 	}
 
+	function trackUserMessage(message: string, isQuickReply: boolean) {
+		if (!currentSessionId.value) {
+			return;
+		}
+		telemetry.track('User sent message in Assistant', {
+			message,
+			is_quick_reply: isQuickReply,
+			chat_session_id: currentSessionId.value,
+			message_number: usersMessages.value.length,
+			task: isSupportChatSessionInProgress.value ? 'support' : 'error',
+		});
+	}
+
 	function updateParameters(nodeName: string, parameters: INodeParameters) {
 		if (ndvStore.activeNodeName === nodeName) {
 			Object.keys(parameters).forEach((key) => {