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.16.1"}}catch(e){}}(),System.register(["./chunk-legacy-Dz3fjYb5.js","./vue.runtime.esm-bundler-legacy-BW6xDdqj.js","./core-legacy-VD8c7QJ-.js","./src-legacy-B67uuxhB.js","./_plugin-vue_export-helper-legacy-DFdC_I5Z.js","./users.store-legacy-azRUgFdP.js","./constants-legacy-2_ytuuS3.js","./useDebounce-legacy-CRJGWVMg.js","./readyToRun.store-legacy-B3LJTBp4.js","./ResourceFiltersDropdown-legacy-D-usAd9H.js"],(function(e,t){var a,s,l,i,r,o,n,u,d,c,p,g,f,v,_,y,m,h,b,w,k,x,$,P,S,z,j,F,E,C,A,I,L,O,T,D,N,R,U,K,W,V,B,M,q,H,X,J,Q,Y,Z,G,ee,te,ae,se,le,ie,re,oe,ne;function ue(e,t){return a(),i("div",{class:_(e.$style.wrapper)},[b(e.$slots,"header"),l("main",{class:_(e.$style.content)},[b(e.$slots,"default")],2)],2)}return{setters:[function(e){e.o},function(e){a=e.$,s=e.A,l=e.C,i=e.E,r=e.F,o=e.Ft,n=e.N,u=e.S,d=e.Sn,c=e.T,p=e.W,g=e.Wt,f=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.at,F=e.v},function(e){E=e.J,C=e.M,A=e.Pi,I=e.Qi,L=e.Rt,O=e.Xi,T=e._t,D=e.ct,N=e.ht,R=e.ji,U=e.jt,K=e.lt,W=e.tt,V=e.vt},function(e){B=e.t},function(e){M=e.Ar,q=e.Or,H=e.fr,X=e.t,J=e.yr},function(e){Q=e.lc},function(e){Y=e.t},function(e){Z=e.r},function(e){G=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:{},(de=(new t.Error).stack)&&(t._sentryDebugIds=t._sentryDebugIds||{},t._sentryDebugIds[de]="5b80d895-9596-4469-8a34-422a0aa0a8a2",t._sentryDebugIdIdentifier="sentry-dbid-5b80d895-9596-4469-8a34-422a0aa0a8a2")}catch(t){}var t,de;te=B({},[["render",ue],["__cssModules",{$style:{wrapper:"_wrapper_1bol0_125",content:"_content_1bol0_141"}}]]),ae=n({__name:"PageViewLayoutList",props:{overflow:{type:Boolean}},setup:e=>(t,s)=>(a(),i("div",{class:_({[t.$style.wrapper]:!0,[t.$style.overflow]:e.overflow})},[l("div",{class:_(t.$style.list)},[t.$slots.header?(a(),i("div",{key:0,class:_(t.$style.header)},[b(t.$slots,"header")],2)):c("",!0),l("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"}}]]),le={key:0,class:"resource-list-loading"},ie={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=D(),ee=K(),{callDebounced:ae}=Y(),ne=X(),ue=H(),de=function(){const e=Z(),t=t=>e.isOverviewSubPage?"home":t;return{saveProjectPreferencesToLocalStorage:(e,a,s)=>{const l=t(e);if(!l)return;const i=F(Q,{});i.value[l]||(i.value[l]={}),i.value[l][a]={...i.value[l][a],...s}},loadProjectPreferencesFromLocalStorage:(e,a)=>{const s=t(e);return s&&F("N8N_WORKFLOWS_LIST_PREFERENCES",{}).value[s]?.[a]||{}},getProjectKey:t}}(),ce=e,{getResourceText:pe}=function(e){const t=j();return{getResourceText:(a,s,l)=>{const i=`${e}.${a}`,r=`resources.${a}`,o=s?`resources.${s}`:void 0;return J(i)?t.baseText(i,{interpolate:l}):J(r)?t.baseText(r,{interpolate:l}):o&&J(o)?t.baseText(o,{interpolate:l}):a.split(".").pop()?.replace(/([A-Z])/g," $1").trim()||a}}}(ce.resourceKey),ge=o(ce.sortOptions[0]),fe=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=u({get:()=>ce.filters,set:e=>xe("update:filters",e)}),Pe=u((()=>ce.hasEmptyState&&0===ce.resources.length&&!fe.value&&!$e.value.search&&!ce.resourcesRefreshing)),Se=u((()=>Object.keys($e.value))),ze=u((()=>ce.dontPerformSortingAndFiltering?ce.resources:ce.resources.filter((e=>{let t=!0;if($e.value.homeProject&&M(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=q(e)&&q(t);switch(ge.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[ge.value]?ce.sortFns[ge.value](e,t):0}}))));h((()=>ce.filters),(e=>{$e.value=e,Ae()&&(fe.value=!0)})),h((()=>$e.value.homeProject),(()=>{Te("homeProject")})),h((()=>$e.value.tags),(()=>{Te("tags")})),h((()=>$e.value.type),(()=>{Te("type")})),h((()=>$e.value.search),(()=>ae(Te,{debounceTime:1e3,trailing:!0},"search"))),h((()=>$e.value.setupNeeded),(()=>{Te("setupNeeded")})),h((()=>$e.value.incomplete),(()=>{Te("incomplete")})),h([()=>B.params?.projectId,()=>B.name],(async()=>{await Re(),await Be(),await ce.initialize()})),f((async()=>{await Be(),await ce.initialize(),await p(),Ae()&&(fe.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()},Ee=e=>"search"!==e&&("boolean"==typeof ce.filters[e]?ce.filters[e]:Array.isArray(ce.filters[e])?ce.filters[e].length>0:""!==ce.filters[e]),Ce=u((()=>{const e=Se.value.filter(Ee),t=["showArchived"];return e.every((e=>t.includes(e)))})),Ae=()=>!!Se.value.find(Ee),Ie=async e=>{_e.value=e,await Ve(),xe("update:pagination-and-sort",{pageSize:e})},Le=async(e,t=!0)=>{ge.value=e,t&&(await Ve(),Ue()),xe("update:pagination-and-sort",{sort:e})},Oe=async(e,t=!0)=>{ve.value=e,t&&await Ve(),xe("update:pagination-and-sort",{page:e})},Te=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]))})),ue.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})},De=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 Oe(1,!1),ye.value=!0,fe.value=!1,Te("reset"),xe("update:filters",$e.value)},Ue=()=>{ue.track(`User changed sorting in ${ce.resourceKey} list`,{sorting:ge.value})},Ke=e=>{fe.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,ge.value===ke.value||ce.persistKeyExclusions.includes(ge.value)?delete e.sort:(e.sort=ge.value,ke.value=ge.value),de.saveProjectPreferencesToLocalStorage(B.params.projectId??"",ce.tabKey,{sort:ce.persistKeyExclusions.includes(ge.value)?ke.value:ge.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=de.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 l=(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=l,a.pageSize=l,we.value=l}else _e.value=ce.customPageSize,a.pageSize=ce.customPageSize;var s;e.sort?ge.value=a.sort=ke.value=e.sort:t.sort?(await Le(t.sort,!1),a.sort=t.sort,ke.value=t.sort):ge.value=ce.sortOptions[0],xe("update:pagination-and-sort",a)};return t({currentPage:ve,setCurrentPage:Oe,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(),i("div",le,[w(g(U),{rows:25,"shrink-last":!1})])):(a(),i(v,{key:1},[Pe.value?(a(),i("div",ie,[b(t.$slots,"empty",{},(()=>[w(g(A),{"data-test-id":"empty-resources-list",icon:{type:"emoji",value:"👋"},heading:g(pe)(g(ne).currentUser?.firstName?"empty.heading":"empty.heading.userNotSetup",g(ne).currentUser?.firstName?"empty.heading":"empty.heading.userNotSetup",{name:g(ne).currentUser?.firstName??""}),description:g(pe)("empty.description"),"button-text":g(pe)("empty.button"),"button-type":"secondary","button-disabled":e.disabled,"onClick:button":De},{disabledButtonTooltip:z((()=>[s(d(g(pe)("empty.button.disabled.tooltip")),1)])),_:1},8,["heading","description","button-text","button-disabled"])]),!0)])):(a(),S(se,{key:1},{header:z((()=>[l("div",{class:_(t.$style["filters-row"])},[l("div",{class:_(t.$style.filters)},[b(t.$slots,"breadcrumbs",{},void 0,!0),ce.uiConfig.searchEnabled?(a(),S(g(R),{key:0,ref_key:"search",ref:me,"model-value":$e.value.search,class:_(t.$style.search),placeholder:g(pe)("search.placeholder","search.placeholder"),size:"medium",clearable:"","data-test-id":"resources-list-search","onUpdate:modelValue":We},{prefix:z((()=>[w(g(I),{icon:"search"})])),_:1},8,["model-value","class","placeholder"])):c("",!0),ce.uiConfig.sortEnabled?(a(),i("div",{key:1,class:_(t.$style["sort-and-filter"])},[w(g(T),{modelValue:ge.value,"onUpdate:modelValue":o[0]||(o[0]=e=>ge.value=e),size:"small",class:_(t.$style.resourceList),"data-test-id":"resources-list-sort",onChange:o[1]||(o[1]=e=>Le(ge.value))},{default:z((()=>[(a(!0),i(v,null,$(e.sortOptions,(e=>(a(),S(g(V),{key:e,"data-test-id":"resources-list-sort-item",value:e,label:g(pe)(`sort.${e}`,`sort.${e}`)},null,8,["value","label"])))),128))])),_:1},8,["modelValue","class"])],2)):c("",!0),ce.uiConfig.showFiltersDropdown?(a(),i("div",{key:2,class:_(t.$style["sort-and-filter"])},[w(G,{keys:Se.value,reset:Re,"model-value":$e.value,shareable:e.shareable,"just-icon":!0,"onUpdate:modelValue":Ne,"onUpdate:filtersLength":Ke},{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(),i("div",re,[w(g(E),{bold:!1},{default:z((()=>[s(d(Ce.value?g(pe)("filters.active.shortText","filters.active.shortText"):g(pe)("filters.active","filters.active"))+" ",1),w(g(W),{"data-test-id":"workflows-filter-reset",size:"small",onClick:Re},{default:z((()=>[s(d(g(pe)("filters.active.reset","filters.active.reset")),1)])),_:1})])),_:1})],512)),[[k,fe.value]]):c("",!0),o[4]||(o[4]=l("div",{class:"pb-xs"},null,-1))])),default:z((()=>[b(t.$slots,"preamble",{},void 0,!0),e.resourcesRefreshing?(a(),i("div",oe,[w(g(U),{rows:_e.value,"shrink-last":!1},null,8,["rows"])])):ze.value.length>0?(a(),i("div",{key:1,ref_key:"listWrapperRef",ref:he,"data-test-id":"resources-list-wrapper",class:_(t.$style.listWrapper)},["list-full"===e.type?(a(),S(g(C),{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(),i("div",{key:1,class:_(t.$style.paginatedListWrapper),"data-test-id":"paginated-list"},[l("div",{ref_key:"listItemsRef",ref:be,class:_(t.$style.listItems)},[(a(!0),i(v,null,$(e.resources,((e,l)=>(a(),i("div",{key:l,class:_(t.$style.listItem)},[b(t.$slots,"item",{item:e,index:l},(()=>[s(d(e),1)]),!0)],2)))),128))],2),l("div",{class:_(t.$style.listPagination)},[w(g(L),{"current-page":ve.value,"onUpdate:currentPage":[o[2]||(o[2]=e=>ve.value=e),Oe],"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(g(N),{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":Oe,"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(g(O),{key:2,color:"text-base",size:"medium","data-test-id":"resources-list-empty"},{default:z((()=>[s(d(g(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-wXDvF7ay.js.map