fix: unnecessary quote in http request block (#695)

src/components/newtab/workflow/WorkflowDetailsCard.vue

@@ -87,15 +87,33 @@
             $event.dataTransfer.setData('block', JSON.stringify(block))
           "
         >
-          <a
-            :href="`https://docs.automa.site/blocks/${block.id}.html`"
-            :title="t('common.docs')"
-            target="_blank"
-            rel="noopener"
-            class="absolute top-px right-2 top-2 text-gray-600 dark:text-gray-300 invisible group-hover:visible"
+          <div
+            class="flex items-center absolute right-2 invisible group-hover:visible top-2"
           >
-            <v-remixicon name="riInformationLine" size="18" />
-          </a>
+            <a
+              :href="`https://docs.automa.site/blocks/${block.id}.html`"
+              :title="t('common.docs')"
+              target="_blank"
+              rel="noopener"
+              class="text-gray-600 dark:text-gray-300"
+            >
+              <v-remixicon name="riInformationLine" size="18" />
+            </a>
+            <span
+              title="Pin block"
+              class="cursor-pointer ml-1"
+              @click="pinBlock(block)"
+            >
+              <v-remixicon
+                size="18"
+                :name="
+                  pinnedBlocks.includes(block.id)
+                    ? 'riPushpin2Fill'
+                    : 'riPushpin2Line'
+                "
+              />
+            </span>
+          </div>
           <v-remixicon :name="block.icon" size="24" class="mb-2" />
           <p class="leading-tight text-overflow capitalize">
             {{ block.name }}
@@ -106,8 +124,9 @@
   </div>
 </template>
 <script setup>
-import { computed, ref } from 'vue';
+import { computed, ref, onMounted } from 'vue';
 import { useI18n } from 'vue-i18n';
+import browser from 'webextension-polyfill';
 import { useShortcut } from '@/composable/shortcut';
 import { tasks, categories } from '@/utils/shared';
 
@@ -159,6 +178,7 @@ const categoriesExpand = Object.keys(categories).reduce((acc, key) => {
 const descriptionCollapsed = ref(true);
 
 const query = ref('');
+const pinnedBlocks = ref([]);
 const expandList = ref(categoriesExpand);
 
 const blocks = computed(() =>
@@ -193,4 +213,16 @@ function getBlockTitle({ description, id }) {
 
   return blockDescription;
 }
+function pinBlock({ id }) {
+  const index = pinnedBlocks.value.indexOf(id);
+
+  if (index !== -1) pinnedBlocks.value.splice(index, 1);
+  else pinnedBlocks.value.push(id);
+}
+
+onMounted(() => {
+  browser.storage.local.get('pinnedBlocks').then((item) => {
+    pinnedBlocks.value = item.pinnedBlocks || [];
+  });
+});
 </script>

src/lib/vRemixicon.js

@@ -81,6 +81,8 @@ import {
   riFileTextLine,
   riSubtractLine,
   riBracketsLine,
+  riPushpin2Line,
+  riPushpin2Fill,
   riDownloadLine,
   riFileListLine,
   riDragDropLine,
@@ -207,6 +209,8 @@ export const icons = {
   riFileTextLine,
   riSubtractLine,
   riBracketsLine,
+  riPushpin2Line,
+  riPushpin2Fill,
   riDownloadLine,
   riFileListLine,
   riDragDropLine,

src/stores/workflow.js

@@ -202,8 +202,10 @@ export const useWorkflowStore = defineStore('workflow', {
           }
 
           if (insert) {
-            Object.assign(this.workflows[item.id], item);
-            insertedData[item.id] = this.workflows[item.id];
+            const mergedData = deepmerge(this.workflows[item.id], item);
+
+            this.workflows[item.id] = mergedData;
+            insertedData[item.id] = mergedData;
           }
         } else {
           const workflow = defaultWorkflow(item);

src/utils/referenceData/index.js

@@ -6,7 +6,6 @@ export default function ({ block, refKeys, data }) {
   if (!refKeys || refKeys.length === 0) return block;
 
   const copyBlock = cloneDeep(block);
-  const options = { stringify: block.label === 'webhook' };
   const addReplacedValue = (value) => {
     if (!copyBlock.replacedValue) copyBlock.replacedValue = {};
 
@@ -14,6 +13,9 @@ export default function ({ block, refKeys, data }) {
   };
 
   refKeys.forEach((blockDataKey) => {
+    const options = {
+      stringify: block.label === 'webhook' && blockDataKey === 'body',
+    };
     const currentData = objectPath.get(copyBlock.data, blockDataKey);
 
     if (!currentData) return;