add some bounty sorting

src/cljs/commiteth/bounties.cljs

@@ -2,7 +2,9 @@
   (:require [reagent.core :as r]
             [re-frame.core :as rf]
             [commiteth.common :refer [moment-timestamp
-                                      issue-url]]))
+                                      issue-url]]
+            [commiteth.handlers :as handlers]
+            [commiteth.db :as db]))
 
 
 (defn bounty-item [bounty]
@@ -60,29 +62,33 @@
 (defn bounties-filters []
   [:div.open-bounties-filter
    [bounties-filter "Value"]
-   [bounties-filter "Type"]
+   [bounties-filter "Currency"]
-   [bounties-filter "Language"]
    [bounties-filter "Date"]
-   [bounties-filter "More"]])
+   [bounties-filter "Owner"]])
 
 (defn bounties-sort []
   (let [open? (r/atom false)]
     (fn []
+      (let [current-sorting (rf/subscribe [::db/bounty-sorting-type])]
         [:div.open-bounties-sort
         {:tab-index 0
          :on-blur   #(reset! open? false)}
         [:div.open-bounties-sort-element
          {:on-click #(swap! open? not)}
-        "Most Recent"
+         (db/bounty-sorting-types @current-sorting)
          [:div.icon-forward-white-box
           [:img
            {:src "icon-forward-white.svg"}]]]
         (when @open?
           [:div.open-bounties-sort-element-tooltip
-          "TOOLTIP"])])))
+           (for [[sorting-type sorting-name] db/bounty-sorting-types]
+             [:div.open-bounties-sort-type
+              {:on-click #(do
+                            (reset! open? false)
+                            (rf/dispatch [::handlers/set-bounty-sorting-type sorting-type]))}
+              sorting-name])])]))))
 
 (defn bounties-list [open-bounties]
-  (let [order (rf/subscribe [:bounties-order])]
   [:div.ui.container.open-bounties-container
    [:div.open-bounties-header "Bounties"]
    [:div.open-bounties-filter-and-sort
@@ -93,7 +99,7 @@
       [:p "No recent activity yet"]]
      (into [:div.ui.items]
            (for [bounty open-bounties]
-               [bounty-item bounty])))]))
+             [bounty-item bounty])))])
 
 
 (defn bounties-page []

src/cljs/commiteth/db.cljs

@@ -1,5 +1,10 @@
 (ns commiteth.db)
 
+(def bounty-sorting-types {::bounty-sorting-type|most-recent   "Most recent"
+                           ::bounty-sorting-type|lowest-value  "Lowest value"
+                           ::bounty-sorting-type|highest-value "Highest value"
+                           ::bounty-sorting-type|owner         "Owner"})
+
 (def default-db
   {:page                   :bounties
    :user                   nil
@@ -11,4 +16,4 @@
    :owner-bounties         {}
    :top-hunters            []
    :activity-feed          []
-   :bounties-order ::bounties-order|most-recent})
+   ::bounty-sorting-type   ::bounty-sorting-type|most-recent})

src/cljs/commiteth/handlers.cljs

@@ -453,3 +453,8 @@
  (fn [db [_]]
    (.removeEventListener js/window "click" close-dropdown)
    (assoc db :user-dropdown-open? false)))
+
+(reg-event-db
+  ::set-bounty-sorting-type
+  (fn [db [_ sorting-type]]
+    (assoc db ::db/bounty-sorting-type sorting-type)))

src/cljs/commiteth/subscriptions.cljs

@@ -1,5 +1,6 @@
 (ns commiteth.subscriptions
-  (:require [re-frame.core :refer [reg-sub]]))
+  (:require [re-frame.core :refer [reg-sub]]
+            [commiteth.db :as db]))
 
 (reg-sub
  :db
@@ -82,6 +83,6 @@
     (:user-dropdown-open? db)))
 
 (reg-sub
-  :bounties-order
+  ::db/bounty-sorting-type
   (fn [db _]
-    (:bounties-order db)))
+    (::db/bounty-sorting-type db)))

src/less/style.less

@@ -484,8 +484,7 @@
     .open-bounties-sort-element-tooltip {
         position: absolute;
         right: 0;
-        //margin-top: 12px;
+        //padding: 16px 0;
-        padding: 16px 24px;
         min-width: 200px;
         border-radius: 8px;
         background-color: #1e3751;
@@ -496,6 +495,15 @@
         color: #ffffff;
     }
 
+    .open-bounties-sort-type {
+        padding: 19px 24px;
+        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+    }
+
+    .open-bounties-sort-type:hover {
+        cursor: pointer;
+    }
+
     .icon-forward-white-box {
         width: 24px;
         height: 24px;