almost perfect user experience

This commit is contained in:
2023-10-21 13:04:42 -07:00
parent fc3634c6bd
commit 9ddbd31cc8
5 changed files with 45 additions and 30 deletions

View File

@@ -55,11 +55,6 @@
;; as to which one to generate.
;; TODO lots of escaping concerns (urls in javascript), all these weird name filters
;; TODO better generation of names?
(defn filters [request]
[:form {"hx-trigger" "change delay:500ms, keyup changed from:.hot-filter delay:1000ms"
"hx-get" (bidi/path-for ssr-routes/only-routes
@@ -411,7 +406,7 @@
;; TODO dialog is no longer closeable
(defn dialog* [& {:keys [entity form-params form-errors]}]
(com/modal
{:modal-class "max-w-4xl"}
{:modal-class "max-w-2xl"}
(com/modal-card
{}
[:div.flex [:div.p-2 "Transaction Rule"]]
@@ -516,14 +511,14 @@
:placeholder "Search..."
:url (bidi/path-for ssr-routes/only-routes :vendor-search)
:id (str "form-vendor-search")
:class "w-96"
:value (fc/field-value)
:value-fn (some-fn :db/id identity)
:content-fn (some-fn :vendor/name #(pull-attr (dc/db conn) :vendor/name %))})]))
(fc/with-field :transaction-rule/accounts
(list
(com/data-grid {:headers [(com/data-grid-header {}
"Account")
(com/data-grid {:headers [(com/data-grid-header {} "Account")
(com/data-grid-header {:class "w-32"} "Location")
(com/data-grid-header {:class "w-16"} "%")
(com/data-grid-header {:class "w-16"})]
@@ -531,24 +526,33 @@
(when @fc/*current*
(doall (for [tra fc/*current*]
(fc/with-cursor tra
(transaction-rule-account-row* entity tra))))))
(transaction-rule-account-row* entity tra)))))
(com/data-grid-row
{:class "new-row"}
(com/data-grid-cell {:colspan 4
:class "bg-gray-100"}
[:div.flex.justify-center
(com/a-button {:hx-get (bidi/path-for ssr-routes/only-routes
:admin-transaction-rule-new-account)
:color :secondary
:hx-include "#edit-form"
:hx-ext "rename-params"
:hx-rename-params-ex (cheshire/generate-string {"transaction-rule/client" "client-id"
"index" "index"})
:hx-vals (hiccup/raw "js:{index: countRows(\"#transaction-rule-account-table\")}")
:hx-target "#edit-form .new-row"
:hx-swap "beforebegin"}
"New account")])))
(com/errors {:errors (fc/field-errors)})))
(com/a-button {:hx-get (bidi/path-for ssr-routes/only-routes
:admin-transaction-rule-new-account)
:hx-include "#edit-form"
:hx-ext "rename-params"
:hx-rename-params-ex (cheshire/generate-string {"transaction-rule/client" "client-id"
"index" "index"})
:hx-vals (hiccup/raw "js:{index: countRows(\"#transaction-rule-account-table\")}")
:hx-target "#transaction-rule-account-table tbody"
:hx-swap "beforeend"}
"New account")
(fc/with-field :transaction-rule/transaction-approval-status
(com/validated-field {:label "Approval status"
:errors (fc/field-errors)}
(com/radio {:options (ref->radio-options "transaction-approval-status")
:value (fc/field-value)
:name (fc/field-name)
:size :small
:orientation :horizontal})))
[:div#form-errors (when (:errors fc/*form-errors*)
@@ -568,7 +572,7 @@
(let [index (or index 0) ;; TODO schema decode is not working
transaction-rule {:transaction-rule/client (dc/pull (dc/db conn) '[:client/name :client/locations :db/id]
client-id)
:transaction-rule/accounts (conj (into [] (repeat (inc index) {} ))
:transaction-rule/accounts (conj (into [] (repeat index {} ))
{:db/id (str (java.util.UUID/randomUUID))
:transaction-rule-account/location "Shared"})}]
(html-response
@@ -582,7 +586,6 @@
;; TODO check to see if it should be called "Shared" or "shared" for the value
;; TODO blank location is being allowed
;; TODO hydrate nested types more easily. make it easy to hydrate so you don't do weird sometimes pulls
;; TODO is it possible to make it easy to get a virtual cursor in the case of adding a new row? setting up
;; fake data doesn't feel right - maybe have a "prelude" that's dynamic

View File

@@ -98,13 +98,16 @@
(into [:div.htmx-indicator-hidden.inline-flex.gap-2.items-center.justify-center] children)])
(defn a-button- [params & children]
[:a (update params
:class #(cond-> %
true (str " focus:ring-4 font-bold rounded-lg text-xs p-3 text-center mr-2 inline-flex items-center hover:scale-105 transition duration-100 justify-center")
(= :secondary (:color params)) (str " text-white bg-blue-500 hover:bg-blue-600 focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700")
(= :primary (:color params)) (str " text-white bg-green-500 hover:bg-green-600 focus:ring-green-300 dark:bg-green-600 dark:hover:bg-green-700 ")
(nil? (:color params))
(str " bg-white dark:bg-gray-600 border-gray-300 dark:border-gray-700 text-gray-500 hover:text-gray-800 dark:text-gray-400 dark:hover:text-gray-100 font-medium border border-gray-300 dark:border-gray-700")))
[:a (-> params
(update :class #(cond-> %
true (str " focus:ring-4 font-bold rounded-lg text-xs p-3 text-center mr-2 inline-flex items-center hover:scale-105 transition duration-100 justify-center")
(= :secondary (:color params)) (str " text-white bg-blue-500 hover:bg-blue-600 focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700")
(= :primary (:color params)) (str " text-white bg-green-500 hover:bg-green-600 focus:ring-green-300 dark:bg-green-600 dark:hover:bg-green-700 ")
(nil? (:color params))
(str " bg-white dark:bg-gray-600 border-gray-300 dark:border-gray-700 text-gray-500 hover:text-gray-800 dark:text-gray-400 dark:hover:text-gray-100 font-medium border border-gray-300 dark:border-gray-700")
))
(assoc :tabindex 0)
(assoc :href (:href params "#")))
[:div.htmx-indicator.flex.items-center
(svg/spinner {:class "inline w-4 h-4 text-white"})
[:div.ml-3 "Loading..."]]

View File

@@ -4,7 +4,7 @@
(defn radio- [{:keys [options name title size orientation] :or {size :medium} selected-value :value}]
[:h3 {:class "mb-4 font-semibold text-gray-900 dark:text-white"} title]
[:ul {:class (cond-> "w-48 text-sm font-medium text-gray-900 bg-white border border-gray-200 rounded-lg dark:bg-gray-700 dark:border-gray-600 dark:text-white"
(= orientation :horizontal) (-> (hh/add-class "flex gap-8")
(= orientation :horizontal) (-> (hh/add-class "flex gap-2 flex-wrap")
(hh/remove-wildcard ["w-" "rounded-lg" "border" "bg-"])))}
(for [{:keys [value content]} options]
[:li {:class (cond-> "w-full border-b border-gray-200 rounded-t-lg dark:border-gray-600"

View File

@@ -78,7 +78,7 @@ input[type=number] {
"x-transition:leave-end" "!bg-opacity-0"}
[:div.flex.place-items-center.place-content-center.w-full.h-full.p-12
[:div {:class (str "w-full sm:max-w-4xl sm:rounded-lg overflow-scroll max-h-full sm:max-h-[90vh]")
[:div {:class (str "w-full sm:max-w-2xl sm:rounded-lg overflow-scroll max-h-full sm:max-h-[90vh]")
"@click.outside" "open=false"
"x-trap.inert.noscroll" "open"
"x-trap.inert" "open"