Makes company search work much more like the react one.

This commit is contained in:
2023-01-23 09:00:27 -08:00
parent 14b10963b8
commit 475a21530d
4 changed files with 107 additions and 42 deletions

View File

@@ -3,6 +3,7 @@
[auto-ap.datomic :refer [conn]]
[auto-ap.graphql.utils :refer [assert-can-see-client can-see-client?]]
[auto-ap.ssr-routes :as ssr-routes]
[auto-ap.ssr.components.navbar-dropdown :refer [navbar-dropdown]]
[auto-ap.ssr.utils :refer [html-response]]
[bidi.bidi :as bidi]
[datomic.api :as d]
@@ -20,13 +21,20 @@
"value" v})))]
(html-response
[:div.navbar-dropdown {:style {:width "20em"}}
[:div.navbar-item "All"]
[:a.navbar-item {:hx-put (bidi/path-for ssr-routes/only-routes
:active-client
:request-method :put)
:hx-target "#company-dropdown"
:hx-swap "outerHTML"
:hx-trigger "click"}
"All"]
[:hr.navbar-divider]
[:input#company-search.input.navbar-item {:placeholder "Company name"
:name "search"
:autoFocus true} ]
[:input#company-search.input.navbar-item {:placeholder "Company name"
:name "search-text"
:autoFocus true} ]
[:input#company-search-value {:type "hidden"
:name "search"
:autocomplete "off"
:name "search-client"
:hx-put (bidi/path-for ssr-routes/only-routes
:active-client
:request-method :put)
@@ -66,41 +74,59 @@ document.getElementById(\"company-search-value\").dispatchEvent(new Event('chang
});
"))]])))
(defn dropdown [request]
(let [client (get-in request [:session :client])]
[:div#company-dropdown.navbar-item.has-dropdown {:tabIndex 0 "_" (hiccup/raw
"on click elsewhere
remove .is-active from <#company-dropdown />
end "
)} ;; remove .is-active from <#company-dropdown />
[:a.navbar-link {:hx-get
(bidi/path-for ssr-routes/only-routes
:company-dropdown-contents)
:hx-target "#company-dropdown .navbar-dropdown"
:hx-swap "outerHTML"
"_" (hiccup/raw
"on click
#_{:hx-get
(bidi/path-for ssr-routes/only-routes
:company-dropdown-contents)
:hx-target "#company-dropdown .navbar-dropdown"
:hx-swap "outerHTML"
"_" (hiccup/raw
"on click
toggle .is-active on <#company-dropdown />
end
")
}
}
(defn dropdown [request]
(let [client (get-in request [:session :client])]
(navbar-dropdown
"company-dropdown"
(if client
(str "Company: " (:client/name client))
"Company")
[:div.navbar-dropdown]]
[:div {:hx-get
(bidi/path-for ssr-routes/only-routes
:company-dropdown-contents)
:hx-swap "outerHTML"
:hx-trigger "intersect delay:150ms"
:hx-target "closest .navbar-dropdown"
:style {:width "20em"
:height "80px"}
}
[:div.loader.is-loading.is-active.is-centered]]
)
#_[:div#company-dropdown.navbar-item.has-dropdown
{"_" (hiccup/raw
"on click elsewhere
remove .is-active from <#company-dropdown />
end "
)} ;; remove .is-active from <#company-dropdown />
[:div.navbar-dropdown]
]))
;; TODO PERMS
(defn active-client [{:keys [identity params] :as request}]
(auto-ap.logging/info ::searched
:params params)
(assert-can-see-client identity (Long/parseLong (or (:search params) (get params "search"))))
(let [new-session (assoc (:session request) :client
(d/pull (d/db conn) [:db/id :client/name :client/code] (Long/parseLong (or (:search params) (get params "search")))))]
(assoc
(html-response
(dropdown (assoc request :session new-session)))
:session
new-session
:headers
{"hx-trigger" "clientSelected"})))
(clojure.pprint/pprint params)
(let [client-id (some-> (or (:search-client params) (get params "search-client")) Long/parseLong)]
(when client-id
(assert-can-see-client identity client-id))
(let [new-session (assoc (:session request) :client
(when client-id
(d/pull (d/db conn) [:db/id :client/name :client/code] client-id)))]
(assoc
(html-response
(dropdown (assoc request :session new-session)))
:session
new-session
:headers
{"hx-trigger" "clientSelected"}))))

