reset values on deleting me fields

app/javascript/template_builder/area.vue

@@ -93,7 +93,7 @@
         v-else-if="editable"
         class="pr-1"
         title="Remove"
-        @click.prevent="$emit('remove')"
+        @click.prevent="removeField"
       >
         <IconX width="14" />
       </button>
@@ -589,6 +589,34 @@ export default {
       this.makeMySignature(attachment.uuid)
       this.save()
     },
+    removeField () {
+      switch (this.field.type) {
+        case 'my_signature':
+          this.showMySignature = false
+          this.myLocalSignatureValue = ''
+          console.log('switch signature portion')
+          break
+
+        case 'my_initials':
+          this.showMyInitials = false
+          this.myLocalInitialsValue = ''
+          console.log('switch initials portion')
+          break
+
+        case 'my_date':
+          this.showMyDate = false
+          this.myLocalDateValue = ''
+          console.log('switch my_date portion')
+          break
+
+        case 'my_text':
+          this.myLocalText = ''
+          break
+        default:
+          console.log('switch default portion')
+      }
+      this.$emit('remove')
+    },
     onNameFocus (e) {
       this.selectedAreaRef.value = this.area
 

app/javascript/template_builder/builder.vue

@@ -402,6 +402,13 @@ export default {
       return this.template.schema.map((item) => {
         return this.template.documents.find(doc => doc.uuid === item.attachment_uuid)
       })
+    },
+    myAttachmentsIndex () {
+      return this.templateAttachments.reduce((acc, a) => {
+        acc[a.uuid] = a
+
+        return acc
+      }, {})
     }
   },
   created () {
@@ -535,6 +542,14 @@ export default {
     removeArea (area) {
       const field = this.template.fields.find((f) => f.areas?.includes(area))
 
+      if (['my_text', 'my_signature', 'my_initials', 'my_date'].includes(field.type)) {
+        const myAttachmentsIndex = this.myAttachmentsIndex[this.template.values[field.uuid]]
+        if (['my_signature', 'my_initials'].includes(field.type)) {
+          this.templateAttachments.splice(this.templateAttachments.indexOf(myAttachmentsIndex), 1)
+        }
+        this.template.values.splice(this.template.values.indexOf(field.uuid), 1)
+      }
+
       field.areas.splice(field.areas.indexOf(area), 1)
 
       if (!field.areas.length) {

app/views/submissions/_value.html.erb

@@ -30,7 +30,6 @@
         <% end %>
       <% end %>
     </div>
-  <% elsif field['type'] == 'date' %>
   <% elsif ['data', 'my_date'].include?(field['type']) %>
     <div class="flex items-center px-0.5">
       <%= l(Date.parse(value), format: :long, locale: local_assigns[:locale]) %>