https://socialsuite.ai/assets/controllers/add_form_element_control…243e94b17f77a54a5fcaec4b42d2c9b0c384e34e.js

1import { Controller } from "@hotwired/stimulus"
2
3export default class extends Controller {
4  static targets = ["field", "form", "fieldToClear"]
5  
6  duplicateFormField() {
7    let fieldPrime = this.fieldTarget.cloneNode(true);
8    if (this.hasFieldToClearTarget) {
9      this.fieldToClearTargets.forEach(element => {
10        let targetElement = fieldPrime.querySelector(`input[name="${element.name}"]`);
11        if (targetElement) targetElement.value = '';
12      });
13    } else {
14      fieldPrime.value = ""
15    }
16    this.formTarget.appendChild(fieldPrime);
17  }
18
19  addAgendaItem() {
20    const template = this.fieldTargets.slice(-1)[0].cloneNode(true);
21    const form = this.formTarget;
22
23    template.querySelectorAll("[data-add-form-element-target='fieldToClear']").forEach((field) => {
24      field.value = "";
25    });
26
27    let inputElements = template.querySelectorAll('input');
28    inputElements.forEach((inputElement) => {
29      inputElement.setAttribute('name', inputElement.getAttribute('name').replace(/\[(\d+)\]/, (_, p1) => {
30        return '[' + (parseInt(p1, 10) + 1) + ']';
31      }));
32  
33      inputElement.setAttribute('id', inputElement.getAttribute('id').replace(/_(\d+)_/, (_, p1) => {
34        return '_' + (parseInt(p1, 10) + 1) + '_';
35      }));
36    });
37
38    let destroyIcon = template.querySelector("a[class='destroy text-zinc-900']");
39    destroyIcon.setAttribute("href", "#");
40    destroyIcon.setAttribute("data-action", "add-form-element#removeAgendaItem");
41    destroyIcon.setAttribute("data-test", "agenda-item-delete-button");
42    destroyIcon.removeAttribute("data-turbo-method");
43    template.removeAttribute("id");
44    template.classList.remove("hidden");
45
46    form.appendChild(template);
47  }
48
49  removeAgendaItem(event) {
50    event.preventDefault();
51    event.target.closest(".edit-agenda-item").remove();
52  }
53
54  addIncident() {
55    const lastId = document.getElementsByTagName("fieldset").length - 1;
56    const newId = parseInt(lastId, 10) + 1;
57    let newFieldset = document.querySelector("[id='0']").cloneNode(true)
58    
59    newFieldset.getElementsByClassName("description")[0].innerHTML = '';
60    newFieldset.id = newId;
61    this.resetIncidentForm(newFieldset.getElementsByTagName("select"), newId);
62    this.resetIncidentForm(newFieldset.getElementsByTagName("textarea"), newId);
63    this.resetIncidentForm(newFieldset.getElementsByTagName("input"), newId);
64    
65    document.querySelector("#fieldsetContainer").insertAdjacentHTML(
66        "beforeend", newFieldset.outerHTML
67    );
68  }
69
70  resetIncidentForm(collection, newId) {
71    for (let tag of collection) {
72      let options = tag.getElementsByTagName("option");
73      console.log(options.length > 0);
74      if (options.length > 0) {
75        for (let option of options) {
76          option.removeAttribute("selected");
77        }
78        options[0].setAttribute("selected", "selected");
79      }
80      tag.removeAttribute("value");
81      tag.name = tag.name.replace(/0/g, newId);
82      tag.id = tag.id.replace(/0/g, newId);
83    }
84  }
85};