@directus-labs/flow-trigger-bundle
Version:
Configure one or more flows to be triggered in the editor or dashboards.
2 lines (1 loc) • 15.7 kB
JavaScript
import{useApi as e,useStores as t,definePanel as n,defineInterface as o}from"@directus/extensions-sdk";import{computed as l,ref as i,unref as r,defineComponent as a,resolveComponent as d,openBlock as s,createElementBlock as u,normalizeClass as c,Fragment as f,renderList as g,createVNode as m,withCtx as v,createTextVNode as p,toDisplayString as w,createBlock as b,createCommentVNode as h,reactive as y}from"vue";import{useI18n as C}from"vue-i18n";function S(e){return e.charAt(0).toUpperCase()+e.substring(1)}var _=["2D","3D","4WD","A2O","AI","API","BIOS","CC","CCTV","CCV","CD","CD-ROM","CIA","CMS","COBOL","CSS","CSV","CV","DB","DIY","DNA","DVD","E3","EIN","ESPN","FAQ","FAQs","FBI","FORTRAN","FPS","FTP","HTML","HTTP","HTTPS","ID","IP","ISO","JS","JSON","LASER","M2A","M2M","M2MM","M2O","MMORPG","NAFTA","NASA","NDA","O2A","O2M","PDF","PHP","POP","RAM","RNGR","ROM","RPG","RTFM","RTS","SCUBA","SDK","SITCOM","SKU","SMTP","SQL","SSL","SSN","SWAT","TBS","TLS","TNA","TS","TTL","TV","UI","URL","USB","UWP","VIP","W3C","WWE","WWF","WWW","WYSIWYG"],k=["a","an","the"],T=["and","that","but","or","as","if","when","than","because","while","where","after","so","though","since","until","whether","before","although","nor","like","once","unless","now","except"],I=["about","above","across","after","against","along","among","around","at","because of","before","behind","below","beneath","beside","besides","between","beyond","but","by","concerning","despite","down","during","except","excepting","for","from","in","in front of","inside","in spite of","instead of","into","like","near","of","off","on","onto","out","outside","over","past","regarding","since","through","throughout","to","toward","under","underneath","until","up","upon","up to","with","within","without","with regard to","with respect to"],x=["2FA","4K","5K","8K","AGI","BI","ChatGPT","CTA","DateTime","FMS","GitHub","GPT","HD","IBMid","IDs","iMac","IMAX","iOS","iPad","iPhone","iPod","LDAP","LinkedIn","LLM","macOS","McDonalds","ML","MySQL","NLG","NLP","NLU","OpenAI","PDFs","PIM","PEFT","pH","PostgreSQL","SEO","TTS","UHD","UUID","XSS","YouTube"];function A(e,t,n){const o=e.toLowerCase(),l=e.toUpperCase();for(const e of x)if(e.toLowerCase()===o)return e;return _.includes(l)?l:0===t||t===n.length-1||e.length>=4?e:I.includes(o)||T.includes(o)||k.includes(o)?o:e}function D(e,t){return`${e} ${t}`}var B=function(e,t=new RegExp("\\s|-|_","g")){return(n=e,n.replace(/([a-z\d])([A-Z])/g,"$1_$2").replace(/([A-Z]+)([A-Z][a-z\d]+)/g,"$1_$2").toLowerCase()).split(t).map(S).map(A).reduce(D);var n};function P(n){const{t:o}=C(),a=e(),{useFlowsStore:d,useNotificationsStore:s}=t(),u=d(),c=s(),f=l((()=>{const e=new Map;for(const t of u.flows)e.set(t.id,t);return e}));function g(e){if(!e)return null;const t=r(f).get(e);return t||null}const m=i([]),v=i(null),p=i(),w=i(null),b=l((()=>{var e,t;if(!v.value)return!0;for(const n of(null==(e=w.value)?void 0:e.fields)||[])if((null==(t=n.meta)?void 0:t.required)&&(!p.value||null===p.value[n.field]||void 0===p.value[n.field]))return!0;return!1})),h=l((()=>v.value&&w.value));async function y(){var e,t;const l=r(v);if(!l)return;const i=g(l.flowId);if(!i)return;const d=i.id;m.value=[...m.value,d];const s=n.collection(l),u=n.keys(l),f=null!=(e=r(p))?e:{};console.log("values",f);try{!1===(null==(t=i.options)?void 0:t.requireSelection)&&0===(null==u?void 0:u.length)?await a.post(`/flows/trigger/${d}`,{...f,collection:s}):await a.post(`/flows/trigger/${d}`,{...f,collection:s,keys:u}),c.add({title:o("run_flow_success",{flow:i.name})}),S()}catch(e){!function(e){var t,n,l,i,r,a;const d=(null==(r=null==(i=null==(l=null==(n=null==(t=null==e?void 0:e.response)?void 0:t.data)?void 0:n.errors)?void 0:l[0])?void 0:i.extensions)?void 0:r.code)||(null==(a=null==e?void 0:e.extensions)?void 0:a.code)||"UNKNOWN";console.warn(e),c.add({title:o(`errors.${d}`),type:"error",code:d,dialog:!0,error:e})}(e)}finally{v.value=null,m.value=m.value.filter((e=>e!==d))}}function S(){v.value=null,w.value=null,p.value=null}return{getFlow:g,runFlow:y,runningFlows:m,onTriggerClick:async function(e){v.value=e,function(){var e,t,n;const o=g(null==(e=v.value)?void 0:e.flowId);o&&(Boolean(null==(t=o.options)?void 0:t.requireConfirmation)?w.value={description:o.options.confirmationDescription,fields:(null!=(n=o.options.fields)?n:[]).map((e=>({...e,name:!e.name&&e.field?B(e.field):e.name})))}:y())}()},getButtonText:function(e){if(e.text)return e.text;const t=g(e.flowId);return t?t.name:o("run_flow")},getButtonIcon:function(e){if(e.icon)return e.icon;const t=g(e.flowId);return t?t.icon:"bolt"},confirmDetails:w,confirmValues:p,displayCustomConfirmDialog:h,isConfirmButtonDisabled:b,getConfirmButtonText:function(){return o("run_flow")},resetConfirm:S}}const F={class:"trigger"};var M=a({__name:"panel",props:{showHeader:{type:Boolean,default:!1},triggers:{}},setup(e){const n=e,{t:o}=C(),{usePermissionsStore:i}=t(),a=i(),{runFlow:y,runningFlows:S,onTriggerClick:_,getButtonText:k,getButtonIcon:T,confirmDetails:I,confirmValues:x,displayCustomConfirmDialog:A,isConfirmButtonDisabled:D,getConfirmButtonText:B,resetConfirm:M}=P({collection:e=>e.collection,keys:e=>e.keys}),N=l((()=>{var e;return null==(e=n.triggers)?void 0:e.filter((({trigger:e})=>e.collection&&a.hasPermission(e.collection,"read")))}));return(e,t)=>{const l=d("v-icon"),i=d("v-button"),a=d("v-card-title"),C=d("v-form"),P=d("v-card-text"),L=d("v-card-actions"),O=d("v-card"),E=d("v-dialog");return s(),u("div",{class:c(["panel-flows",{"has-header":n.showHeader}])},[(s(!0),u(f,null,g(N.value,(({trigger:e})=>(s(),u("div",F,[m(i,{"full-width":"",loading:r(S).includes(e.flowId),onClick:t=>r(_)(e)},{default:v((()=>[m(l,{name:r(T)(e),small:"",left:""},null,8,["name"]),p(" "+w(r(k)(e)),1)])),_:2},1032,["loading","onClick"])])))),256)),m(E,{"model-value":r(A),onEsc:r(M)},{default:v((()=>[m(O,{class:"allow-drawer"},{default:v((()=>[m(a,null,{default:v((()=>{var e;return[p(w(null!=(e=r(I).description)?e:r(o)("run_flow_confirm")),1)]})),_:1}),m(P,{class:"confirm-form"},{default:v((()=>[r(I).fields&&r(I).fields.length>0?(s(),b(C,{key:0,fields:r(I).fields,"model-value":r(x),autofocus:"","primary-key":"+","onUpdate:modelValue":t[0]||(t[0]=e=>x.value=e)},null,8,["fields","model-value"])):h("v-if",!0)])),_:1}),m(L,null,{default:v((()=>[m(i,{secondary:"",onClick:r(M)},{default:v((()=>[p(w(r(o)("cancel")),1)])),_:1},8,["onClick"]),m(i,{disabled:r(D),onClick:t[1]||(t[1]=e=>r(y)())},{default:v((()=>[p(w(r(B)()),1)])),_:1},8,["disabled"])])),_:1})])),_:1})])),_:1},8,["model-value","onEsc"])],2)}}}),N=[],L=[];function O(e,t){if(e&&"undefined"!=typeof document){var n,o=!0===t.prepend?"prepend":"append",l=!0===t.singleTag,i="string"==typeof t.container?document.querySelector(t.container):document.getElementsByTagName("head")[0];if(l){var r=N.indexOf(i);-1===r&&(r=N.push(i)-1,L[r]={}),n=L[r]&&L[r][o]?L[r][o]:L[r][o]=a()}else n=a();65279===e.charCodeAt(0)&&(e=e.substring(1)),n.styleSheet?n.styleSheet.cssText+=e:n.appendChild(document.createTextNode(e))}function a(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),t.attributes)for(var n=Object.keys(t.attributes),l=0;l<n.length;l++)e.setAttribute(n[l],t.attributes[n[l]]);var r="prepend"===o?"afterbegin":"beforeend";return i.insertAdjacentElement(r,e),e}}O("\n.panel-flows[data-v-bd27b4af] {\n\tpadding: 12px;\n}\n.panel-flows.has-header[data-v-bd27b4af] {\n\tpadding: 0 12px;\n}\n.trigger[data-v-bd27b4af] {\n\tmargin-bottom: 12px;\n}\n.flow-field[data-v-bd27b4af] {\n\tdisplay: flex;\n\talign-items: center;\n\tmargin-top: 0.5em;\n\tbackground-color: var(--background-subdued);\n\tpadding: 0.5em 0.75em;\n\tborder-radius: var(--border-radius);\n\tborder: var(--border-width) solid var(--border-subdued);\n}\n.flow-icon[data-v-bd27b4af] {\n\toverflow: hidden;\n\tbackground-color: var(--background-normal-alt);\n\tborder: var(--border-width) solid var(--border-subdued);\n\tborder-radius: 50%;\n\tpadding: 0.5em;\n\tline-height: 1;\n\tflex-shrink: 0;\n}\n.flow-detail[data-v-bd27b4af] {\n\tflex-grow: 1;\n\tpadding: 0 1em;\n}\n.flow-detail[data-v-bd27b4af] * {\n\tdisplay: block;\n\tline-height: 1.2;\n}\n.flow-title[data-v-bd27b4af] {\n\tfont-weight: bold;\n}\n.flow-desc[data-v-bd27b4af] {\n\tfont-size: 0.8em;\n}\n.v-info[data-v-bd27b4af] {\n\tmargin-top: 2em;\n}\n",{});var E=(e,t)=>{const n=e.__vccOpts||e;for(const[e,o]of t)n[e]=o;return n},U=n({id:"flow-triggers-panel",name:"Flows",description:"Configure one or more flows to be triggered by a button.",icon:"bolt",component:E(M,[["__scopeId","data-v-bd27b4af"],["__file","panel.vue"]]),options:[{field:"triggers",name:"Triggers",type:"json",meta:{width:"full",interface:"list",options:{template:"{{ trigger.text }}",fields:[{field:"trigger",name:"Flow",type:"json",meta:{required:!0,width:"full",interface:"system-flow-trigger-form",options:{nested:!0}}}]}}}],minWidth:12,minHeight:8});const R={key:0,class:"interface-flows"},W={class:"trigger"};var V=a({__name:"interface",props:{triggers:{},disabled:{type:Boolean},collection:{},primaryKey:{},field:{},width:{}},setup(e){const t=e,{t:n}=C(),{getFlow:o,runFlow:i,runningFlows:a,onTriggerClick:c,getButtonText:y,getButtonIcon:S,confirmDetails:_,confirmValues:k,displayCustomConfirmDialog:T,isConfirmButtonDisabled:I,getConfirmButtonText:x,resetConfirm:A}=P({collection:e=>t.collection,keys:e=>t.primaryKey?[t.primaryKey]:void 0}),D=l((()=>t.triggers&&t.triggers.some((({trigger:e})=>!B(e)))));function B(e){var n;if(t.disabled)return!0;const l=o(e.flowId);if(!l)return!0;return!(!1===(null==(n=l.options)?void 0:n.requireSelection)||"+"!==t.primaryKey)}return(e,o)=>{const l=d("v-icon"),C=d("v-button"),P=d("v-card-title"),F=d("v-form"),M=d("v-card-text"),N=d("v-card-actions"),L=d("v-card"),O=d("v-dialog");return D.value?(s(),u("div",R,[(s(!0),u(f,null,g(t.triggers,(({trigger:e})=>(s(),u("div",W,[m(C,{"full-width":"",loading:r(a).includes(e.flowId),disabled:B(e),onClick:t=>r(c)(e)},{default:v((()=>[m(l,{name:r(S)(e),small:"",left:""},null,8,["name"]),p(" "+w(r(y)(e)),1)])),_:2},1032,["loading","disabled","onClick"])])))),256)),m(O,{"model-value":r(T),onEsc:r(A)},{default:v((()=>[m(L,{class:"allow-drawer"},{default:v((()=>[m(P,null,{default:v((()=>{var e;return[p(w(null!=(e=r(_).description)?e:r(n)("run_flow_confirm")),1)]})),_:1}),m(M,{class:"confirm-form"},{default:v((()=>[r(_).fields&&r(_).fields.length>0?(s(),b(F,{key:0,fields:r(_).fields,"model-value":r(k),autofocus:"","primary-key":"+","onUpdate:modelValue":o[0]||(o[0]=e=>k.value=e)},null,8,["fields","model-value"])):h("v-if",!0)])),_:1}),m(N,null,{default:v((()=>[m(C,{secondary:"",onClick:r(A)},{default:v((()=>[p(w(r(n)("cancel")),1)])),_:1},8,["onClick"]),m(C,{disabled:r(I),onClick:o[1]||(o[1]=e=>r(i)())},{default:v((()=>[p(w(r(x)()),1)])),_:1},8,["disabled"])])),_:1})])),_:1})])),_:1},8,["model-value","onEsc"])])):h("v-if",!0)}}});O("\n.interface-flows[data-v-7e239f4b] {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: 8px;\n}\n.trigger[data-v-7e239f4b] {\n\tmargin-bottom: 12px;\n}\n.flow-field[data-v-7e239f4b] {\n\tdisplay: flex;\n\talign-items: center;\n\tmargin-top: 0.5em;\n\tbackground-color: var(--background-subdued);\n\tpadding: 0.5em 0.75em;\n\tborder-radius: var(--border-radius);\n\tborder: var(--border-width) solid var(--border-subdued);\n}\n.flow-icon[data-v-7e239f4b] {\n\toverflow: hidden;\n\tbackground-color: var(--background-normal-alt);\n\tborder: var(--border-width) solid var(--border-subdued);\n\tborder-radius: 50%;\n\tpadding: 0.5em;\n\tline-height: 1;\n\tflex-shrink: 0;\n}\n.flow-detail[data-v-7e239f4b] {\n\tflex-grow: 1;\n\tpadding: 0 1em;\n}\n.flow-detail[data-v-7e239f4b] * {\n\tdisplay: block;\n\tline-height: 1.2;\n}\n.flow-title[data-v-7e239f4b] {\n\tfont-weight: bold;\n}\n.flow-desc[data-v-7e239f4b] {\n\tfont-size: 0.8em;\n}\n.v-info[data-v-7e239f4b] {\n\tmargin-top: 2em;\n}\n",{});var q=o({id:"flow-triggers-interface",name:"Flows",description:"Configure one or more flows to be triggered by a button.",icon:"bolt",component:E(V,[["__scopeId","data-v-7e239f4b"],["__file","interface.vue"]]),hideLabel:!0,hideLoader:!0,autoKey:!0,types:["alias"],localTypes:["presentation"],group:"presentation",options:({collection:e})=>[{field:"triggers",name:"Triggers",type:"json",meta:{width:"full",interface:"list",options:{template:"{{ trigger.text }}",fields:[{field:"trigger",name:"Flow",type:"json",collection:e,meta:{required:!0,width:"full",interface:"system-flow-trigger-form",options:{nested:!0}}}]}}}]}),H=a({__name:"interface",props:{value:{default:null},nested:{type:Boolean,default:!1},collection:{}},emits:["input"],setup(e,{emit:n}){var o;const a=e,g=n,{useFlowsStore:m,useCollectionsStore:w,usePermissionsStore:h}=t(),C=m(),S=w(),_=h().hasPermission("directus_flows","read"),k=y(null!=(o=a.value)?o:{flowId:null}),T=C.flows.filter((({trigger:e,options:t})=>{var n;return"manual"===e&&(!a.collection||Boolean(null==(n=null==t?void 0:t.collections)?void 0:n.includes(a.collection)))})),I=i(T.find((({id:e})=>e===k.flowId))),x=l((()=>{var e,t;let n=S.collections;if(a.collection)n=n.filter((({collection:e})=>e===a.collection));else if(I.value){const o=r(I),l=new Set(null!=(t=null==(e=o.options)?void 0:e.collections)?t:[]);n=n.filter((({collection:e})=>l.has(e)))}return n.filter((e=>"alias"!==e.type)).map((e=>({text:e.name,value:e.collection})))})),A=l((()=>{var e;let t=[{field:"flowId",name:"Flow",type:"string",meta:{required:!0,width:"full",interface:"select-dropdown",options:{placeholder:"Select a Flow",choices:T,itemValue:"id",itemText:"name",itemIcon:"icon",itemColor:"color"}}}];if(k.flowId){const n=r(I),o=!1!==(null==(e=null==n?void 0:n.options)?void 0:e.requireSelection);Boolean(a.collection)||(t=t.concat([{field:"collection",name:"Collection",type:"string",meta:{required:!0,readonly:0===x.value.length,width:"half",interface:"select-dropdown",options:{placeholder:0===x.value.length?"No collections available":"Select a collection",choices:x.value,allowNone:!1}}},{field:"keys",name:"IDs",type:"csv",meta:{required:o,width:"half",interface:"tags",options:{placeholder:"Add an ID and press Enter...",iconRight:"vpn_key"}}}])),t=t.concat([{field:"text",name:"Button Text",type:"string",meta:{width:"half",interface:"input",options:{placeholder:"Button Text"}}},{field:"icon",name:"Button Icon",type:"string",meta:{width:"half",interface:"select-icon"}}])}return t}));function D(e){const{flowId:t}=e,n=k.flowId!==t;if(k.flowId=t,n){const e=r(T).find((({id:e})=>e===t));k.text=e.name,k.icon=e.icon,I.value=e}else k.text=e.text,k.icon=e.icon;Boolean(a.collection)||(k.collection=e.collection,k.keys=e.keys),g("input",k)}return(e,t)=>{const n=d("v-notice"),o=d("v-form");return r(T).length<1?(s(),u(f,{key:0},[r(_)?a.collection?(s(),b(n,{key:1,type:"warning"},{default:v((()=>[p(" No manual flows are available for this collection. ")])),_:1})):(s(),b(n,{key:2,type:"warning"},{default:v((()=>[p(" No manual flows are available. ")])),_:1})):(s(),b(n,{key:0,type:"warning"},{default:v((()=>[p(" You do not have permission to view flows. ")])),_:1}))],64)):(s(),b(o,{key:1,class:c(["system-flow-trigger-form",{nested:a.nested}]),"model-value":k,fields:A.value,"onUpdate:modelValue":D},null,8,["class","model-value","fields"]))}}});O("\n.system-flow-trigger-form.nested[data-v-faefc0b9] .field.first-visible-field .field-label {\n\tdisplay: none;\n}\n",{});const K=[q,o({id:"system-flow-trigger-form",name:"Flow",description:"Build a flow trigger.",icon:"bolt",component:E(H,[["__scopeId","data-v-faefc0b9"],["__file","interface.vue"]]),options:null,types:["json"],system:!0})],G=[],$=[],j=[],Q=[U],Y=[],z=[];export{G as displays,K as interfaces,$ as layouts,j as modules,z as operations,Q as panels,Y as themes};