feat: add workflow state block

package.json

@@ -72,6 +72,7 @@
     "vue": "^3.2.37",
     "vue-i18n": "^9.2.0-beta.40",
     "vue-imask": "^6.4.2",
+    "vue-multiselect": "^3.0.0-alpha.2",
     "vue-router": "^4.1.5",
     "vue-toastification": "^2.0.0-rc.5",
     "vuedraggable": "^4.1.0",

src/background/WorkflowState.js

@@ -38,6 +38,10 @@ class WorkflowState {
     if (index !== -1) listeners.splice(index, 1);
   }
 
+  get getAll() {
+    return this.states;
+  }
+
   async get(stateId) {
     let { states } = this;
 

src/background/workflowEngine/blocksHandler/handlerWorkflowState.js

@@ -0,0 +1,28 @@
+export default async function ({ data, id }) {
+  let stopCurrent = false;
+
+  if (data.type === 'stop-current') {
+    return {};
+  }
+  if (data.type === 'stop-all') {
+    const ids = [];
+    this.engine.states.getAll.forEach((state) => {
+      ids.push(state.id);
+    });
+
+    for (const stateId of ids) {
+      if (stateId === this.engine.id) {
+        stopCurrent = !data.exceptCurrent;
+      } else {
+        await this.engine.states.stop(stateId);
+      }
+    }
+  }
+
+  if (stopCurrent) return {};
+
+  return {
+    data: '',
+    nextBlockId: this.getBlockConnections(id),
+  };
+}

src/background/workflowEngine/worker.js

@@ -89,6 +89,8 @@ class Worker {
   }
 
   getBlockConnections(blockId, outputIndex = 1) {
+    if (this.engine.isDestroyed) return null;
+
     const outputId = `${blockId}-output-${outputIndex}`;
     return this.engine.connectionsMap[outputId] || null;
   }
@@ -165,7 +167,6 @@ class Worker {
       activeTabUrl: this.activeTab.url,
     };
 
-    console.log(this.blocksDetail, this.blocksDetail[block.label]);
     const replacedBlock = referenceData({
       block,
       data: refData,
@@ -205,6 +206,8 @@ class Worker {
           ...(execParam || {}),
         });
 
+        if (this.engine.isDestroyed) return;
+
         if (result.replacedValue) {
           replacedBlock.replacedValue = result.replacedValue;
         }

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

@@ -0,0 +1,63 @@
+<template>
+  <div>
+    <ui-textarea
+      :model-value="data.description"
+      class="w-full"
+      :placeholder="t('common.description')"
+      @change="updateData({ description: $event })"
+    />
+    <ui-select
+      :model-value="data.type"
+      label="Action"
+      class="w-full mt-4"
+      @change="updateData({ type: $event })"
+    >
+      <optgroup v-for="action in actions" :key="action.id" :label="action.name">
+        <option
+          v-for="item in actionsItems[action.id]"
+          :key="item.id"
+          :value="item.id"
+        >
+          {{ item.name }}
+        </option>
+      </optgroup>
+    </ui-select>
+    <ui-checkbox
+      v-if="includeExceptions.includes(data.type)"
+      :model-value="data.exceptCurrent"
+      class="mt-2"
+      @change="updateData({ exceptCurrent: $event })"
+    >
+      Execpt for the current workflow
+    </ui-checkbox>
+  </div>
+</template>
+<script setup>
+import { useI18n } from 'vue-i18n';
+
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => ({}),
+  },
+});
+const emit = defineEmits(['update:data']);
+
+const { t } = useI18n();
+
+const includeExceptions = ['stop-all'];
+const actions = [
+  { id: 'stop', name: t('workflow.blocks.workflow-state.actions.stop') },
+];
+const actionsItems = {
+  stop: [
+    { id: 'stop-all', name: 'Stop all workflows' },
+    { id: 'stop-current', name: 'Stop current workflow' },
+    // { id: 'stop-specific', name: 'Stop specific workflows' },
+  ],
+};
+
+function updateData(value) {
+  emit('update:data', { ...props.data, ...value });
+}
+</script>

src/locales/en/blocks.json

@@ -118,6 +118,13 @@
         "start": "Start index",
         "end": "End index"
       },
+      "workflow-state": {
+        "name": "Workflow state",
+        "description": "Manage workflows states",
+        "actions": {
+          "stop": "Stop workflows"
+        }
+      },
       "regex-variable": {
         "name": "RegEx variable",
         "description": "Matching a variable value against a regular expression"

src/utils/shared.js

@@ -1296,6 +1296,25 @@ export const tasks = {
       fontSize: 'regular',
     },
   },
+  'workflow-state': {
+    name: 'Workflow State',
+    description: 'Manage workflows states',
+    icon: 'riFileEditLine',
+    component: 'BlockBasic',
+    editComponent: 'EditWorkflowState',
+    category: 'general',
+    inputs: 1,
+    outputs: 1,
+    allowedInputs: true,
+    maxConnection: 1,
+    data: {
+      disableBlock: false,
+      description: '',
+      type: 'stop-current',
+      exceptCurrent: false,
+      workflowsToStop: [],
+    },
+  },
 };
 
 export const categories = {

yarn.lock

@@ -6569,6 +6569,11 @@ vue-loader@^17.0.0:
     hash-sum "^2.0.0"
     loader-utils "^2.0.0"
 
+vue-multiselect@^3.0.0-alpha.2:
+  version "3.0.0-alpha.2"
+  resolved "https://registry.yarnpkg.com/vue-multiselect/-/vue-multiselect-3.0.0-alpha.2.tgz#58186f781136e71f1272b98690b569a0c00ed161"
+  integrity sha512-Xp9fGJECns45v+v8jXbCIsAkCybYkEg0lNwr7Z6HDUSMyx2TEIK2giipPE+qXiShEc1Ipn+ZtttH2iq9hwXP4Q==
+
 vue-router@^4.1.5:
   version "4.1.5"
   resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-4.1.5.tgz#256f597e3f5a281a23352a6193aa6e342c8d9f9a"