mirror of
https://github.com/n8n-io/n8n.git
synced 2025-03-05 20:50:17 -08:00
dcf12867b3
Fixes: - Refactor connection snapping when dragging and enable it also for non-main connection types - Fix propagation of errors from sub-nodes - Fix chat scrolling when sending/receiving messages - Prevent empty chat messages - Fix sub-node selected styles - Fix output names text overflow Usability improvements: - Auto-add manual chat trigger for agents & chain nodes - Various labels and description updates - Make the output parser input optional for Basic LLM Chain - Summarization Chain V2 with a simplified document loader & text chunking mode #### How to test the change: Example workflow showcasing different operation mode of the new summarization chain: [Summarization_V2.json](https://github.com/n8n-io/n8n/files/13599901/Summarization_V2.json) ## Issues fixed Include links to Github issue or Community forum post or **Linear ticket**: > Important in order to close automatically and provide context to reviewers - https://www.notion.so/n8n/David-Langchain-Posthog-notes-7a9294938420403095f4508f1a21d31d - https://linear.app/n8n/issue/N8N-7070/ux-fixes-batch - https://linear.app/n8n/issue/N8N-7071/ai-sub-node-bugs ## Review / Merge checklist - [x] PR title and summary are descriptive. **Remember, the title automatically goes into the changelog. Use `(no-changelog)` otherwise.** ([conventions](https://github.com/n8n-io/n8n/blob/master/.github/pull_request_title_conventions.md)) - [x] [Docs updated](https://github.com/n8n-io/n8n-docs) or follow-up ticket created. - [ ] Tests included. > A bug is not considered fixed, unless a test is added to prevent it from happening again. A feature is not complete without tests. > > *(internal)* You can use Slack commands to trigger [e2e tests](https://www.notion.so/n8n/How-to-use-Test-Instances-d65f49dfc51f441ea44367fb6f67eb0a?pvs=4#a39f9e5ba64a48b58a71d81c837e8227) or [deploy test instance](https://www.notion.so/n8n/How-to-use-Test-Instances-d65f49dfc51f441ea44367fb6f67eb0a?pvs=4#f6a177d32bde4b57ae2da0b8e454bfce) or [deploy early access version on Cloud](https://www.notion.so/n8n/Cloudbot-3dbe779836004972b7057bc989526998?pvs=4#fef2d36ab02247e1a0f65a74f6fb534e). --------- Signed-off-by: Oleg Ivaniv <me@olegivaniv.com> Co-authored-by: Elias Meire <elias@meire.dev>
147 lines
3.2 KiB
Vue
147 lines
3.2 KiB
Vue
<script setup lang="ts">
|
|
import { useI18n } from '@/composables/useI18n';
|
|
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
|
|
import N8nTooltip from '../N8nTooltip';
|
|
import { ElTag } from 'element-plus';
|
|
|
|
export interface Props {
|
|
active?: boolean;
|
|
isAi?: boolean;
|
|
isTrigger?: boolean;
|
|
description?: string;
|
|
tag?: string;
|
|
title: string;
|
|
showActionArrow?: boolean;
|
|
}
|
|
|
|
defineProps<Props>();
|
|
|
|
defineEmits<{
|
|
(event: 'tooltipClick', $e: MouseEvent): void;
|
|
}>();
|
|
|
|
const i18n = useI18n();
|
|
</script>
|
|
|
|
<template>
|
|
<div
|
|
:class="{
|
|
[$style.creatorNode]: true,
|
|
[$style.hasAction]: !showActionArrow,
|
|
}"
|
|
v-bind="$attrs"
|
|
>
|
|
<div :class="$style.nodeIcon">
|
|
<slot name="icon" />
|
|
</div>
|
|
<div>
|
|
<div :class="$style.details">
|
|
<span :class="$style.name" v-text="title" data-test-id="node-creator-item-name" />
|
|
<el-tag v-if="tag" :class="$style.tag" size="small" round type="success">
|
|
{{ tag }}
|
|
</el-tag>
|
|
<font-awesome-icon
|
|
icon="bolt"
|
|
v-if="isTrigger"
|
|
size="xs"
|
|
:title="i18n.baseText('nodeCreator.nodeItem.triggerIconTitle')"
|
|
:class="$style.triggerIcon"
|
|
/>
|
|
<n8n-tooltip
|
|
v-if="!!$slots.tooltip"
|
|
placement="top"
|
|
data-test-id="node-creator-item-tooltip"
|
|
>
|
|
<template #content>
|
|
<slot name="tooltip" />
|
|
</template>
|
|
<n8n-icon :class="$style.tooltipIcon" icon="cube" />
|
|
</n8n-tooltip>
|
|
</div>
|
|
<p
|
|
v-if="description"
|
|
data-test-id="node-creator-item-description"
|
|
:class="$style.description"
|
|
v-text="description"
|
|
/>
|
|
</div>
|
|
<slot name="dragContent" />
|
|
<button :class="$style.panelIcon" v-if="showActionArrow">
|
|
<font-awesome-icon :class="$style.panelArrow" icon="arrow-right" />
|
|
</button>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss" module>
|
|
.creatorNode {
|
|
display: flex;
|
|
align-items: center;
|
|
cursor: pointer;
|
|
z-index: 1;
|
|
padding: var(--spacing-xs) var(--spacing-2xs) var(--spacing-xs) 0;
|
|
|
|
&.hasAction {
|
|
user-select: none;
|
|
}
|
|
}
|
|
.creatorNode:hover .panelIcon {
|
|
color: var(--action-arrow-color-hover, var(--color-text-light));
|
|
}
|
|
.tag {
|
|
margin-left: var(--spacing-2xs);
|
|
}
|
|
.panelIcon {
|
|
flex-grow: 1;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
margin-left: var(--spacing-2xs);
|
|
color: var(--action-arrow-color, var(--color-text-lighter));
|
|
cursor: pointer;
|
|
background: transparent;
|
|
border: none;
|
|
}
|
|
.tooltipIcon {
|
|
margin-left: var(--spacing-3xs);
|
|
}
|
|
.panelArrow {
|
|
font-size: var(--font-size-2xs);
|
|
width: 12px;
|
|
}
|
|
.details {
|
|
align-items: center;
|
|
}
|
|
.nodeIcon {
|
|
display: flex;
|
|
margin-right: var(--node-icon-margin-right, var(--spacing-s));
|
|
}
|
|
.name {
|
|
font-weight: var(--node-creator-name-weight, var(--font-weight-bold));
|
|
font-size: var(--node-creator-name-size, var(--font-size-s));
|
|
line-height: 1.115rem;
|
|
}
|
|
.description {
|
|
margin-top: var(--spacing-5xs);
|
|
font-size: var(--font-size-2xs);
|
|
line-height: 1rem;
|
|
font-weight: 400;
|
|
color: var(--node-creator-description-colos, var(--color-text-base));
|
|
}
|
|
|
|
.aiIcon {
|
|
margin-left: var(--spacing-3xs);
|
|
color: var(--color-secondary);
|
|
}
|
|
|
|
.triggerIcon {
|
|
margin-left: var(--spacing-3xs);
|
|
color: var(--color-primary);
|
|
}
|
|
</style>
|
|
|
|
<style lang="scss" scoped>
|
|
.el-tooltip svg {
|
|
color: var(--color-foreground-xdark);
|
|
}
|
|
</style>
|