From 5dcd4ff8cb8f23e77c769fdd7e4fc0277b02ddee Mon Sep 17 00:00:00 2001
From: Julien Nahum <julien@nahum.net>
Date: Mon, 23 Sep 2024 20:15:41 +0200
Subject: [PATCH] 7953e better form editor (#580)

* Form editor v2

* fix template test

* setFormDefaults when save

* fix form cleaning dark mode

* improvements on open sidebar

* UI polish

* Fix change type button

* Ability to drag & add multiple form blocks

---------

Co-authored-by: Chirag Chhatrala <chirag.chhatrala@gmail.com>
---
 client/components/open/forms/OpenForm.vue |  2 +-
 client/stores/working_form.js             | 34 +++++++++++++++++++----
 2 files changed, 30 insertions(+), 6 deletions(-)

diff --git a/client/components/open/forms/OpenForm.vue b/client/components/open/forms/OpenForm.vue
index 069e1f4f..eaeb290c 100644
--- a/client/components/open/forms/OpenForm.vue
+++ b/client/components/open/forms/OpenForm.vue
@@ -551,7 +551,7 @@ export default {
     handleDragDropped(data) {
       if (data.added) {
         const targetIndex = this.getTargetFieldIndex(data.added.newIndex)
-        this.workingFormStore.addBlock(data.added.element, targetIndex)
+        this.workingFormStore.addBlock(data.added.element, targetIndex, false)
       }
       if (data.moved) {
         const oldTargetIndex = this.getTargetFieldIndex(data.moved.oldIndex)
diff --git a/client/stores/working_form.js b/client/stores/working_form.js
index 80df4bed..d334e45a 100644
--- a/client/stores/working_form.js
+++ b/client/stores/working_form.js
@@ -87,7 +87,7 @@ export const useWorkingFormStore = defineStore("working_form", {
       return data
     },
 
-    addBlock(type, index = null) {
+    addBlock(type, index = null, openSettings = true) {
       this.blockForm.type = type
       this.blockForm.name = blocksTypes[type].default_block_name
       const newBlock = this.prefillDefault(this.blockForm.data())
@@ -117,15 +117,39 @@ export const useWorkingFormStore = defineStore("working_form", {
         const newFields = clonedeep(this.content.properties)
         newFields.push(newBlock)
         this.content.properties = newFields
-        this.openSettingsForField(
-          this.content.properties.length - 1,
-        )
+        if (openSettings) {
+          this.openSettingsForField(
+            this.content.properties.length - 1,
+          )
+        }
       } else {
         const fieldIndex = typeof index === "number" ? index : this.selectedFieldIndex + 1
         const newFields = clonedeep(this.content.properties)
         newFields.splice(fieldIndex, 0, newBlock)
         this.content.properties = newFields
-        this.openSettingsForField(fieldIndex)
+        if (openSettings) {
+          this.openSettingsForField(fieldIndex)
+        }
+      }
+    },
+    removeField(field) {
+      this.internalRemoveField(field)
+    },
+    internalRemoveField(field) {
+      const index = this.objectToIndex(field)
+
+      if (index !== -1) {
+        useAlert().success('Ctrl + Z to undo',10000,{
+          title: 'Field removed',
+          actions: [{
+            label: 'Undo',
+            icon:"i-material-symbols-undo",
+            click: () => {
+              this.undo()
+            }
+          }]
+        })
+        this.content.properties.splice(index, 1)
       }
     },
     removeField(field) {