mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2024-12-24 20:24:05 -08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

feat(editor): Add AI Chat button to new canvas (no-changelog) (#10166)

Browse source
This commit is contained in:
Alex Grozav 2024-07-24 12:10:02 +03:00 committed by GitHub
parent fe1a1d80c6
commit ea5382d20f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 40 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
packages/editor-ui/src/components/canvas/elements/buttons/CanvasChatButton.spec.ts Normal file
View file

@ -0,0 +1,12 @@
import { createComponentRenderer } from '@/__tests__/render';
import CanvasChatButton from './CanvasChatButton.vue';
const renderComponent = createComponentRenderer(CanvasChatButton);
describe('CanvasChatButton', () => {
it('should render correctly', () => {
const wrapper = renderComponent();
expect(wrapper.html()).toMatchSnapshot();
});
});

9
packages/editor-ui/src/components/canvas/elements/buttons/CanvasChatButton.vue Normal file
View file

@ -0,0 +1,9 @@
<template>
<N8nButton
label="Chat"
size="large"
icon="comment"
type="primary"
data-test-id="workflow-chat-button"
/>
</template>

2
packages/editor-ui/src/components/canvas/elements/buttons/CanvasClearExecutionDataButton.vue
View file

@ -4,7 +4,7 @@ import { useI18n } from '@/composables/useI18n';
const i18n = useI18n();
</script>
<template>
<n8n-icon-button
<N8nIconButton
:title="i18n.baseText('nodeView.deletesTheCurrentExecutionData')"
icon="trash"
size="large"

2
packages/editor-ui/src/components/canvas/elements/buttons/CanvasStopCurrentExecutionButton.vue
View file

@ -16,7 +16,7 @@ const title = computed(() =>
</script>
<template>
<n8n-icon-button
<N8nIconButton
icon="stop"
size="large"
class="stop-execution"

2
packages/editor-ui/src/components/canvas/elements/buttons/CanvasStopWaitingForWebhookButton.vue
View file

@ -4,7 +4,7 @@ import { useI18n } from '@/composables/useI18n';
const i18n = useI18n();
</script>
<template>
<n8n-icon-button
<N8nIconButton
class="stop-execution"
icon="stop"
size="large"

3
packages/editor-ui/src/components/canvas/elements/buttons/__snapshots__/CanvasChatButton.spec.ts.snap Normal file
View file

@ -0,0 +1,3 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`CanvasChatButton > should render correctly 1`] = `"<button class="button button primary large withIcon" aria-live="polite" data-test-id="workflow-chat-button"><span class="icon"><span class="n8n-text compact size-large regular n8n-icon n8n-icon"><svg class="svg-inline--fa fa-comment fa-w-16 large" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="comment" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path class="" fill="currentColor" d="M256 32C114.6 32 0 125.1 0 240c0 49.6 21.4 95 57 130.7C44.5 421.1 2.7 466 2.2 466.5c-2.2 2.3-2.8 5.7-1.5 8.7S4.8 480 8 480c66.3 0 116-31.8 140.6-51.4 32.7 12.3 69 19.4 107.4 19.4 141.4 0 256-93.1 256-208S397.4 32 256 32z"></path></svg></span></span><span>Chat</span></button>"`;

13
packages/editor-ui/src/views/NodeView.v2.vue
View file

@ -50,6 +50,7 @@ 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';
@ -1090,6 +1091,17 @@ const chatTriggerNodePinnedData = computed(() => {
return workflowsStore.pinDataByNodeName(chatTriggerNode.value.name);
});
async function onOpenChat() {
uiStore.openModal(WORKFLOW_LM_CHAT_MODAL_KEY);
const payload = {
workflow_id: workflowId.value,
};
void externalHooks.run('nodeView.onOpenChat', payload);
telemetry.track('User clicked chat open button', payload);
}
/**
* History events
*/
@ -1518,6 +1530,7 @@ onBeforeUnmount(() => {
@mouseleave="onRunWorkflowButtonMouseLeave"
@click="onRunWorkflow"
/>
<CanvasChatButton v-if="containsChatTriggerNodes" @click="onOpenChat" />
<CanvasStopCurrentExecutionButton
v-if="isStopExecutionButtonVisible"
:stopping="isStoppingExecution"