fixes

src/clj/auto_ap/ssr/admin/transaction_rules.clj

@@ -371,7 +371,9 @@
                   (map first))]
     
     (html-response
-      (com/modal-card  {:class "fade-in transition duration-300"}
+      (com/stacked-modal-card  
+                               1
+                               {}
                        [:div.p-2.flex.space-x-4 [:div "Transaction Rule"] [:div ">"] [:div "Results"] [:div.ml-4.relative (com/badge {} (count results))]]
                        (com/data-grid
                          {:headers [(com/data-grid-header {} "Client")
@@ -385,21 +387,23 @@
                              (com/data-grid-cell {} (-> r :transaction/bank-account :bank-account/name))
                              (com/data-grid-cell {} (some-> r :transaction/date (atime/unparse-local atime/normal-date)))
                              (com/data-grid-cell {} (some-> r :transaction/description-original )))))
-                       [:div
+                       [:div.flex.justify-between
+                        
+                        (com/button {"@click" "$dispatch('modalpop')"
+                                     :class "w-32"}
+                                    "Back")
                         (com/button (cond-> {:color :primary
                                              :hx-vals (hx/json (:raw-form-params request))
+                                             :class "w-32"
                                              }
                                       (:db/id form-params)       (assoc :hx-put  (bidi/path-for ssr-routes/only-routes :admin-transaction-rule-save))
                                       (not (:db/id form-params)) (assoc :hx-post  (bidi/path-for ssr-routes/only-routes :admin-transaction-rule-save)))
-                                    "Save")
+                                    "Save rule")
-                        (com/button {:hx-vals (hx/json (:raw-form-params request))
-                                     :hx-put (bidi/path-for ssr-routes/only-routes
-                                                            :admin-transaction-rule-filled-account
-                                                            )} "Back")
                         ])
       :headers (-> {}
-                   (assoc "hx-retarget" ".modal-card")
+                   (assoc "hx-trigger-after-settle" "modalnext")
-                   (assoc "hx-reswap" "outerHTML")))))
+                   (assoc "hx-retarget" ".modal-stack")
+                   (assoc "hx-reswap" "beforeend")))))
 
 
 
@@ -500,16 +504,16 @@
       {:modal-class "max-w-2xl"
        :hx-target   "this"}
 
