v0.15.2

src/background/workflow-engine/engine.js

@@ -240,7 +240,11 @@ class WorkflowEngine {
       return;
     }
 
-    const replacedBlock = referenceData({ block, data: this.referenceData });
+    const replacedBlock = referenceData({
+      block,
+      data: this.referenceData,
+      refKeys: tasks[block.name].refDataKeys,
+    });
     const blockDelay = this.workflow.settings?.blockDelay || 0;
 
     try {

src/components/newtab/workflow/edit/EditWebhook.vue

@@ -48,7 +48,7 @@
         value="headers"
         class="grid grid-cols-7 justify-items-center gap-2"
       >
-        <template v-for="(items, index) in headerRef" :key="index">
+        <template v-for="(items, index) in headers" :key="index">
           <ui-input
             v-model="items.name"
             :placeholder="`Header ${index + 1}`"
@@ -75,15 +75,15 @@
       </ui-tab-panel>
       <ui-tab-panel value="body">
         <pre
-          v-if="!showContentModalRef"
+          v-if="!showBodyModal"
           class="rounded-lg text-gray-200 p-4 max-h-80 bg-gray-900 overflow-auto"
-          @click="showContentModalRef = true"
+          @click="showBodyModal = true"
           v-text="data.body"
         />
       </ui-tab-panel>
     </ui-tab-panels>
     <ui-modal
-      v-model="showContentModalRef"
+      v-model="showBodyModal"
       content-class="max-w-3xl"
       :title="t('workflow.blocks.webhook.tabs.body')"
     >
@@ -123,21 +123,21 @@ const emit = defineEmits(['update:data']);
 const { t } = useI18n();
 
 const activeTab = ref('headers');
-const headerRef = ref(props.data.headers);
-const showContentModalRef = ref(false);
+const showBodyModal = ref(false);
+const headers = ref(JSON.parse(JSON.stringify(props.data.headers)));
 
 function updateData(value) {
   emit('update:data', { ...props.data, ...value });
 }
 function removeHeader(index) {
-  headerRef.value.splice(index, 1);
+  headers.value.splice(index, 1);
 }
 function addHeader() {
-  headerRef.value.push({ name: '', value: '' });
+  headers.value.push({ name: '', value: '' });
 }
 
 watch(
-  headerRef,
+  headers,
   (value) => {
     updateData({ headers: value });
   },

src/newtab/pages/workflows/[id].vue

@@ -365,7 +365,6 @@ function renameWorkflow() {
 provide('workflow', {
   data: workflow,
   updateWorkflow,
-  /* eslint-disable-next-line */
   showDataColumnsModal: (show = true) => {
     state.showModal = show;
     state.modalName = 'data-columns';
@@ -375,6 +374,7 @@ provide('workflow', {
 onBeforeRouteLeave(() => {
   if (!state.isDataChanged) return;
 
+  /* eslint-disable-next-line */
   const answer = window.confirm(t('message.notSaved'));
 
   if (!answer) return false;

src/utils/reference-data/index.js

@@ -3,19 +3,17 @@ import dayjs from '@/lib/dayjs';
 import { objectHasKey } from '@/utils/helper';
 import mustacheReplacer from './mustache-replacer';
 
+/* eslint-disable prefer-destructuring */
 export const funcs = {
   date(...args) {
     let date = new Date();
     let dateFormat = 'DD-MM-YYYY';
 
-    const getDateFormat = (value) =>
-      value ? value?.replace(/['"]/g, '') : dateFormat;
-
     if (args.length === 1) {
-      dateFormat = getDateFormat(args[0]);
+      dateFormat = args[0];
     } else if (args.length >= 2) {
       date = new Date(args[0]);
-      dateFormat = getDateFormat(args[1]);
+      dateFormat = args[1];
     }
 
     /* eslint-disable-next-line */
@@ -34,24 +32,13 @@ export const funcs = {
   },
 };
 
-export default function ({ block, data: refData }) {
-  const replaceKeys = [
-    'url',
-    'name',
-    'body',
-    'value',
-    'fileName',
-    'selector',
-    'prefixText',
-    'customData',
-    'globalData',
-    'suffixText',
-    'extraRowValue',
-  ];
+export default function ({ block, refKeys, data: refData }) {
+  if (!refKeys || refKeys.length === 0) return block;
+
   let replacedBlock = { ...block };
   const data = Object.assign(refData, { funcs });
 
-  replaceKeys.forEach((blockDataKey) => {
+  refKeys.forEach((blockDataKey) => {
     if (!objectHasKey(block.data, blockDataKey)) return;
 
     const newDataValue = mustacheReplacer({

src/utils/reference-data/mustache-replacer.js

@@ -7,15 +7,21 @@ export function extractStrFunction(str) {
 
   if (!extractedStr) return null;
 
+  const { 1: name, 2: funcParams } = extractedStr;
+
+  const params = funcParams
+    .split(/,(?=(?:[^"]*"[^"]*")*[^"]*$)/)
+    .map((param) => param?.trim().replace(/^['"]|['"]$/g, '') || '');
+
   return {
-    name: extractedStr[1],
-    params: extractedStr[2].split(','),
+    name,
+    params,
   };
 }
 
 export default function ({ str, data, block }) {
   const replacedStr = replaceMustache(str, (match) => {
-    const key = match.slice(2, -2).replace(/\s/g, '');
+    const key = match.slice(2, -2).trim();
 
     if (!key) return '';
 

src/utils/shared.js

@@ -14,6 +14,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['url'],
     data: {
       description: '',
       type: 'manual',
@@ -39,6 +40,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['globalData'],
     data: {
       workflowId: '',
       globalData: '',
@@ -68,6 +70,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['url'],
     data: {
       description: '',
       url: '',
@@ -148,6 +151,7 @@ export const tasks = {
     outputs: 1,
     maxConnection: 1,
     allowedInputs: true,
+    refDataKeys: ['url'],
     data: {
       url: '',
       activeTab: true,
@@ -166,6 +170,7 @@ export const tasks = {
     outputs: 1,
     maxConnection: 1,
     allowedInputs: true,
+    refDataKeys: ['fileName'],
     data: {
       fileName: '',
       ext: 'png',
@@ -186,6 +191,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['selector'],
     data: {
       description: '',
       findBy: 'cssSelector',
@@ -220,6 +226,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['selector', 'prefixText', 'suffixText', 'extraRowValue'],
     data: {
       description: '',
       findBy: 'cssSelector',
@@ -247,6 +254,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['name'],
     data: {
       name: '',
       refKey: '',
@@ -265,6 +273,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['selector'],
     data: {
       description: '',
       findBy: 'cssSelector',
@@ -290,6 +299,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['selector'],
     data: {
       description: '',
       findBy: 'cssSelector',
@@ -309,6 +319,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['selector', 'attributeName', 'extraRowValue'],
     data: {
       description: '',
       findBy: 'cssSelector',
@@ -334,6 +345,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['selector', 'value'],
     data: {
       description: '',
       findBy: 'cssSelector',
@@ -407,6 +419,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['selector'],
     data: {
       description: '',
       findBy: 'cssSelector',
@@ -430,6 +443,7 @@ export const tasks = {
     docs: true,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['customData'],
     data: {
       range: '',
       refKey: '',
@@ -469,6 +483,7 @@ export const tasks = {
     outputs: 2,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['selector'],
     data: {
       findBy: 'cssSelector',
       selector: '',
@@ -488,12 +503,13 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['body', 'url'],
     data: {
       description: '',
       url: '',
       contentType: 'json',
       timeout: 10000,
-      headers: [{ name: '', value: '' }],
+      headers: [],
       body: '{}',
     },
   },
@@ -508,6 +524,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['loopData'],
     data: {
       loopId: '',
       maxLoop: 0,
@@ -562,6 +579,7 @@ export const tasks = {
     outputs: 1,
     allowedInputs: true,
     maxConnection: 1,
+    refDataKeys: ['selector'],
     data: {
       findBy: 'cssSelector',
       selector: '',