supports typeahead for client search

This commit is contained in:
Bryce Covert
2020-07-29 06:49:44 -07:00
parent a1946f0d6e
commit 9453f78e0e
2 changed files with 80 additions and 60 deletions

View File

@@ -7,12 +7,13 @@
[auto-ap.routes :as routes]
[auto-ap.subs :as subs]
[auto-ap.events :as events]
[auto-ap.views.utils :refer [active-when active-when= login-url dispatch-event appearing css-transition-group]]
[auto-ap.views.utils :refer [active-when active-when= login-url dispatch-event appearing css-transition-group bind-field]]
[auto-ap.views.components.vendor-dialog :refer [vendor-dialog]]
[auto-ap.views.components.vendor-dialog :refer [vendor-dialog]]
[auto-ap.entities.vendors :as vendor]
[auto-ap.views.components.vendor-dialog :as vendor-dialog]))
[auto-ap.views.components.vendor-dialog :as vendor-dialog]
[clojure.string :as str]))
(defn navbar-drop-down-contents [{:keys [id]} children ]
@@ -53,12 +54,43 @@
[:a.navbar-item {:on-click (fn [e] (.preventDefault e) (re-frame/dispatch [::events/logout]))} "Logout"]]]
[:a.navbar-item {:href login-url} "Login"])))
(re-frame/reg-sub
::client-search
(fn [db]
(::client-search db)))
(re-frame/reg-sub
::matching-clients
:<- [::subs/clients]
:<- [::client-search]
(fn [[clients {client-search :value}]]
(if (empty? client-search)
clients
(if-let [exact-match (first (filter
(fn [client]
(= (str/lower-case (:code client)) (str/lower-case client-search)))
clients))]
[exact-match]
(filter
(fn [client]
(or
(str/includes? (str/lower-case (:code client)) (str/lower-case client-search))
(str/includes? (str/lower-case (:name client)) (str/lower-case client-search))))
clients)))))
(re-frame/reg-event-db
::client-search-changed
[(re-frame/path [::client-search])]
(fn [client-search [_ path value]]
(assoc-in client-search path value)))
(defn navbar [ap]
(let [user (re-frame/subscribe [::subs/user])
client (re-frame/subscribe [::subs/client])
clients (re-frame/subscribe [::subs/clients])
menu (re-frame/subscribe [::subs/menu])]
matching-clients @(re-frame/subscribe [::matching-clients])
menu (re-frame/subscribe [::subs/menu])
client-search @(re-frame/subscribe [::client-search])]
[:nav {:class "navbar has-shadow is-fixed-top"}
[:div {:class "container"}
[:div {:class "navbar-brand"}
@@ -103,7 +135,20 @@
:on-click (fn []
(re-frame/dispatch [::events/swap-client nil]))} "All" ]
[:hr {:class "navbar-divider"}]
(for [{:keys [name id] :as client} @clients]
[bind-field
[:input.input.navbar-item {:placeholder "Client name"
:auto-focus true
:field [:value]
:on-key-up (fn [k]
(when (= 13 (.-which k))
(do
(re-frame/dispatch [::events/swap-client (first matching-clients)])
(re-frame/dispatch [::events/toggle-menu ::select-client])
(re-frame/dispatch [::client-search-changed [:value] nil])))
)
:event [::client-search-changed]
:subscription client-search}]]
(for [{:keys [name id] :as client} matching-clients]
^{:key id }
[:a {:class "navbar-item"
:on-click (fn []