eminuxCRM/app/javascript/controllers/audience_preview_controller.js

import { Controller } from "@hotwired/stimulus"

export default class extends Controller {
  static targets = ["intent"]

  disconnect() {
    clearTimeout(this.refreshTimer)
  }

  refresh() {
    clearTimeout(this.refreshTimer)
    this.refreshTimer = setTimeout(() => this.submitPreview(), 250)
  }

  apply() {
    clearTimeout(this.refreshTimer)
    this.persistOpenSections()
    this.setIntent("apply")
  }

  submitPreview() {
    this.persistOpenSections()
    this.setIntent("preview")
    this.element.requestSubmit()
  }

  persistOpenSections() {
    this.element.querySelectorAll("input[data-open-section]").forEach((input) => input.remove())
    this.element.querySelectorAll("details[data-section]").forEach((details) => {
      if (!details.open) return

      const input = document.createElement("input")
      input.type = "hidden"
      input.name = "open_sections[]"
      input.value = details.dataset.section
      input.setAttribute("data-open-section", "")
      this.element.appendChild(input)
    })
  }

  setIntent(value) {
    if (this.hasIntentTarget) this.intentTarget.value = value
  }
}