UNPKG

n8n-editor-ui

Version:

Workflow Editor UI for n8n

2 lines 17.6 kB
!function(){try{("undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:{}).SENTRY_RELEASE={id:"n8n@2.13.4"}}catch(e){}}(),System.register(["./chunk-legacy-TXBRODOR.js","./vue.runtime.esm-bundler-legacy-IafOlCW8.js","./_MapCache-legacy-DwgdC8YO.js","./src-legacy-Dwzr7bD0.js","./_plugin-vue_export-helper-legacy-DEZAmQqp.js","./users.store-legacy-OKuN0qAC.js","./constants-legacy-DNCca_FT.js","./useDebounce-legacy-CT3oYGrC.js","./readyToRun.store-legacy-DjI3ii4i.js","./ResourceFiltersDropdown-legacy-B3UwyTK3.js"],(function(e,t){var a,s,i,l,r,o,n,d,u,c,p,f,g,v,_,y,m,h,b,w,k,x,$,P,S,z,j,F,C,E,A,I,L,T,D,O,N,R,K,U,W,V,B,M,q,H,Z,J,X,Y,G,Q,ee,te,ae,se,ie,le,re,oe,ne;function de(e,t){return a(),l("div",{class:_(e.$style.wrapper)},[b(e.$slots,"header"),i("main",{class:_(e.$style.content)},[b(e.$slots,"default")],2)],2)}return{setters:[function(e){e.o},function(e){a=e.$,s=e.A,i=e.C,l=e.E,r=e.F,o=e.Ft,n=e.N,d=e.S,u=e.Sn,c=e.T,p=e.W,f=e.Wt,g=e.X,v=e._,_=e._n,y=e.bt,m=e.ft,h=e.gt,b=e.it,w=e.j,k=e.p,x=e.q,$=e.rt,P=e.vn,S=e.w,z=e.yt},function(e){j=e.M,F=e.bt},function(e){C=e.$i,E=e.Ct,A=e.Et,I=e.Fi,L=e.Kt,T=e.Ri,D=e.Tt,O=e.V,N=e.Zi,R=e._t,K=e.gt,U=e.lt,W=e.tt,V=e.zt},function(e){B=e.t},function(e){M=e.Jr,q=e.ai,H=e.en,Z=e.ri,J=e.t},function(e){X=e.wc},function(e){Y=e.t},function(e){G=e.r},function(e){Q=e.t}],execute:function(){(ee=document.createElement("style")).textContent="._wrapper_1bol0_125{width:100%;height:100%;max-width:var(--content-container--width);box-sizing:border-box;padding:var(--spacing--lg)var(--spacing--2xl)0;flex-direction:column;align-content:start;display:flex}@media screen and (max-width:991px){._wrapper_1bol0_125{padding:var(--spacing--sm)var(--spacing--sm)0}}._content_1bol0_141,._wrapper_mbox7_125{height:100%;display:grid}._overflow_mbox7_130 ._list_mbox7_130 ._body_mbox7_130{overflow:auto}._list_mbox7_130{grid-template-rows:auto 1fr;height:100%;display:grid}._list_mbox7_130 ._body_mbox7_130{height:100%;position:relative}._filters-row_sk3u7_125{justify-content:space-between;align-items:center;gap:var(--spacing--2xs);flex-direction:row;width:100%;display:flex}._filters_sk3u7_125{gap:var(--spacing--4xs);grid-auto-columns:1fr max-content max-content max-content;grid-auto-flow:column;justify-content:end;align-items:center;width:100%;display:grid}._filters_sk3u7_125 ._sort-and-filter_sk3u7_143{gap:var(--spacing--4xs);align-items:center;display:flex}._filters_sk3u7_125 ._sort-and-filter_sk3u7_143 input{width:196px;height:32px;min-height:0}@media screen and (max-width:767px){._filters_sk3u7_125{grid-auto-flow:row;grid-auto-columns:unset;grid-template-columns:1fr}}._search_sk3u7_161{justify-self:end;max-width:196px}@media screen and (max-width:991px){._search_sk3u7_161{max-width:100%}}._listWrapper_sk3u7_171{width:100%;height:100%;position:absolute}._paginatedListWrapper_sk3u7_177{gap:var(--spacing--md);flex-direction:column;height:100%;display:flex;overflow:auto}._listItems_sk3u7_185{overflow-y:auto}._listPagination_sk3u7_189{margin-bottom:var(--spacing--lg);justify-content:flex-end;display:flex}._listPagination_sk3u7_189 .el-pagination__sizes{height:100%;position:relative;top:-1px}._listPagination_sk3u7_189 .el-pagination__sizes input{height:100%;min-height:28px}._listPagination_sk3u7_189 .el-pagination__sizes .el-input__suffix{width:var(--spacing--md)}._sort-and-filter_sk3u7_143{white-space:nowrap}@media screen and (max-width:991px){._sort-and-filter_sk3u7_143{width:100%}}._datatable_sk3u7_216{padding-bottom:var(--spacing--sm)}.resource-list-loading[data-v-83bc4a30]{width:100%;height:0;animation:10ms linear .3s forwards changeVisibility-83bc4a30;position:relative;overflow:hidden}.resource-list-loading[data-v-83bc4a30] .el-skeleton{width:100%;height:100%;position:absolute;overflow:hidden}.resource-list-loading[data-v-83bc4a30] .el-skeleton>div>div:first-child .el-skeleton__item{height:42px;margin:0}.resource-list-loading[data-v-83bc4a30] .el-skeleton .el-skeleton__item{height:69px}.resource-list-loading-instant[data-v-83bc4a30]{animation:10ms linear forwards changeVisibility-83bc4a30}@keyframes changeVisibility-83bc4a30{0%{height:0}to{height:100%}}\n/*$vite$:1*/",document.head.appendChild(ee);try{t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:{},(ue=(new t.Error).stack)&&(t._sentryDebugIds=t._sentryDebugIds||{},t._sentryDebugIds[ue]="6bff5c2b-c993-475c-ad8e-349908595858",t._sentryDebugIdIdentifier="sentry-dbid-6bff5c2b-c993-475c-ad8e-349908595858")}catch(t){}var t,ue;te=B({},[["render",de],["__cssModules",{$style:{wrapper:"_wrapper_1bol0_125",content:"_content_1bol0_141"}}]]),ae=n({__name:"PageViewLayoutList",props:{overflow:{type:Boolean}},setup:e=>(t,s)=>(a(),l("div",{class:_({[t.$style.wrapper]:!0,[t.$style.overflow]:e.overflow})},[i("div",{class:_(t.$style.list)},[t.$slots.header?(a(),l("div",{key:0,class:_(t.$style.header)},[b(t.$slots,"header")],2)):c("",!0),i("div",{class:_(t.$style.body)},[b(t.$slots,"default")],2)],2)],2))}),se=B(ae,[["__cssModules",{$style:{wrapper:"_wrapper_mbox7_125",overflow:"_overflow_mbox7_130",list:"_list_mbox7_130",body:"_body_mbox7_130"}}]]),ie={key:0,class:"resource-list-loading"},le={key:0},re={key:0,class:"mt-xs","data-test-id":"resources-list-filters-applied-info"},oe={key:0,class:"resource-list-loading resource-list-loading-instant"},ne=n({__name:"ResourcesListLayout",props:{resourceKey:{},displayName:{type:Function,default:e=>e.name||""},resources:{},disabled:{type:Boolean},initialize:{type:Function,default:async()=>{}},filters:{default:()=>({search:"",homeProject:""})},additionalFiltersHandler:{type:Function,default:void 0},shareable:{type:Boolean,default:!0},sortFns:{default:()=>({})},sortOptions:{default:()=>["lastUpdated","lastCreated","nameAsc","nameDesc"]},type:{default:"list-full"},typeProps:{default:()=>({itemSize:80})},loading:{type:Boolean,default:!0},customPageSize:{default:25},availablePageSizeOptions:{default:()=>[10,25,50,100]},totalItems:{default:0},resourcesRefreshing:{type:Boolean,default:!1},dontPerformSortingAndFiltering:{type:Boolean,default:!1},hasEmptyState:{type:Boolean,default:!0},uiConfig:{default:()=>({searchEnabled:!0,showFiltersDropdown:!0,sortEnabled:!0})},tabKey:{default:"workflows"},persistKeyExclusions:{default:()=>[]}},emits:["update:filters","click:add","update:pagination-and-sort","update:search"],setup(e,{expose:t,emit:n}){const B=K(),ee=R(),{callDebounced:ae}=Y(),ne=J(),de=H(),ue=function(){const e=G(),t=t=>e.isOverviewSubPage?"home":t;return{saveProjectPreferencesToLocalStorage:(e,a,s)=>{const i=t(e);if(!i)return;const l=j(X,{});l.value[i]||(l.value[i]={}),l.value[i][a]={...l.value[i][a],...s}},loadProjectPreferencesFromLocalStorage:(e,a)=>{const s=t(e);return s&&j("N8N_WORKFLOWS_LIST_PREFERENCES",{}).value[s]?.[a]||{}},getProjectKey:t}}(),ce=e,{getResourceText:pe}=function(e){const t=F();return{getResourceText:(a,s,i)=>{const l=`${e}.${a}`,r=`resources.${a}`,o=s?`resources.${s}`:void 0;return M(l)?t.baseText(l,{interpolate:i}):M(r)?t.baseText(r,{interpolate:i}):o&&M(o)?t.baseText(o,{interpolate:i}):a.split(".").pop()?.replace(/([A-Z])/g," $1").trim()||a}}}(ce.resourceKey),fe=o(ce.sortOptions[0]),ge=o(!1),ve=o(1),_e=o(ce.customPageSize),ye=o(!1),me=o(null),he=o(null),be=o(null),we=o(ce.customPageSize),ke=o(ce.sortOptions[0]),xe=n;m();const $e=d({get:()=>ce.filters,set:e=>xe("update:filters",e)}),Pe=d((()=>ce.hasEmptyState&&0===ce.resources.length&&!ge.value&&!$e.value.search&&!ce.resourcesRefreshing)),Se=d((()=>Object.keys($e.value))),ze=d((()=>ce.dontPerformSortingAndFiltering?ce.resources:ce.resources.filter((e=>{let t=!0;if($e.value.homeProject&&q(e)&&(t=t&&!(!("homeProject"in e)||!e.homeProject||e.homeProject.id!==$e.value.homeProject)),$e.value.search){const a=$e.value.search.toLowerCase();t=t&&ce.displayName(e).toLowerCase().includes(a)}return ce.additionalFiltersHandler&&(t=ce.additionalFiltersHandler(e,$e.value,t)),t})).sort(((e,t)=>{const a=Z(e)&&Z(t);switch(fe.value){case"lastUpdated":return a&&"updatedAt"in e&&"updatedAt"in t?ce.sortFns.lastUpdated?ce.sortFns.lastUpdated(e,t):new Date(t.updatedAt??"").valueOf()-new Date(e.updatedAt??"").valueOf():0;case"lastCreated":return a&&"createdAt"in e&&"createdAt"in t?ce.sortFns.lastCreated?ce.sortFns.lastCreated(e,t):new Date(t.createdAt??"").valueOf()-new Date(e.createdAt??"").valueOf():0;case"nameAsc":return ce.sortFns.nameAsc?ce.sortFns.nameAsc(e,t):ce.displayName(e).trim().localeCompare(ce.displayName(t).trim());case"nameDesc":return ce.sortFns.nameDesc?ce.sortFns.nameDesc(e,t):ce.displayName(t).trim().localeCompare(ce.displayName(e).trim());default:return ce.sortFns[fe.value]?ce.sortFns[fe.value](e,t):0}}))));h((()=>ce.filters),(e=>{$e.value=e,Ae()&&(ge.value=!0)})),h((()=>$e.value.homeProject),(()=>{De("homeProject")})),h((()=>$e.value.tags),(()=>{De("tags")})),h((()=>$e.value.type),(()=>{De("type")})),h((()=>$e.value.search),(()=>ae(De,{debounceTime:1e3,trailing:!0},"search"))),h((()=>$e.value.setupNeeded),(()=>{De("setupNeeded")})),h((()=>$e.value.incomplete),(()=>{De("incomplete")})),h([()=>B.params?.projectId,()=>B.name],(async()=>{await Re(),await Be(),await ce.initialize()})),g((async()=>{await Be(),await ce.initialize(),await p(),Ae()&&(ge.value=!0),window.addEventListener("keydown",je)})),x((()=>{window.removeEventListener("keydown",je)}));const je=e=>{ce.uiConfig.searchEnabled&&(e.ctrlKey||e.metaKey)&&"f"===e.key&&(e.preventDefault(),Fe())},Fe=()=>{me.value&&me.value.focus()},Ce=e=>"search"!==e&&("boolean"==typeof ce.filters[e]?ce.filters[e]:Array.isArray(ce.filters[e])?ce.filters[e].length>0:""!==ce.filters[e]),Ee=d((()=>{const e=Se.value.filter(Ce),t=["showArchived"];return e.every((e=>t.includes(e)))})),Ae=()=>!!Se.value.find(Ce),Ie=async e=>{_e.value=e,await Ve(),xe("update:pagination-and-sort",{pageSize:e})},Le=async(e,t=!0)=>{fe.value=e,t&&(await Ve(),Ke()),xe("update:pagination-and-sort",{sort:e})},Te=async(e,t=!0)=>{ve.value=e,t&&await Ve(),xe("update:pagination-and-sort",{page:e})},De=e=>{if(ye.value){if("reset"!==e)return;setTimeout((()=>ye.value=!1),1500)}const t=$e.value,a=[],s=[];Object.keys(t).forEach((e=>{t[e]&&(a.push(e),s.push("search"===e?null:t[e]))})),de.track(`User set filters in ${ce.resourceKey} list`,{filters_set:a,filter_values:s,[`${ce.resourceKey}_total_in_view`]:ce.resources.length,[`${ce.resourceKey}_after_filtering`]:ze.value.length})},Oe=e=>{xe("click:add",e)},Ne=e=>{xe("update:filters",e)},Re=async()=>{Object.keys($e.value).forEach((e=>{$e.value[e]=Array.isArray($e.value[e])?[]:""})),await Te(1,!1),ye.value=!0,ge.value=!1,De("reset"),xe("update:filters",$e.value)},Ke=()=>{de.track(`User changed sorting in ${ce.resourceKey} list`,{sorting:fe.value})},Ue=e=>{ge.value=e>0},We=e=>{$e.value.search=e,xe("update:search",e)},Ve=async()=>{if("list-paginated"!==ce.type)return;const e={...B.query};1!==ve.value?e.page=ve.value.toString():delete e.page,_e.value!==we.value?(e.pageSize=_e.value.toString(),we.value=_e.value):delete e.pageSize,fe.value===ke.value||ce.persistKeyExclusions.includes(fe.value)?delete e.sort:(e.sort=fe.value,ke.value=fe.value),ue.saveProjectPreferencesToLocalStorage(B.params.projectId??"",ce.tabKey,{sort:ce.persistKeyExclusions.includes(fe.value)?ke.value:fe.value,pageSize:_e.value}),await ee.replace({query:Object.keys(e).length?e:void 0})},Be=async()=>{if("list-paginated"!==ce.type)return;const e=B.query,t=ue.loadProjectPreferencesFromLocalStorage(B.params.projectId??"",ce.tabKey),a={};if(e.page){const t=parseInt(e.page,10);t>1&&(ve.value=t,a.page=t)}if(e.pageSize??t.pageSize){const i=(s=parseInt(e.pageSize||String(t.pageSize),10),ce.availablePageSizeOptions.reduce(((e,t)=>Math.abs(t-s)<Math.abs(e-s)?t:e)));_e.value=i,a.pageSize=i,we.value=i}else _e.value=ce.customPageSize,a.pageSize=ce.customPageSize;var s;e.sort?fe.value=a.sort=ke.value=e.sort:t.sort?(await Le(t.sort,!1),a.sort=t.sort,ke.value=t.sort):fe.value=ce.sortOptions[0],xe("update:pagination-and-sort",a)};return t({currentPage:ve,setCurrentPage:Te,getScrollContainer:()=>"list-paginated"===ce.type?be.value??null:he.value??null}),(t,o)=>(a(),S(te,null,{header:z((()=>[b(t.$slots,"header",{},void 0,!0)])),default:z((()=>[e.loading?(a(),l("div",ie,[w(f(V),{rows:25,"shrink-last":!1})])):(a(),l(v,{key:1},[Pe.value?(a(),l("div",le,[b(t.$slots,"empty",{},(()=>[w(f(T),{"data-test-id":"empty-resources-list",icon:{type:"emoji",value:"👋"},heading:f(pe)(f(ne).currentUser?.firstName?"empty.heading":"empty.heading.userNotSetup",f(ne).currentUser?.firstName?"empty.heading":"empty.heading.userNotSetup",{name:f(ne).currentUser?.firstName??""}),description:f(pe)("empty.description"),"button-text":f(pe)("empty.button"),"button-type":"secondary","button-disabled":e.disabled,"onClick:button":Oe},{disabledButtonTooltip:z((()=>[s(u(f(pe)("empty.button.disabled.tooltip")),1)])),_:1},8,["heading","description","button-text","button-disabled"])]),!0)])):(a(),S(se,{key:1},{header:z((()=>[i("div",{class:_(t.$style["filters-row"])},[i("div",{class:_(t.$style.filters)},[b(t.$slots,"breadcrumbs",{},void 0,!0),ce.uiConfig.searchEnabled?(a(),S(f(I),{key:0,ref_key:"search",ref:me,"model-value":$e.value.search,class:_(t.$style.search),placeholder:f(pe)("search.placeholder","search.placeholder"),size:"medium",clearable:"","data-test-id":"resources-list-search","onUpdate:modelValue":We},{prefix:z((()=>[w(f(C),{icon:"search"})])),_:1},8,["model-value","class","placeholder"])):c("",!0),ce.uiConfig.sortEnabled?(a(),l("div",{key:1,class:_(t.$style["sort-and-filter"])},[w(f(D),{modelValue:fe.value,"onUpdate:modelValue":o[0]||(o[0]=e=>fe.value=e),size:"small",class:_(t.$style.resourceList),"data-test-id":"resources-list-sort",onChange:o[1]||(o[1]=e=>Le(fe.value))},{default:z((()=>[(a(!0),l(v,null,$(e.sortOptions,(e=>(a(),S(f(A),{key:e,"data-test-id":"resources-list-sort-item",value:e,label:f(pe)(`sort.${e}`,`sort.${e}`)},null,8,["value","label"])))),128))])),_:1},8,["modelValue","class"])],2)):c("",!0),ce.uiConfig.showFiltersDropdown?(a(),l("div",{key:2,class:_(t.$style["sort-and-filter"])},[w(Q,{keys:Se.value,reset:Re,"model-value":$e.value,shareable:e.shareable,"just-icon":!0,"onUpdate:modelValue":Ne,"onUpdate:filtersLength":Ue},{default:z((e=>[b(t.$slots,"filters",P(r(e)),void 0,!0)])),_:3},8,["keys","model-value","shareable"]),b(t.$slots,"add-button",{},void 0,!0)],2)):c("",!0)],2)],2),b(t.$slots,"callout",{},void 0,!0),ce.uiConfig.showFiltersDropdown?y((a(),l("div",re,[w(f(W),{bold:!1},{default:z((()=>[s(u(Ee.value?f(pe)("filters.active.shortText","filters.active.shortText"):f(pe)("filters.active","filters.active"))+" ",1),w(f(U),{"data-test-id":"workflows-filter-reset",size:"small",onClick:Re},{default:z((()=>[s(u(f(pe)("filters.active.reset","filters.active.reset")),1)])),_:1})])),_:1})],512)),[[k,ge.value]]):c("",!0),o[4]||(o[4]=i("div",{class:"pb-xs"},null,-1))])),default:z((()=>[b(t.$slots,"preamble",{},void 0,!0),e.resourcesRefreshing?(a(),l("div",oe,[w(f(V),{rows:_e.value,"shrink-last":!1},null,8,["rows"])])):ze.value.length>0?(a(),l("div",{key:1,ref_key:"listWrapperRef",ref:he,"data-test-id":"resources-list-wrapper",class:_(t.$style.listWrapper)},["list-full"===e.type?(a(),S(f(O),{key:0,"data-test-id":"resources-list",items:ze.value,"item-size":"itemSize"in ce.typeProps?ce.typeProps.itemSize:0,"item-key":"id"},{default:z((({item:e,updateItemSize:a})=>[b(t.$slots,"default",{data:e,updateItemSize:a},void 0,!0)])),_:3},8,["items","item-size"])):"list-paginated"===e.type?(a(),l("div",{key:1,class:_(t.$style.paginatedListWrapper),"data-test-id":"paginated-list"},[i("div",{ref_key:"listItemsRef",ref:be,class:_(t.$style.listItems)},[(a(!0),l(v,null,$(e.resources,((e,i)=>(a(),l("div",{key:i,class:_(t.$style.listItem)},[b(t.$slots,"item",{item:e,index:i},(()=>[s(u(e),1)]),!0)],2)))),128))],2),i("div",{class:_(t.$style.listPagination)},[w(f(L),{"current-page":ve.value,"onUpdate:currentPage":[o[2]||(o[2]=e=>ve.value=e),Te],"page-size":_e.value,"onUpdate:pageSize":o[3]||(o[3]=e=>_e.value=e),background:"",total:e.totalItems,"page-sizes":e.availablePageSizeOptions,layout:"total, prev, pager, next, sizes","data-test-id":"resources-list-pagination",onSizeChange:Ie},null,8,["current-page","page-size","total","page-sizes"])],2)],2)):c("",!0),"datatable"===e.type?(a(),S(f(E),{key:2,"data-test-id":"resources-table",class:_(t.$style.datatable),columns:"columns"in ce.typeProps?ce.typeProps.columns:[],rows:ze.value,"current-page":ve.value,"rows-per-page":_e.value,"onUpdate:currentPage":Te,"onUpdate:rowsPerPage":Ie},{row:z((({columns:e,row:a})=>[b(t.$slots,"default",{data:a,columns:e},void 0,!0)])),postdata:z((()=>[b(t.$slots,"postdata",{},void 0,!0)])),_:3},8,["class","columns","rows","current-page","rows-per-page"])):c("",!0)],2)):Ae()||""!==$e.value.search?(a(),S(f(N),{key:2,color:"text-base",size:"medium","data-test-id":"resources-list-empty"},{default:z((()=>[s(u(f(pe)("noResults","noResults")),1)])),_:1})):c("",!0),b(t.$slots,"postamble",{},void 0,!0)])),_:3}))],64))])),_:3}))}}),e("t",B(ne,[["__cssModules",{$style:{"filters-row":"_filters-row_sk3u7_125",filters:"_filters_sk3u7_125","sort-and-filter":"_sort-and-filter_sk3u7_143",search:"_search_sk3u7_161",listWrapper:"_listWrapper_sk3u7_171",paginatedListWrapper:"_paginatedListWrapper_sk3u7_177",listItems:"_listItems_sk3u7_185",listPagination:"_listPagination_sk3u7_189",datatable:"_datatable_sk3u7_216"}}],["__scopeId","data-v-83bc4a30"]]))}}})); //# sourceMappingURL=ResourcesListLayout-legacy-CyEQJ0tB.js.map