-      [:form {:hx-ext        "response-targets"
+      (com/stacked-modal-card
+        0
+        {}
+        [:div.flex [:div.p-2 "Transaction Rule"]]
+        [:form#my-form {:hx-ext        "response-targets"
                 :hx-target-400 "#form-errors .error-content"
                 :x-trap        "true"
-              :class         "w-full h-full"
                 (if (:db/id entity)
                   :hx-put
                   :hx-post)    (str (bidi/path-for ssr-routes/only-routes :admin-transaction-rule-edit-save))}
-       (com/modal-card
-         {}
-         [:div.flex [:div.p-2 "Transaction Rule"]]
          [:fieldset {:class  "hx-disable"
                      :x-data (hx/json {:clientId (or (:db/id (:transaction-rule/client form-params))
                                                      (:transaction-rule/client form-params)
@@ -656,14 +660,18 @@
                                               :size        :small
                                               :orientation :horizontal})))
 
-           ]]
+           ]]]
         [:div
          (com/form-errors {:errors (:errors fc/*form-errors*)})
-          (com/validated-save-button {:errors form-errors} "Save rule")
+         [:div.flex.justify-end 
-          (com/validated-save-button {:errors  form-errors :color :secondary
-                                      :hx-post (bidi/path-for ssr-routes/only-routes :admin-transaction-rule-test)}
           
-                                     "Test rule")])])))
+          (com/validated-save-button {:errors     form-errors :color :secondary
+                                      :hx-post    (bidi/path-for ssr-routes/only-routes :admin-transaction-rule-test)
+                                      :hx-include "#my-form"}
+
+                                     "Test rule")
+          (com/validated-save-button {:errors form-errors
+                                      :form   "my-form"} "Save rule")]]))))
 
 
 (defn new-account [{{:keys [client-id index]} :query-params}]
@@ -716,7 +724,6 @@
                                   [:transaction-rule-account/percentage percentage])]]))
 
 (defn transaction-dialog [{:keys [entity form-params form-errors]}]
-  (clojure.pprint/pprint form-params)
   (modal-response (dialog* {:entity      entity
                            :form-params (or (when (seq form-params)
                                               form-params)

src/clj/auto_ap/ssr/components.clj

@@ -24,6 +24,7 @@
 (def button-group-button buttons/group-button-)
 (def modal dialog/modal-)
 (def modal-card dialog/modal-card-)
+(def stacked-modal-card dialog/stacked-modal-card-)
 
 (def text-input inputs/text-input-)
 (def money-input inputs/money-input-)

src/clj/auto_ap/ssr/components/dialog.clj

@@ -1,11 +1,34 @@
 (ns auto-ap.ssr.components.dialog
   (:require
-   [auto-ap.ssr.hiccup-helper :as hh]))
+   [auto-ap.ssr.hiccup-helper :as hh]
+   [auto-ap.ssr.hx :as hx]))
 
 (defn modal- [params & children]
   [:div (-> params
-            (assoc "@click.outside" "open=false")
+            (assoc "@click.outside" "open=false"
-            (update :class (fnil hh/add-class "") "w-full h-full"))
+                   :x-data (hx/json {:index 0  :hidingIndex -1})
+                   :x-ref  "modalStack"
+                   "@modalnext"
+                   "$refs.modalStack.children[index].setAttribute('x-transition:leave-end', '-translate-x-full scale-0 opacity-0' );
+                    $refs.modalStack.children[index + 1].setAttribute('x-transition:enter-start', 'translate-x-full scale-0 opacity-0' );
+                    hidingIndex = index;
+                    setTimeout(() => {index ++; hidingIndex = -1 }, 150)"
+
+                   "@modalprevious"
+                   "$refs.modalStack.children[index].setAttribute('x-transition:leave-end', 'translate-x-full scale-0 opacity-0' );
+                    $refs.modalStack.children[index - 1].setAttribute('x-transition:enter-start', '-translate-x-full scale-0 opacity-0' );
+                    hidingIndex = index;
+                    setTimeout(() => { index --; hidingIndex = -1; }, 150)"
+
+                   "@modalpop"
+                   "$refs.modalStack.children[index].setAttribute('x-transition:leave-end', 'translate-x-full scale-0 opacity-0' );
+                    $refs.modalStack.children[index - 1].setAttribute('x-transition:enter-start', '-translate-x-full scale-0 opacity-0' );
+                    hidingIndex = index;
+                    setTimeout(() => index --, 150)
+                    setTimeout(() => { $refs.modalStack.removeChild($refs.modalStack.children[index+1]); hidingIndex=-1; }, 300)
+                                      "
+                   )
+            (update :class (fnil hh/add-class "") "w-full h-full modal-stack"))
    children])
 
 (defn modal-card- [params header content footer]
@@ -22,3 +45,19 @@
      content]
     (when footer [:div {:class "p-4 shrink-0"} footer])]])
 
+
+(defn stacked-modal-card- [index params header content footer]
+  [:div (merge params
+               {:class                     "bg-white rounded-lg shadow dark:bg-gray-700 dark:text-white  modal-content  flex flex-col"
+                :x-data                    (hx/json {:i index})
+                :x-show                    "index == i && hidingIndex != i"
+                "x-transition:enter"       "transition  duration-150",
+                "x-transition:enter-end"   "translate-x-0 scale-100 opacity-100",
+                "x-transition:leave"       "transition duration-150",
+                "x-transition:leave-start" "translate-x-0 scale-100 opacity-100",
+                })
+   [:div {:class "flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600 shrink-0"} header]
+   [:div {:class "px-6 space-y-6 overflow-y-scroll w-full shrink"}
+    
+    content]
+   (when footer [:div {:class "p-4 shrink-0"} footer])])

src/clj/auto_ap/ssr/ui.clj

@@ -2,7 +2,8 @@
   (:require
    [auto-ap.ssr.hx :as hx]
    [config.core :refer [env]]
-   [hiccup2.core :as hiccup]))
+   [hiccup2.core :as hiccup]
+   [auto-ap.ssr.components :as com]))
 
 (defn html-page [hiccup]
   {:status  200
@@ -13,6 +14,9 @@
                    {}
                    hiccup))})
 
+
+
+
 (defn base-page [request contents page-name]
   (html-page
    [:html.has-navbar-fixed-top
@@ -68,6 +72,7 @@ input[type=number] {
      contents
      [:script {:src "/js/flowbite.min.js"}]
      
+
      [:div#modal-holder
       {:tabindex   "-1", :class "fixed top-0 left-0 z-[99] flex items-center justify-center w-screen h-screen"
        "x-show" "open"
@@ -97,7 +102,10 @@ input[type=number] {
                             "x-transition:leave"       "duration-300"
                             "x-transition:leave-start" "!opacity-100 !translate-y-0"
                             "x-transition:leave-end"   "!opacity-0 !translate-y-32"}
+
         [:div.flex.items-center.justify-center.max-w-6xl {:class "min-w-[700px] max-h-full "}
+         
          [:div#modal-content.flex.flex-col.self-stretch {:class "min-w-[700px] md:p-12"} ;;.overflow-scroll
+          
           ]
          ]]]]]]))

src/clj/auto_ap/ssr/users.clj

@@ -85,8 +85,9 @@
                                  :url         (bidi/path-for ssr-routes/only-routes
                                                              :company-search)
                                  :id          (str "client-search")
-                                 :value       [(:db/id (:client (:parsed-query-params request)))
+                               :value       (:client (:parsed-query-params request))
-                                               (:client/name (:client (:parsed-query-params request)))]}))]])
+                               :value-fn :db/id
+                               :content-fn :client/name}))]])
 
 (def default-read '[:db/id
                     :user/name