;; Events markets components

(defcomp ~events-markets-create-form (&key create-url csrf)
  (<>
    (div :id "market-create-errors" :class "mt-2 text-sm text-red-600")
    (form :class "mt-4 flex gap-2 items-end" :hx-post create-url
          :hx-target "#markets-list" :hx-select "#markets-list" :hx-swap "outerHTML"
          :hx-on::before-request "document.querySelector('#market-create-errors').textContent='';"
          :hx-on::response-error "document.querySelector('#market-create-errors').innerHTML = event.detail.xhr.responseText;"
      (input :type "hidden" :name "csrf_token" :value csrf)
      (div :class "flex-1"
        (label :class "block text-sm text-gray-600" "Name")
        (input :name "name" :type "text" :required true :class "w-full border rounded px-3 py-2"
               :placeholder "e.g. Farm Shop, Bakery"))
      (button :type "submit" :class "border rounded px-3 py-2" "Add market"))))

(defcomp ~events-markets-panel (&key form-html list-html)
  (section :class "p-4"
    (raw! form-html)
    (div :id "markets-list" :class "mt-6" (raw! list-html))))

(defcomp ~events-markets-empty ()
  (p :class "text-gray-500 mt-4" "No markets yet. Create one above."))

(defcomp ~events-markets-item (&key href market-name market-slug del-url csrf-hdr)
  (div :class "mt-6 border rounded-lg p-4"
    (div :class "flex items-center justify-between gap-3"
      (a :class "flex items-baseline gap-3" :href href
        (h3 :class "font-semibold" market-name)
        (h4 :class "text-gray-500" (str "/" market-slug "/")))
      (button :class "text-sm border rounded px-3 py-1 hover:bg-red-50 hover:border-red-400"
              :data-confirm true :data-confirm-title "Delete market?"
              :data-confirm-text "Products will be hidden (soft delete)"
              :data-confirm-icon "warning" :data-confirm-confirm-text "Yes, delete it"
              :data-confirm-cancel-text "Cancel" :data-confirm-event "confirmed"
              :hx-delete del-url :hx-trigger "confirmed"
              :hx-target "#markets-list" :hx-select "#markets-list" :hx-swap "outerHTML"
              :hx-headers csrf-hdr
        (i :class "fa-solid fa-trash")))))