From 0ded06b26e6bc16a447490914e4fbd0f0900396d Mon Sep 17 00:00:00 2001
From: BC <bryce@brofessional.local>
Date: Tue, 19 Feb 2019 19:04:16 -0800
Subject: [PATCH] fix dropdown

---
 .../views/components/invoice_table.cljs       | 10 ++--
 .../auto_ap/views/components/layouts.cljs     | 49 ++++++++++++-------
 2 files changed, 38 insertions(+), 21 deletions(-)

diff --git a/src/cljs/auto_ap/views/components/invoice_table.cljs b/src/cljs/auto_ap/views/components/invoice_table.cljs
index 4cb93c69..af4d4b9f 100644
--- a/src/cljs/auto_ap/views/components/invoice_table.cljs
+++ b/src/cljs/auto_ap/views/components/invoice_table.cljs
@@ -28,6 +28,7 @@
 (re-frame/reg-event-fx
  ::toggle-expense-accounts
  (fn  [{:keys [db] } [_ invoice-id]]
+   (println "toggling")
    {:db
     (update-in db [::visible-expense-accounts] (fn [i] (if (= i invoice-id) nil invoice-id) ))}))
 
@@ -169,14 +170,15 @@
 
                     [:div.dropdown.is-right {:class (if (= id visible-expense-accounts)
                                                       "is-active"
-                                                      "")}
+                                                      "")
+                                             :on-blur (dispatch-event [::toggle-expense-accounts id]) 
+                                             :on-focus (dispatch-event [::toggle-expense-accounts id])}
                      [:div.dropdown-trigger
                       [:a.button.badge {:data-badge (str (clojure.core/count expense-accounts))
                                         :aria-haspopup true
                                         :tab-index "0"
                                         
-                                        :on-blur (delayed-dispatch [::toggle-expense-accounts id]) 
-                                        :on-focus (dispatch-event [::toggle-expense-accounts id])
+                                        
                                         } "Accounts"]]
                      [:div.dropdown-menu {:role "menu"}
                       [:div.dropdown-content
@@ -187,7 +189,7 @@
                        [:hr.dropdown-divider]
 
                        (when expense-event
-                         [:a.dropdown-item.is-primary {:on-click (dispatch-event (conj expense-event i))} "Change"])]]])
+                         [:a.dropdown-item.is-primary {:on-click (fn [x] (println "here"))#_(dispatch-event (conj expense-event i))} "Change"])]]])
                  [:span {:style {:margin-left "1em"}}]
                   (when (and on-edit-invoice (not= ":voided" (:status i)))
                     [:a.button {:on-click (fn [] (on-edit-invoice i))} [:span.icon [:i.fa.fa-pencil]]])
diff --git a/src/cljs/auto_ap/views/components/layouts.cljs b/src/cljs/auto_ap/views/components/layouts.cljs
index a6c72819..68c5f03d 100644
--- a/src/cljs/auto_ap/views/components/layouts.cljs
+++ b/src/cljs/auto_ap/views/components/layouts.cljs
@@ -27,6 +27,24 @@
         [:a.navbar-item {:on-click (fn [e] (.preventDefault e) (re-frame/dispatch [::events/logout]))} "Logout"]]]
       [:a.navbar-item {:href login-url} "Login"])))
 
+(defn navbar-drop-down-contents [children]
+  (let [toggle-fn (fn [] (re-frame/dispatch [::events/toggle-menu :client]))]
+    (reagent/create-class {:component-did-mount (fn [] (.addEventListener js/document "click" toggle-fn))
+                           :component-will-unmount (fn [] (.removeEventListener js/document "click" toggle-fn))
+                           :reagent-render
+                           (fn [children]
+                             children)})))
+
+(defn navbar-drop-down [{:keys [active? header]} & children]
+  (reagent/create-class
+   {:reagent-render (fn [{:keys [active? header]} & children]
+                      [:div { :class (str "navbar-item has-dropdown " (when active? "is-active"))}
+                       [:a {:class "navbar-link login" :on-click (fn [] (re-frame/dispatch [::events/toggle-menu :client]))} header]
+                       [:div {:class "navbar-dropdown"}
+                        (when active?
+                          [navbar-drop-down-contents 
+                           [:div
+                            children]])]])}))
 (defn navbar [ap]
   (let [client (re-frame/subscribe [::subs/client])
         clients (re-frame/subscribe [::subs/clients])
@@ -56,23 +74,20 @@
          [:span]] 
         [:div.navbar-end
          (when (> (count @clients) 1)
-           [:div { :class (str "navbar-item has-dropdown " (when (get-in @menu [:client :active?]) "is-active"))}
-            [:a {:class "navbar-link login" :on-click (fn [] (re-frame/dispatch [::events/toggle-menu :client]))} "Client: " (if @client (:name @client)
-                                                                                                                                 "All")]
-            [:div {:class "navbar-dropdown"}
-             [:a {:class "navbar-item"
-                  :on-click (fn []
-                              (re-frame/dispatch [::events/toggle-menu :client])
-                              (re-frame/dispatch [::events/swap-client nil]))
-                  } "All"]
-             [:hr {:class "navbar-divider"}]
-             (for [{:keys [name id] :as client} @clients]
-               ^{:key id }
-               [:a {:class "navbar-item"
-                    :on-click (fn []
-                                (re-frame/dispatch [::events/toggle-menu :client])
-                                (re-frame/dispatch [::events/swap-client client]))
-                    } name])]])]]
+           [navbar-drop-down {:active? (get-in @menu [:client :active?])
+                              :header (str "Client: " (if @client (:name @client)
+                                                          "All"))}
+            [:a {:class "navbar-item"
+                 :on-click (fn []
+                             (re-frame/dispatch [::events/swap-client nil]))
+                 } "All"]
+            [:hr {:class "navbar-divider"}]
+            (for [{:keys [name id] :as client} @clients]
+              ^{:key id }
+              [:a {:class "navbar-item"
+                   :on-click (fn []
+                               (re-frame/dispatch [::events/swap-client client]))
+                   } name])])]]
        [login-dropdown]]]))
 
 (defn footer []