https://cryptochallenges-5b6015357b45.herokuapp.com/assets/control…67a0d5ab16d401a664dbedd61c23918958f8aa10.js

1import { Controller } from "@hotwired/stimulus"
2
3export default class extends Controller {
4  static targets = ["input", "container", "tag", "hiddenContainer"]
5  static values = { fieldName: String }
6
7  connect() {
8    this.hiddenFieldName = this.hasFieldNameValue ? this.fieldNameValue :
9      (this.hiddenInputs[0]?.name || "trading_journal[tag_ids][]")
10    this.updateHiddenFields()
11  }
12
13  add(event) {
14    if (event.key === " " || event.key === "Enter") {
15      event.preventDefault()
16      const tagName = this.inputTarget.value.trim()
17      if (tagName && !this.tagTargets.some(tag => tag.textContent.trim().startsWith(tagName))) {
18        this.addTag(tagName)
19        this.inputTarget.value = ""
20        this.updateHiddenFields()
21      }
22    }
23  }
24
25  remove(event) {
26    const tagElement = event.target.closest("[data-tag-input-target='tag']")
27    const tagId = tagElement.dataset.tagId
28    if (tagId) {
29      const hiddenInput = this.hiddenInputs.find(input => input.value === tagId)
30      if (hiddenInput) hiddenInput.remove()
31    }
32    tagElement.remove()
33    this.updateHiddenFields()
34  }
35
36  addTag(name, id = "") {
37    const tagElement = document.createElement("span")
38    tagElement.classList.add("badge", "rounded-pill","bg-secondary", "text-primary", "me-1")
39    tagElement.dataset.tagInputTarget = "tag"
40    tagElement.dataset.tagId = id
41    tagElement.innerHTML = `${name}<span class="tag-close" data-action="click->tag-input#remove">×</span>`
42    this.containerTarget.insertBefore(tagElement, this.inputTarget)
43
44    // Ajouter un champ caché pour les nouveaux tags (nom uniquement) ou tags existants (ID)
45    this.addHiddenInput(id || name)
46  }
47
48  addHiddenInput(value) {
49    const hiddenInput = document.createElement("input")
50    hiddenInput.type = "hidden"
51    hiddenInput.name = this.hiddenFieldName
52    hiddenInput.value = value
53    this.hiddenContainerTarget.appendChild(hiddenInput)
54  }
55
56  updateHiddenFields() {
57    // Supprimer tous les champs cachés existants
58    this.hiddenContainerTarget.innerHTML = ""
59
60    // Recréer les champs cachés pour chaque tag
61    this.tagTargets.forEach(tag => {
62      const value = tag.dataset.tagId || tag.childNodes[0].textContent.trim()
63      this.addHiddenInput(value)
64    })
65
66  }
67
68  get hiddenInputs() {
69    return Array.from(this.hiddenContainerTarget.querySelectorAll("input"))
70  }
71};