View File

@@ -0,0 +1,14 @@
(ns auto-ap.ssr.components.navbar-dropdown
(:require [hiccup2.core :as hiccup]))
(defn navbar-dropdown [id header children]
[:div {
:id id
:class (str "navbar-item has-dropdown")
"_" (hiccup/raw "on click elsewhere remove .is-active from me")
}
[:a {:class "navbar-link login"
"_" (hiccup/raw "on click toggle .is-active on the parentElement of me then add .appear to next <.navbar-dropdown />")} header]
(into [:div {:class "navbar-dropdown"}
children])])

View File

@@ -0,0 +1,22 @@
(ns auto-ap.ssr.login-dropdown
(:require
[auto-ap.client-routes :as client-routes]
[auto-ap.ssr.components.navbar-dropdown :refer [navbar-dropdown]]
[bidi.bidi :as bidi]))
(defn dropdown [{:keys [identity]}]
(if identity
(navbar-dropdown
"login-dropdown"
[:span [:span.icon [:i.fa.fa-user] ]
[:span (:user/name identity)]]
[:div
[:a {:class "navbar-item"
:href (bidi/path-for client-routes/routes :reports)} "My company"]
#_[:a.dropdown-item {:on-click (dispatch-event-with-propagation [:vendor-dialog/started {}])} "New Vendor"] ;; double colorn
#_[:a.dropdown-item {:on-click (dispatch-event-with-propagation [:vendor-dialog/edit {}])} "Edit Vendor"]
(when (= "admin" (:user/role identity))
[:a {:class "navbar-item" :href (bidi/path-for client-routes/routes :admin)} "Administration"])
#_[:hr {:class "navbar-divider"}]
#_[:a.navbar-item {:on-click (fn [e] (.preventDefault e) (re-frame/dispatch [:events/logout]))} "Logout"]])
[:a.navbar-item {:href (bidi/path-for client-routes/routes :login )} "Login"]))

View File

@@ -3,7 +3,8 @@
[auto-ap.logging :as alog]
[auto-ap.ssr.company-dropdown :as company-dropdown]
[config.core :refer [env]]
[hiccup2.core :as hiccup]))
[hiccup2.core :as hiccup]
[auto-ap.ssr.login-dropdown :as login-dropdown]))
(defn html-page [hiccup]
{:status 200
@@ -53,17 +54,19 @@
[:div.navbar-start
[:a.navbar-item {:href "/"}
"Home" ]
[:a.navbar-item {:href "/invoices/"}
[:a.navbar-item {:href "/invoices"}
"Invoices" ]
[:a.navbar-item {:href "/payments/"}
[:a.navbar-item {:href "/payments"}
"Payments" ]
[:a.navbar-item {:href "/pos/sales-orders/"}
[:a.navbar-item {:href "/pos/sales-orders"}
"POS" ]
[:a.navbar-item {:href "/transactions/"}
[:a.navbar-item {:href "/transactions"}
"Transactions" ]
[:a.navbar-item {:href "/ledger/"}
"Ledger" ]
(company-dropdown/dropdown request)]]]]
[:a.navbar-item {:href "/ledger"}
"Ledger" ]]
[:div.navbar-end
(company-dropdown/dropdown request)
(login-dropdown/dropdown request)]]]]
[:div {:class "columns has-shadow", :id "mail-app", :style "margin-bottom: 0px; height: calc(100vh - 46px);"}
[:aside {:class "column aside menu is-2 "}
[:div {:class "main left-nav"}