(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 can-submit?] :or {can-submit? true}} & rest]
  (let [{:keys [visible? saving? error-message]} @(re-frame/subscribe [::subs/modal-state id])]
    (when visible?
      (-> [modal {:title [:span title
                          ]
                  :foot [:input.button.is-primary {:type "submit"
                                                   :tab-index "0"
                                                   :form id
                                                   :disabled (cond saving?
                                                                   "disabled"

                                                                   (not can-submit?)
                                                                   "disabled"

                                                                   :else
                                                                   "")
                                                   :class (when saving?
                                                            "is-loading")
                                                   :value action-text}
                           ]
                    :id id
                  :hide-event [::events/modal-status id {:visible? false}]}
           (into [:form {:id id
                         :on-submit (fn [e]
                                      (.preventDefault e)
                                      (re-frame/dispatch [::events/modal-status id {:saving? true :error-message nil}])
                                      (re-frame/dispatch save-event))}
                  (when error-message
                    [:div.notification.is-warning error-message])]

                 (r/children (r/current-component)) )]
          (into [(when saving? [:div.is-overlay {:style {"backgroundColor" "rgba(150,150,150, 0.5)"}}])])))))