supports typeahead for client search

src/cljs/auto_ap/views/components/layouts.cljs

@@ -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 []

src/cljs/auto_ap/views/pages/admin/yodlee.cljs

@@ -198,32 +198,15 @@
  [with-user ]
  (fn [{:keys [user db]} [_ provider-account-id ]]
    {:db (forms/loading db [::mfa-form provider-account-id])
-    :http {:token user
-           :method :post 
-           :headers {"Content-Type" "application/edn"}
-           :uri (str "/api/yodlee/reauthenticate/" provider-account-id )
-           :body {"field"
-                  (mapv (fn [[k v]]
-                          {"id" k
-                           "value" v})
-                        (:data (get-in db [::forms/forms [::mfa-form provider-account-id]])))}
-           
-           :on-success [::authenticated]
-           :on-error [::forms/save-error [::mfa-form provider-account-id] ]}}))
-
-(re-frame/reg-event-fx
- ::reauthenticate
- [with-user ]
- (fn [{:keys [user db]} [_ provider-account-id ]]
-   {:db (forms/loading db [::login-form provider-account-id])
     :http {:token user
            :method :post 
            :headers {"Content-Type" "application/edn"}
            :uri (str "/api/yodlee/reauthenticate/" provider-account-id )
            :body {"loginForm"
                   {"row"
-                   (->> (get-in db [::forms/forms [::login-form provider-account-id]])
+                   (->> (get-in db [::forms/forms [::mfa-form provider-account-id]])
                         :data
+                        :login
                         (sort-by (fn [[k v]] k))
                         (map second)
                         (map (fn [row]
@@ -231,10 +214,15 @@
                                 (mapv (fn [[k v]]
                                         {"id" k
                                          "value" v})
-                                      row)})))}}
+                                      row)})))}
+                  "field"
+                  (mapv (fn [[k v]]
+                          {"id" k
+                           "value" v})
+                        (:mfa (:data (get-in db [::forms/forms [::mfa-form provider-account-id]]))))}
            
            :on-success [::authenticated]
-           :on-error [::forms/save-error [::login-form provider-account-id]]}}))
+           :on-error [::forms/save-error [::mfa-form provider-account-id] ]}}))
 
 (defn yodlee-provider-accounts-table []
   
@@ -283,32 +271,14 @@
                   "This provider account's status is '"
                   (-> account :dataset first :additionalStatus)
                   "'. If this is in error, it might help to try reauthenticating by filling out the form below."]]]]
-              (if (:field account)
-                (for [f (:field account)]
               (let [{error :error account-data :data } @(re-frame/subscribe [::forms/form [::mfa-form (:id account)]])
                     change-event [::forms/change [::mfa-form (:id account)]]
                     {:keys [form-inline field field-holder raw-field error-notification submit-button]} (forms/vertical-form {:can-submit [::can-submit]
                                                                                                                               :change-event change-event
                                                                                                                               :submit-event [::reauthenticate-mfa (:id account)]
                                                                                                                               :id [::mfa-form (:id account)]} )]
-                    (form-inline {:title "Reauthenticate (mfa)"}
+                (form-inline {:title "Reauthenticate"}
                              [:<>
-                           (error-notification)
-                           (doall 
-                            (for [f (-> account :field)]
-                              ^{:key (:id f)}
-                              (field (:label f)
-                                     [:input.input {:type "text" :field [(:id f)] :value (-> f :field first :value)}])))
-                           (submit-button "Reauthenticate")])))
-                (let [{error :error account-data :data } @(re-frame/subscribe [::forms/form [::login-form (:id account)]])
-                      change-event [::forms/change [::login-form (:id account)]]
-                      {:keys [form-inline field field-holder raw-field error-notification submit-button]} (forms/vertical-form {:can-submit [::can-submit]
-                                                                                                                         :change-event change-event
-                                                                                                                         :submit-event [::reauthenticate (:id account)]
-                                                                                                                         :id [::login-form (:id account)]} )]
-                  (form-inline {:title "Reauthenticate (login)"}
-                        [:<>
-                         
                               (error-notification)
                               (doall 
                                (for [[row i] (map vector  (-> account :loginForm last :row) (range))
@@ -316,8 +286,13 @@
                                  ^{:key (:id f)}
                                  [:div 
                                   (field (:label row)
-                                    [:input.input {:type "text" :field [i (:id f)]}])]))
+                                         [:input.input {:type "text" :field [:login i (:id f)]}])]))
-                         (submit-button "Reauthenticate")])))])]]))]]))
+                              (doall 
+                               (for [f (-> account :field)]
+                                 ^{:key (:id f)}
+                                 (field (:label f)
+                                        [:input.input {:type "text" :mfa [:form (:id f)] :value (-> f :field first :value)}])))
+                              (submit-button "Reauthenticate")]))])]]))]]))
 
 
 (defn admin-yodlee-content []