UNPKG

n8n-editor-ui

Version:

Workflow Editor UI for n8n

119 lines (118 loc) 4.67 kB
import { C as computed, _t as watch } from "./vue.runtime.esm-bundler-tP5dCd7J.js"; import { v as useRoute } from "./truncate-B1HVeveJ.js"; import { Dc as ASSISTANT_ENABLED_VIEWS, Ec as STORES, Oc as BUILDER_ENABLED_VIEWS, gs as useSettingsStore, oa as useUIStore, t as useBuilderStore } from "./builder.store-sBTWwxRU.js"; import { Hc as ASK_AI_SLIDE_OUT_DURATION_MS, Io as EDITABLE_CANVAS_VIEWS } from "./constants-BbpucWL4.js"; import { k as defineStore } from "./_baseOrderBy-B_6CV8x6.js"; import { r as useChatPanelStateStore, t as useAssistantStore } from "./assistant.store-bS9AHOoo.js"; function isEnabledView(route, views) { return typeof route === "string" && views.includes(route); } const useChatPanelStore = defineStore(STORES.CHAT_PANEL, () => { const uiStore = useUIStore(); const route = useRoute(); const chatPanelStateStore = useChatPanelStateStore(); const settingsStore = useSettingsStore(); const isAssistantModeActive = computed(() => chatPanelStateStore.activeMode === "assistant"); const isBuilderModeActive = computed(() => chatPanelStateStore.activeMode === "builder"); const canShowAiButtonOnCanvas = computed(() => settingsStore.isAiAssistantOrBuilderEnabled && EDITABLE_CANVAS_VIEWS.includes(route.name)); async function open(options) { const mode = options?.mode; if (mode) chatPanelStateStore.activeMode = mode; const enabledViews = chatPanelStateStore.activeMode === "assistant" ? ASSISTANT_ENABLED_VIEWS : BUILDER_ENABLED_VIEWS; const currentRoute = route?.name; if (!isEnabledView(currentRoute, enabledViews)) { close(); return; } chatPanelStateStore.isOpen = true; if (chatPanelStateStore.activeMode === "builder") { const builderStore = useBuilderStore(); if (!builderStore.streaming && builderStore.chatMessages.length === 0) { builderStore.fetchBuilderCredits(); builderStore.loadSessions(); } } else if (chatPanelStateStore.activeMode === "assistant") { const assistantStore = useAssistantStore(); assistantStore.chatMessages = assistantStore.chatMessages.map((msg) => ({ ...msg, read: true })); } uiStore.appGridDimensions = { ...uiStore.appGridDimensions, width: window.innerWidth - chatPanelStateStore.width }; } function close() { chatPanelStateStore.isOpen = false; setTimeout(() => { uiStore.appGridDimensions = { ...uiStore.appGridDimensions, width: window.innerWidth }; const assistantStore = useAssistantStore(); const builderStore = useBuilderStore(); if (assistantStore.isSessionEnded) assistantStore.resetAssistantChat(); if (!builderStore.streaming) builderStore.resetBuilderChat(); }, 250); } async function toggle(options) { if (chatPanelStateStore.isOpen) close(); else await open(options); } function switchMode(mode) { const enabledViews = mode === "assistant" ? ASSISTANT_ENABLED_VIEWS : BUILDER_ENABLED_VIEWS; const currentRoute = route?.name; if (!isEnabledView(currentRoute, enabledViews)) { close(); return; } chatPanelStateStore.activeMode = mode; } function updateWidth(newWidth) { const clampedWidth = Math.min(Math.max(newWidth, 380), 425); chatPanelStateStore.width = clampedWidth; if (chatPanelStateStore.isOpen) uiStore.appGridDimensions = { ...uiStore.appGridDimensions, width: window.innerWidth - clampedWidth }; } async function openWithCredHelp(credentialType) { await useAssistantStore().initCredHelp(credentialType); await open({ mode: "assistant" }); } async function openWithErrorHelper(context) { await useAssistantStore().initErrorHelper(context); await open({ mode: "assistant" }); } watch(() => route?.name, (newRoute) => { if (!newRoute) return; const builderStore = useBuilderStore(); if (!chatPanelStateStore.isOpen && builderStore.streaming && isEnabledView(newRoute, BUILDER_ENABLED_VIEWS)) { open({ mode: "builder" }); return; } if (!chatPanelStateStore.isOpen) return; if (!isEnabledView(newRoute, chatPanelStateStore.activeMode === "assistant" ? ASSISTANT_ENABLED_VIEWS : BUILDER_ENABLED_VIEWS)) close(); else if (isEnabledView(newRoute, BUILDER_ENABLED_VIEWS) && !builderStore.streaming) builderStore.resetBuilderChat(); }); return { isOpen: computed(() => chatPanelStateStore.isOpen), width: computed(() => chatPanelStateStore.width), activeMode: computed(() => chatPanelStateStore.activeMode), isAssistantModeActive, isBuilderModeActive, canShowAiButtonOnCanvas, open, close, toggle, switchMode, updateWidth, openWithCredHelp, openWithErrorHelper, DEFAULT_CHAT_WIDTH: 400, MIN_CHAT_WIDTH: 380, MAX_CHAT_WIDTH: 425 }; }); export { useChatPanelStore as t };