notid/integreat
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

One modal to rule them all.

Browse Source
This commit is contained in:
Bryce Covert
2020-09-05 08:18:29 -07:00
parent 4847917e6b
commit 74e34e3592
10 changed files with 106 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/cljs/auto_ap/views/components/modal.cljs
View File

@@ -6,35 +6,6 @@
[auto-ap.status :as status]
[auto-ap.views.utils :refer [with-keys appearing dispatch-event]]))
(defn modal [{:keys [title foot hide-event class]} & body]
[:div.modal.is-active (cond-> {}
class (assoc :class class))
[: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 [e] (.preventDefault e) (re-frame/dispatch hide-event))}]]
(into [:section.modal-card-body]
(r/children (r/current-component)))
(when foot
[:footer.modal-card-foot
foot])]])
(defn simple-modal [{:keys [title foot class warning action-text id save-event can-submit? status-from] :or {can-submit? true}} & rest]
(let [{:keys [visible? saving? error-message]} @(re-frame/subscribe [::subs/modal-state id status-from])]
(when visible?
(-> [modal {:title [:span title]
:class class
:foot foot
:id id
:hide-event [::events/modal-status id {:visible? false :error-message nil}]}]
(into (r/children (r/current-component)))
(into [(when saving? [:div.is-overlay {:style {"backgroundColor" "rgba(150,150,150, 0.5)"}}])])))))
(re-frame/reg-sub
::modal-state
(fn [db]
@@ -57,7 +28,7 @@
(let [state (re-frame/subscribe [::modal-state])]
(fn []
(if (:visible? @state)
(let [{:keys [title body foot class cancel? confirm]} @state]
(let [{:keys [title body status-from foot class cancel? confirm]} @state]
[:div.modal.is-active (cond-> {}
class (assoc :class class))
[:div.modal-background {:on-click (dispatch-event [::modal-closed])}]
@@ -69,7 +40,8 @@
[:button.delete {:on-click (dispatch-event [::modal-closed])}]]
[:section.modal-card-body
body]
(let [status (some-> confirm :status-from re-frame/subscribe deref )
(let [status (or (some-> confirm :status-from re-frame/subscribe deref )
(some-> status-from re-frame/subscribe deref ))
can-submit (if-let [can-submit (-> confirm :can-submit)]
@(re-frame/subscribe can-submit)
true)]
@@ -79,7 +51,7 @@
:timeout 200
:enter-class "appear"
:exit-class "disappear"}
[:div.notification.is-warning (:message (first (:error status)))]]
[:div.has-text-danger {:style {:flex-basis "100%"}} (:message (first (:error status)))] ]
foot]
[:footer.modal-card-foot
[:div
@@ -87,7 +59,7 @@
:timeout 200
:enter-class "appear"
:exit-class "disappear"}
[:div.has-text-danger (:message (first (:error status)))]]
[:div.has-text-danger {:style {:flex-basis "100%"}} (:message (first (:error status)))]]
[:div.buttons
(when confirm