import { Controller } from "@hotwired/stimulus"

export default class extends Controller {
  static targets = [ "button", "switch", "checkbox" ]
  static values = { switchEnabled: Boolean }

  connect () {
    this.buttonTarget.classList.remove("hidden")
    this.checkboxTarget.classList.add("hidden")
  }

  toggleSwitch () {
    this.switchEnabledValue = !this.switchEnabledValue
    this.checkboxTarget.checked = this.switchEnabledValue

    if (this.switchEnabledValue) {
      this.buttonTarget.setAttribute("aria-checked", "true");
      this.buttonTarget.classList.remove("bg-gray-200")
      this.buttonTarget.classList.add("bg-blue-600")
      this.switchTarget.classList.remove("translate-x-0")
      this.switchTarget.classList.add("translate-x-5")
    } else {
      this.buttonTarget.setAttribute("aria-checked", "false");
      this.buttonTarget.classList.remove("bg-blue-600")
      this.buttonTarget.classList.add("bg-gray-200")
      this.switchTarget.classList.remove("translate-x-5")
      this.switchTarget.classList.add("translate-x-0")
    }
  }
}