feat: add more options on export data block

src/background/workflow-engine/blocks-handler/handler-export-data.js

@@ -1,13 +1,20 @@
 import { getBlockConnection } from '../helper';
 import dataExporter from '@/utils/data-exporter';
 
-function exportData(block) {
+function exportData({ data, outputs }) {
   return new Promise((resolve) => {
-    dataExporter(this.referenceData.dataColumns, block.data);
+    const dataToExport = data.dataToExport || 'data-columns';
+    let payload = this.referenceData.dataColumns;
+
+    if (dataToExport === 'google-sheets') {
+      payload = this.referenceData.googleSheets[data.refKey] || [];
+    }
+
+    dataExporter(payload, data);
 
     resolve({
       data: '',
-      nextBlockId: getBlockConnection(block),
+      nextBlockId: getBlockConnection({ outputs }),
     });
   });
 }

src/components/newtab/workflow/WorkflowBuilder.vue

@@ -64,6 +64,7 @@
 import { onMounted, shallowRef, reactive, getCurrentInstance } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { compare } from 'compare-versions';
+import defu from 'defu';
 import emitter from 'tiny-emitter/instance';
 import { useShortcut, getShortcut } from '@/composable/shortcut';
 import { tasks } from '@/utils/shared';
@@ -225,14 +226,7 @@ export default {
           const newDrawflowData = Object.entries(
             data.drawflow.Home.data
           ).reduce((obj, [key, value]) => {
-            const newBlockData = {
-              ...tasks[value.name],
-              ...value,
-              data: {
-                ...tasks[value.name].data,
-                ...value.data,
-              },
-            };
+            const newBlockData = defu(value, tasks[value.name]);
 
             obj[key] = newBlockData;
 

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

@@ -0,0 +1,64 @@
+<template>
+  <div>
+    <ui-textarea
+      :model-value="data.description"
+      class="w-full"
+      :placeholder="t('common.description')"
+      @change="updateData({ description: $event })"
+    />
+    <ui-select
+      :model-value="data.dataToExport"
+      :placeholder="t('workflow.blocks.export-data.dataToExport.placeholder')"
+      class="w-full mt-2"
+      @change="updateData({ dataToExport: $event })"
+    >
+      <option v-for="option in dataToExport" :key="option" :value="option">
+        {{ t(`workflow.blocks.export-data.dataToExport.options.${option}`) }}
+      </option>
+    </ui-select>
+    <ui-input
+      :model-value="data.name"
+      class="w-full mt-2"
+      title="File name"
+      placeholder="File name"
+      @change="updateData({ name: $event })"
+    />
+    <ui-input
+      v-if="data.dataToExport === 'google-sheets'"
+      :model-value="data.refKey"
+      :title="t('workflow.blocks.export-data.refKey')"
+      :placeholder="t('workflow.blocks.export-data.refKey')"
+      class="w-full mt-2"
+      @change="updateData({ refKey: $event })"
+    />
+    <ui-select
+      :model-value="data.type"
+      :placeholder="t('workflow.blocks.export-data.exportAs')"
+      class="w-full mt-2"
+      @change="updateData({ type: $event })"
+    >
+      <option v-for="type in dataExportTypes" :key="type.id" :value="type.id">
+        {{ type.name }}
+      </option>
+    </ui-select>
+  </div>
+</template>
+<script setup>
+import { useI18n } from 'vue-i18n';
+import { dataExportTypes } from '@/utils/shared';
+
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => ({}),
+  },
+});
+const emit = defineEmits(['update:data']);
+
+const { t } = useI18n();
+const dataToExport = ['data-columns', 'google-sheets'];
+
+function updateData(value) {
+  emit('update:data', { ...props.data, ...value });
+}
+</script>

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

@@ -1,5 +1,11 @@
 <template>
   <div>
+    <ui-textarea
+      :model-value="data.description"
+      class="w-full mb-2"
+      :placeholder="t('common.description')"
+      @change="updateData({ description: $event })"
+    />
     <ui-select
       v-if="false"
       :model-value="data.type"

src/locales/en/blocks.json

@@ -174,7 +174,16 @@
       },
       "export-data": {
         "name": "Export data",
-        "description": "Export workflow data columns"
+        "description": "Export workflow data columns",
+        "exportAs": "Export as",
+        "refKey": "Reference key",
+        "dataToExport": {
+          "placeholder": "Data to export",
+          "options": {
+            "data-columns": "Data columns",
+            "google-sheets": "Google sheets",
+          },
+        }
       },
       "element-scroll": {
         "name": "Scroll element",

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

@@ -148,10 +148,12 @@ import {
 import { useStore } from 'vuex';
 import { useRoute, useRouter, onBeforeRouteLeave } from 'vue-router';
 import { useI18n } from 'vue-i18n';
+import defu from 'defu';
 import emitter from 'tiny-emitter/instance';
+import { useDialog } from '@/composable/dialog';
+import { tasks } from '@/utils/shared';
 import { sendMessage } from '@/utils/message';
 import { debounce, isObject } from '@/utils/helper';
-import { useDialog } from '@/composable/dialog';
 import { exportWorkflow } from '@/utils/workflow-data';
 import Log from '@/models/log';
 import Workflow from '@/models/workflow';
@@ -296,7 +298,7 @@ function saveWorkflow() {
 }
 function editBlock(data) {
   state.isEditBlock = true;
-  state.blockData = data;
+  state.blockData = defu(data, tasks[data.id] || {});
 }
 function executeWorkflow() {
   if (editor.value.getNodesFromName('trigger').length === 0) {

src/utils/shared.js

@@ -238,8 +238,8 @@ export const tasks = {
   'export-data': {
     name: 'Export data',
     icon: 'riDownloadLine',
-    component: 'BlockExportData',
-    editComponent: 'EditTrigger',
+    component: 'BlockBasic',
+    editComponent: 'EditExportData',
     category: 'general',
     inputs: 1,
     outputs: 1,
@@ -247,7 +247,10 @@ export const tasks = {
     maxConnection: 1,
     data: {
       name: '',
+      refKey: '',
       type: 'json',
+      description: '',
+      dataToExport: 'data-columns',
     },
   },
   'element-scroll': {
@@ -426,6 +429,7 @@ export const tasks = {
     allowedInputs: true,
     maxConnection: 1,
     data: {
+      description: '',
       spreadsheetId: '',
       type: 'get',
       range: '',