fix all custom forms emptied when deleting one

src/components/feature_type/FeatureTypeCustomForm.vue

@@ -353,10 +353,6 @@ export default {
     },
   },
 
-  beforeDestroy() {
-    this.$store.commit("feature_type/EMPTY_CUSTOM_FORMS");
-  },
-
   mounted() {
     //* add datas from store to state to avoid mutating directly store with v-model (not good practice), could have used computed with getter and setter as well
     this.fillCustomFormData(this.customForm);

src/views/feature_type/Feature_type_edit.vue

@@ -338,6 +338,41 @@ export default {
       this.form.colors_style.value.colors[name] = value;
     },
 
+    updateColorsStyle(newOptions) {
+      const optionNames = Object.keys(this.form.colors_style.value.colors);
+      //* if new value added
+      if (newOptions.length > optionNames.length) {
+        for (const key of newOptions) {
+          if (key && !optionNames.includes(key)) {
+            //* check if key is not en empty string
+            this.form.colors_style.value.colors[key] = "#000000"; //* add new entry
+          }
+        }
+        //* if modified or deleted
+      } else {
+        let modifiedColorStyle = {};
+        for (const [index, key] of newOptions.entries()) {
+          //* if no key then item will disappear (deleted)
+          if (key) {
+            const values = Object.values(this.form.colors_style.value.colors);
+            modifiedColorStyle[key] = values[index]; //* overide key and get previous value from previous colors style
+          }
+        }
+        this.form.colors_style.value.colors = modifiedColorStyle;
+      }
+    },
+
+    updateColorsStyleInput(newValue) {
+      const newColorsStyle = {
+        colors: newValue.options.reduce((obj, key) => {
+          obj[key] = "#000000";
+          return obj;
+        }, {}),
+        custom_field_name: newValue.value,
+      };
+      this.form.colors_style.value = newColorsStyle;
+    },
+
     updateStore() {
       this.$store.commit("feature_type/UPDATE_FORM", {
         color: this.form.color,
@@ -543,6 +578,7 @@ export default {
   },
   beforeDestroy() {
     this.$store.commit("feature_type/EMPTY_FORM");
+    this.$store.commit("feature_type/EMPTY_CUSTOM_FORMS");
   },
 };
 </script>