UNPKG

n8n-editor-ui

Version:

Workflow Editor UI for n8n

2 lines 17.9 kB
(function(){try{var e=typeof window<`u`?window:typeof global<`u`?global:typeof globalThis<`u`?globalThis:typeof self<`u`?self:{};e.SENTRY_RELEASE={id:`n8n@2.16.1`}}catch{}})();try{(function(){var e=typeof window<`u`?window:typeof global<`u`?global:typeof globalThis<`u`?globalThis:typeof self<`u`?self:{},t=new e.Error().stack;t&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[t]=`d0bca1f7-ca5a-4fe7-9a75-9db8e2069083`,e._sentryDebugIdIdentifier=`sentry-dbid-d0bca1f7-ca5a-4fe7-9a75-9db8e2069083`)})()}catch{}import{o as e}from"./chunk-CACdhNlC.js";import{$ as t,A as n,C as r,E as i,Ft as a,N as o,S as s,Sn as c,T as l,W as u,Wt as d,X as f,_ as p,_n as m,at as h,dt as g,gt as _,h as v,j as y,pt as b,rt as ee,w as x,yt as S}from"./vue.runtime.esm-bundler-C3C09Zii.js";import{E as te,at as C,ot as ne,u as re}from"./core-Bz5WjPxS.js";import{Di as w,Ji as ie,Mi as T,Qi as E,Xi as D,Yi as ae,Zi as O,ji as k,ut as A,y as oe}from"./src-XqE2yCpG.js";import{t as j}from"./_plugin-vue_export-helper-CIL7EULb.js";import{Ln as se,Pn as ce,fr as le,hr as ue,it as de,r as fe,t as pe}from"./users.store-xP93bV7X.js";import{Mc as me,ei as he}from"./constants-DuQbSl-q.js";import{h as M,t as ge}from"./useRootStore-XEREVjMN.js";import{t as _e}from"./settings.store-CAFiYCMH.js";import{t as N}from"./dateformat-Cs9X8ykY.js";import{t as ve}from"./Modal-gWM7cVuX.js";import{h as ye,s as be}from"./constants-BVzsnVB6.js";import{c as xe,s as Se,t as Ce}from"./chat.store-mz4IZJ73.js";import{S as we,v as Te}from"./fileUtils-D6dhtxVJ.js";import{n as Ee,t as De}from"./ToolsSelector-B0IuM6LH.js";import{n as Oe,t as ke}from"./useCustomAgent-RYHrbz79.js";var Ae=6,je=j(o({__name:`SuggestedPromptsEditor`,props:{modelValue:{required:!0},modelModifiers:{}},emits:[`update:modelValue`],setup(e){let r={type:`icon`,value:`comment`},o=C(),s=g(e,`modelValue`),l=a([]);function f(){s.value.length>=Ae||(s.value=[...s.value,{text:``,icon:r}],u(()=>{l.value[s.value.length-1]?.focus()}))}function h(e){s.value=s.value.filter((t,n)=>n!==e)}function _(e,t){s.value=s.value.map((n,r)=>r===e?{...n,text:t}:n)}function v(e,t){s.value=s.value.map((n,r)=>r===e?{...n,icon:t}:n)}function b(e,t){e.key===`Enter`?(e.preventDefault(),s.value[t].text.trim().length>0&&f()):e.key===`Backspace`&&s.value[t].text===``&&(e.preventDefault(),h(t),t>0&&u(()=>{l.value[t-1]?.focus()}))}return(e,a)=>(t(),i(`div`,{class:m([e.$style.container,`suggested-prompts-editor`])},[(t(!0),i(p,null,ee(s.value,(n,a)=>(t(),i(`div`,{key:a,class:m(e.$style.row)},[y(d(oe),{"model-value":n.icon??r,"button-tooltip":d(o).baseText(`chatHub.agent.editor.iconPicker.button.tooltip`),"onUpdate:modelValue":e=>v(a,e)},null,8,[`model-value`,`button-tooltip`,`onUpdate:modelValue`]),y(d(k),{ref_for:!0,ref:e=>{l.value[a]=e},"model-value":n.text,placeholder:d(o).baseText(`chatHub.agent.editor.suggestedPrompts.placeholder`),maxlength:256,class:m(e.$style.input),"onUpdate:modelValue":e=>_(a,e),onKeydown:e=>b(e,a)},null,8,[`model-value`,`placeholder`,`class`,`onUpdate:modelValue`,`onKeydown`]),y(d(O),{variant:`ghost`,icon:`x`,size:`small`,"data-testid":`remove-prompt-button`,onClick:e=>h(a)},null,8,[`onClick`])],2))),128)),y(d(O),{variant:`subtle`,icon:`plus`,size:`small`,disabled:s.value.length>=Ae,"data-testid":`add-prompt-button`,onClick:f},{default:S(()=>[n(c(d(o).baseText(`chatHub.agent.editor.suggestedPrompts.addButton`)),1)]),_:1},8,[`disabled`])],2))}}),[[`__cssModules`,{$style:{container:`_container_kc4ev_125`,row:`_row_kc4ev_131`,input:`_input_kc4ev_137`}}]]),Me=e(N(),1),Ne=j(o({__name:`AgentEditorModalFileRow`,props:{item:{},semanticSearchReady:{type:Boolean},currentEmbeddingProvider:{}},emits:[`remove`],setup(e,{emit:a}){let o=e,u=a,f=C(),h=s(()=>{let e=o.item.createdAt??new Date().toISOString(),t=new Date().getFullYear().toString(),n=(0,Me.default)(e,`mmmm d${e.startsWith(t)?``:`, yyyy`}`);return f.baseText(`chatHub.agent.editor.files.createdAt`,{interpolate:{date:n}})}),g=s(()=>{if(!(o.item.isNew||o.item.status!==`indexed`)){if(!o.semanticSearchReady)return f.baseText(`chatHub.agent.editor.files.semanticSearchNotReady.tooltip`);if(o.item.provider&&o.item.provider!==o.currentEmbeddingProvider)return f.baseText(`chatHub.agent.editor.files.embeddingMismatch.tooltip`,{interpolate:{fileProvider:ye[o.item.provider],currentProvider:o.currentEmbeddingProvider?ye[o.currentEmbeddingProvider]:`unknown`}})}});return(a,o)=>(t(),i(`div`,{class:m(a.$style.fileRow)},[r(`div`,{class:m(a.$style.fileName)},[r(`span`,{class:m(a.$style.fileNameText)},c(e.item.fileName),3),r(`span`,{class:m(a.$style.createdAt)},c(h.value),3)],2),r(`div`,{class:m(a.$style.indexedCell)},[g.value?(t(),x(d(w),{key:0,content:g.value},{default:S(()=>[y(d(D),{size:`small`,class:m(a.$style.statusText)},{default:S(()=>[y(d(E),{icon:`triangle-alert`,size:`medium`,class:m(a.$style.iconWarning)},null,8,[`class`]),n(` `+c(d(f).baseText(`chatHub.agent.editor.files.unavailable`)),1)]),_:1},8,[`class`])]),_:1},8,[`content`])):e.item.status===`indexing`?(t(),i(p,{key:1},[y(d(E),{icon:`loader`,class:m(a.$style.iconIndexing),size:`medium`},null,8,[`class`]),y(d(D),{size:`small`,color:`text-light`},{default:S(()=>[n(c(d(f).baseText(`chatHub.agent.editor.files.indexing`)),1)]),_:1})],64)):e.item.status===`error`?(t(),x(d(w),{key:2,content:d(f).baseText(`chatHub.agent.editor.files.indexingError.tooltip`,{interpolate:{error:e.item.error??`Unknown error`}})},{default:S(()=>[y(d(D),{size:`small`,color:`danger`,class:m(a.$style.statusText)},{default:S(()=>[y(d(E),{icon:`circle-x`,size:`medium`}),n(` `+c(d(f).baseText(`chatHub.agent.editor.files.failed`)),1)]),_:1},8,[`class`])]),_:1},8,[`content`])):l(``,!0)],2),e.item.status===`indexing`?l(``,!0):(t(),x(d(T),{key:0,icon:`trash-2`,size:`small`,variant:`subtle`,onClick:o[0]||=v(e=>u(`remove`),[`stop`])}))],2))}}),[[`__cssModules`,{$style:{fileRow:`_fileRow_17tdo_125`,fileName:`_fileName_17tdo_137`,fileNameText:`_fileNameText_17tdo_144`,createdAt:`_createdAt_17tdo_152`,indexedCell:`_indexedCell_17tdo_158`,iconWarning:`_iconWarning_17tdo_165`,iconIndexing:`_iconIndexing_17tdo_169`,spin:`_spin_17tdo_1`,statusText:`_statusText_17tdo_183`}}]]),Pe=j(o({__name:`AgentEditorModal`,props:{modalName:{},data:{}},setup(e){let o=e,u=Ce(),g=pe(),v=_e(),w=de(),T=C(),E=s(()=>g.isInstanceOwner),j=s(()=>u.semanticSearchReadiness.isReadyForCurrentUser),N=ce(),ye=se(),Ae=fe(),Me=re(),{customAgent:Pe,isLoading:Fe}=ke(o.data.agentId),P=a(``),F=a(``),I=a(``),L=a(null),R=a(!1),z=a(!1),B=a([]),Ie=a(he),V=a(!1),Le=b(`nameInput`),H=a(we),U=a([]),W=a([]),G=a([]),Re=b(`fileInput`),ze=s(()=>v.moduleSettings[`chat-hub`]?.semanticSearch.embeddingModel.provider??null),Be=s(()=>v.moduleSettings[`chat-hub`]?.agentUploadMaxSizeMb??20),Ve=s(()=>[...U.value.map(e=>({...e,isNew:!1})),...W.value.map((e,t)=>({id:`new-${t}`,type:`embedding`,provider:ze.value,fileName:e.name,mimeType:e.type,isNew:!0}))]),K=a([]),q=a({}),J=s(()=>L.value&&Z.value[L.value.provider]),Y=s(()=>L.value&&u.getAgent(L.value,{name:L.value.model})),X=s(()=>!!o.data.agentId),He=s(()=>X.value&&Fe.value),Ue=s(()=>X.value?T.baseText(`chatHub.agent.editor.title.edit`):T.baseText(`chatHub.agent.editor.title.new`)),We=s(()=>R.value?T.baseText(`chatHub.agent.editor.saving`):T.baseText(`chatHub.agent.editor.save`)),Ge=s(()=>P.value.trim().length>0&&L.value!==null&&!!J.value),Z=s(()=>({...o.data.credentials,...q.value})),Ke=s(()=>Y.value?.metadata.capabilities.functionCalling??!1);function qe(){Ae.closeModal(o.modalName)}_(Y,e=>{e&&!e.metadata.capabilities.functionCalling&&(B.value=[])},{immediate:!0}),_(Pe,e=>{e&&(H.value=e.icon??we,P.value=e.name,F.value=e.description??``,I.value=e.systemPrompt,L.value={provider:e.provider,model:e.model},U.value=e.files,W.value=[],G.value=[],K.value=e.suggestedPrompts,B.value=e.toolIds??[],e.credentialId&&(q.value[e.provider]=e.credentialId))},{immediate:!0}),f(()=>{_([He,Le],([e,t])=>{e||t?.focus()},{immediate:!0,flush:`post`})}),_(Z,async e=>{if(e){V.value=!0;try{Ie.value=await xe(ge().restApiContext,{credentials:e})}finally{V.value=!1}}},{immediate:!0});function Je(e,t){q.value={...q.value,[e]:t}}function Ye(e){B.value.includes(e)?B.value=B.value.filter(t=>t!==e):B.value=[...B.value,e]}function Xe(e){M(Te(e)),L.value=e}async function Ze(){if(!(!Ge.value||R.value)){R.value=!0;try{M(L.value),M(J.value);let e=K.value.filter(e=>e.text.trim().length>0),t={name:P.value.trim(),description:F.value.trim()||void 0,systemPrompt:I.value.trim(),...L.value,credentialId:J.value,toolIds:B.value,icon:H.value,suggestedPrompts:e.length>0?e:void 0},n=W.value.length>0,r=[...W.value];if(X.value&&o.data.agentId){if(await u.updateCustomAgent(o.data.agentId,t,r,G.value,o.data.credentials),r.length>0){let e=r.reduce((e,t)=>e+t.size,0)/(1024*1024);ot.track(`User added files to personal agent`,{count:r.length,total_size_mb:e,agent_id:o.data.agentId})}N.showMessage({title:T.baseText(`chatHub.agent.editor.success.update`),message:n?T.baseText(`chatHub.agent.editor.success.withFiles`):void 0,type:`success`})}else{let e=await u.createCustomAgent(t,r,o.data.credentials);if(r.length>0){let t=r.reduce((e,t)=>e+t.size,0)/(1024*1024);ot.track(`User added files to personal agent`,{count:r.length,total_size_mb:t,agent_id:e.model.provider===`custom-agent`?e.model.agentId:void 0})}o.data.onCreateCustomAgent?.(e),N.showMessage({title:T.baseText(`chatHub.agent.editor.success.create`),message:n?T.baseText(`chatHub.agent.editor.success.withFiles`):void 0,type:`success`})}qe()}catch(e){let t=e instanceof Error?e.message:``;N.showError(e,T.baseText(`chatHub.agent.editor.error.save`),t)}finally{R.value=!1}}}async function Qe(){if(!(!X.value||!o.data.agentId||z.value)&&await ye.confirm(T.baseText(`chatHub.agent.editor.delete.confirm.message`),T.baseText(`chatHub.agent.editor.delete.confirm.title`),{confirmButtonText:T.baseText(`chatHub.agent.editor.delete.confirm.button`),cancelButtonText:T.baseText(`chatHub.agent.editor.delete.cancel.button`),type:`warning`})===`confirm`){z.value=!0;try{await u.deleteCustomAgent(o.data.agentId,o.data.credentials),N.showMessage({title:T.baseText(`chatHub.agent.editor.success.delete`),type:`success`}),o.data.onClose?.(),qe()}catch(e){let t=e instanceof Error?e.message:``;N.showError(e,T.baseText(`chatHub.agent.editor.error.delete`),t)}finally{z.value=!1}}}function $e(e){return e.type===`application/pdf`}function et(e){let t=Be.value*1024*1024;for(let n of e)if(n.size>t)return N.showMessage({title:T.baseText(`chatHub.agent.editor.files.tooLarge`,{interpolate:{fileName:n.name,maxSizeMb:Be.value}}),type:`error`}),!1;return!0}function tt(e){let t=e.filter(e=>$e(e));t.length!==0&&et(t)&&(W.value=[...W.value,...t])}function nt(e){let t=e.target;if(!t.files)return;let n=Array.from(t.files).filter(e=>$e(e));if(n.length===0){t.value=``;return}if(!et(n)){t.value=``;return}W.value=[...W.value,...n],t.value=``}function rt(){Re.value?.click()}function it(e){e.isNew?W.value=W.value.filter((t,n)=>`new-${n}`!==e.id):(G.value=[...G.value,e.id],U.value=U.value.filter(t=>t.id!==e.id))}let at=ue(),ot=le(),Q=s(()=>at.isVariantEnabled(me.name,me.variant)),$=Ee(!0,tt,[`application/pdf`]),st=s(()=>U.value.some(e=>e.status===`indexing`)),{pause:ct,resume:lt}=te(async()=>{if(o.data.agentId)try{U.value=(await Se(ge().restApiContext,o.data.agentId)).files}catch{}},5e3);return _(st,e=>{e&&o.data.agentId?lt():ct()},{immediate:!0}),_(Me,e=>{e===`visible`&&!j.value&&(v.getModuleSettings(),w.fetchAllCredentials())}),(a,o)=>{let s=h(`RouterLink`);return t(),x(ve,{name:e.modalName,width:`640px`,loading:He.value},{header:S(()=>[r(`div`,{class:m(a.$style.header)},[y(d(ie),{tag:`h2`,size:`large`},{default:S(()=>[n(c(Ue.value),1)]),_:1}),X.value?(t(),x(d(O),{key:0,variant:`subtle`,icon:`trash-2`,class:m(a.$style.deleteButton),disabled:z.value,loading:z.value,onClick:Qe},null,8,[`class`,`disabled`,`loading`])):l(``,!0)],2)]),content:S(()=>[r(`div`,{class:m(a.$style.contentWrapper)},[Q.value&&d($).isDragging.value?(t(),i(`div`,{key:0,class:m(a.$style.dropOverlay)},[d($).isDraggingUnsupported.value?(t(),x(d(D),{key:0,size:`large`,color:`text-dark`},{default:S(()=>[n(c(d(T).baseText(`chatHub.agent.editor.dropOverlay.unsupportedFileType`)),1)]),_:1})):(t(),x(d(D),{key:1,size:`large`,color:`text-dark`},{default:S(()=>[n(c(d(T).baseText(`chatHub.agent.editor.dropOverlay.addFile`)),1)]),_:1}))],2)):l(``,!0),r(`div`,{class:m([a.$style.content,{[a.$style.isDraggingFile]:Q.value&&d($).isDragging.value}]),onDragenter:o[5]||=e=>Q.value&&j.value?d($).handleDragEnter(e):void 0,onDragleave:o[6]||=e=>Q.value&&j.value?d($).handleDragLeave(e):void 0,onDragover:o[7]||=e=>Q.value&&j.value?d($).handleDragOver(e):void 0,onDrop:o[8]||=e=>Q.value&&j.value?d($).handleDrop(e):void 0},[y(d(A),{"input-name":`agent-name`,label:d(T).baseText(`chatHub.agent.editor.name.label`),required:!0},{default:S(()=>[r(`div`,{class:m(a.$style.agentName)},[y(d(oe),{modelValue:H.value,"onUpdate:modelValue":o[0]||=e=>H.value=e,"button-tooltip":d(T).baseText(`chatHub.agent.editor.iconPicker.button.tooltip`)},null,8,[`modelValue`,`button-tooltip`]),y(d(k),{id:`agent-name`,ref:`nameInput`,modelValue:P.value,"onUpdate:modelValue":o[1]||=e=>P.value=e,placeholder:d(T).baseText(`chatHub.agent.editor.name.placeholder`),maxlength:128,class:m(a.$style.agentNameInput)},null,8,[`modelValue`,`placeholder`,`class`])],2)]),_:1},8,[`label`]),y(d(A),{"input-name":`agent-description`,label:d(T).baseText(`chatHub.agent.editor.description.label`)},{default:S(()=>[y(d(k),{id:`agent-description`,modelValue:F.value,"onUpdate:modelValue":o[2]||=e=>F.value=e,type:`textarea`,placeholder:d(T).baseText(`chatHub.agent.editor.description.placeholder`),maxlength:512,rows:3,class:m(a.$style.input)},null,8,[`modelValue`,`placeholder`,`class`])]),_:1},8,[`label`]),y(d(A),{"input-name":`agent-system-prompt`,label:d(T).baseText(`chatHub.agent.editor.systemPrompt.label`)},{default:S(()=>[y(d(k),{id:`agent-system-prompt`,modelValue:I.value,"onUpdate:modelValue":o[3]||=e=>I.value=e,type:`textarea`,placeholder:d(T).baseText(`chatHub.agent.editor.systemPrompt.placeholder`),rows:6,class:m(a.$style.input)},null,8,[`modelValue`,`placeholder`,`class`])]),_:1},8,[`label`]),y(d(A),{"input-name":`agent-suggested-prompts`,label:d(T).baseText(`chatHub.agent.editor.suggestedPrompts.label`),"tooltip-text":d(T).baseText(`chatHub.agent.editor.suggestedPrompts.tooltip`),"show-tooltip":!0},{default:S(()=>[y(je,{modelValue:K.value,"onUpdate:modelValue":o[4]||=e=>K.value=e},null,8,[`modelValue`])]),_:1},8,[`label`,`tooltip-text`]),r(`div`,{class:m(a.$style.row)},[y(d(A),{"input-name":`agent-model`,class:m(a.$style.input),label:d(T).baseText(`chatHub.agent.editor.model.label`),required:!0},{default:S(()=>[y(Oe,{"selected-agent":Y.value,"include-custom-agents":!1,credentials:Z.value,agents:Ie.value,"is-loading":V.value,class:m(a.$style.modelSelector),"warn-missing-credentials":``,onChange:Xe,onSelectCredential:Je},null,8,[`selected-agent`,`credentials`,`agents`,`is-loading`,`class`])]),_:1},8,[`class`,`label`]),y(d(A),{"input-name":`agent-tool`,class:m(a.$style.input),label:d(T).baseText(`chatHub.agent.editor.tools.label`),required:!1},{default:S(()=>[r(`div`,null,[y(De,{disabled:!Ke.value,"disabled-tooltip":Ke.value?void 0:L.value?d(T).baseText(`chatHub.tools.selector.disabled.tooltip`):d(T).baseText(`chatHub.tools.selector.disabled.noModel.tooltip`),"checked-tool-ids":B.value,onToggle:Ye},null,8,[`disabled`,`disabled-tooltip`,`checked-tool-ids`])])]),_:1},8,[`class`,`label`])],2),Q.value?(t(),x(d(A),{key:0,"input-name":`agent-files`,label:d(T).baseText(`chatHub.agent.editor.files.label`),required:!1},{default:S(()=>[r(`input`,{ref:`fileInput`,type:`file`,class:m(a.$style.fileInput),accept:`application/pdf`,multiple:``,onChange:nt},null,34),j.value?l(``,!0):(t(),x(d(ae),{key:0,theme:`info`,icon:`info`,class:m(a.$style.vectorStoreCallout)},{default:S(()=>[y(d(ne),{keypath:E.value?`chatHub.agent.editor.semanticSearch.notReady.canConfigure`:`chatHub.agent.editor.semanticSearch.notReady`,tag:`span`,scope:`global`},{settingsLink:S(()=>[y(s,{to:{name:d(be)},target:`_blank`,class:m(a.$style.settingsLink)},{default:S(()=>[n(c(d(T).baseText(`chatHub.agent.editor.semanticSearch.settingsLink`)),1)]),_:1},8,[`to`,`class`])]),_:1},8,[`keypath`])]),_:1},8,[`class`])),Ve.value.length>0?(t(),i(`div`,{key:1,class:m(a.$style.fileList)},[(t(!0),i(p,null,ee(Ve.value,e=>(t(),x(Ne,{key:e.id,item:e,"semantic-search-ready":j.value,"current-embedding-provider":ze.value,onRemove:t=>it(e)},null,8,[`item`,`semantic-search-ready`,`current-embedding-provider`,`onRemove`]))),128))],2)):l(``,!0),y(d(O),{type:`tertiary`,icon:`plus`,variant:`subtle`,class:m(a.$style.addFileButton),disabled:!j.value,onClick:rt},{default:S(()=>[...o[9]||=[n(` Add file `,-1)]]),_:1},8,[`class`,`disabled`])]),_:1},8,[`label`])):l(``,!0)],34)],2)]),footer:S(()=>[r(`div`,{class:m(a.$style.footer)},[y(d(O),{variant:`subtle`,onClick:qe},{default:S(()=>[n(c(d(T).baseText(`chatHub.tools.editor.cancel`)),1)]),_:1}),y(d(O),{variant:`solid`,disabled:!Ge.value||R.value,onClick:Ze},{default:S(()=>[n(c(We.value),1)]),_:1},8,[`disabled`])],2)]),_:1},8,[`name`,`loading`])}}}),[[`__cssModules`,{$style:{header:`_header_c3h8p_125`,deleteButton:`_deleteButton_c3h8p_133`,contentWrapper:`_contentWrapper_c3h8p_137`,content:`_content_c3h8p_137`,vectorStoreCallout:`_vectorStoreCallout_c3h8p_152`,settingsLink:`_settingsLink_c3h8p_156`,isDraggingFile:`_isDraggingFile_c3h8p_161`,dropOverlay:`_dropOverlay_c3h8p_165`,input:`_input_c3h8p_179`,agentName:`_agentName_c3h8p_183`,agentNameInput:`_agentNameInput_c3h8p_189`,row:`_row_c3h8p_193`,modelSelector:`_modelSelector_c3h8p_199`,footer:`_footer_c3h8p_203`,fileInput:`_fileInput_c3h8p_209`,addFileButton:`_addFileButton_c3h8p_213`,fileList:`_fileList_c3h8p_218`,credentialPickerRow:`_credentialPickerRow_c3h8p_224`,credentialPicker:`_credentialPicker_c3h8p_224`}}]]);export{Pe as default}; //# sourceMappingURL=AgentEditorModal-BhtbFuWW.js.map