(ns auto-ap.views.components.modal
  (:require [re-frame.core :as re-frame]
            [reagent.core :as r]
            [auto-ap.events :as events]
            [auto-ap.subs :as subs]
            [auto-ap.views.utils :refer [with-keys]]))

(defn modal [{:keys [title foot hide-event]} & body]
  [:div.modal.is-active
   [:div.modal-background {:on-click (fn [] (re-frame/dispatch hide-event ))}]
   
   [:div.modal-card
    [:header.modal-card-head
     [:p.modal-card-title
      title]
     [:button.delete {:on-click (fn [] (re-frame/dispatch hide-event))}]]
    (into [:section.modal-card-body]
          (r/children (r/current-component)))
    
    (when foot
      [:footer.modal-card-foot
       foot])]])

(defn action-modal [{:keys [title action-text id save-event]} & rest]
  (let [{:keys [visible? saving?]} @(re-frame/subscribe [::subs/modal-state id])]
    (when visible?
      (-> [modal {:title title
                    :foot [:a.button.is-primary {:on-click (fn []
                                                             (re-frame/dispatch [::events/modal-status id {:saving? true}])
                                                             (re-frame/dispatch save-event))
                                                 :class (when saving?
                                                          "is-loading")}
                           [:span action-text]]
                    :id id
                    :hide-event [::events/modal-status id {:visible? false}]}]
          (into (r/children (r/current-component)) )
          (into [(when saving? [:div.is-overlay {:style {"backgroundColor" "rgba(150,150,150, 0.5)"}}])])))))
