Pagination
This commit is contained in:
parent
161b5b8052
commit
e65fabf60e
|
@ -1,10 +1,13 @@
|
|||
(ns commiteth.db)
|
||||
|
||||
(def default-db
|
||||
{:page :issues
|
||||
:user nil
|
||||
:user-profile nil
|
||||
:repos []
|
||||
:enabled-repos {}
|
||||
:all-bounties []
|
||||
:owner-bounties []})
|
||||
{:page :issues
|
||||
:user nil
|
||||
:user-profile nil
|
||||
:repos []
|
||||
:enabled-repos {}
|
||||
:all-bounties []
|
||||
:owner-bounties []
|
||||
:pagination {}
|
||||
:pagination-props {:page-size 10
|
||||
:pages-max 10}})
|
||||
|
|
|
@ -26,6 +26,19 @@
|
|||
(fn [db [_ page]]
|
||||
(assoc db :page page)))
|
||||
|
||||
(reg-event-db
|
||||
:set-page
|
||||
(fn [db [_ table page]]
|
||||
(assoc-in db [:pagination table :page] page)))
|
||||
|
||||
(reg-event-db
|
||||
:init-pagination
|
||||
(fn [db [_ bounties]]
|
||||
(let [{page-size :page-size} (:pagination-props db)]
|
||||
(assoc-in db [:pagination :all-bounties]
|
||||
{:page 0
|
||||
:pages (Math/ceil (/ (count bounties) page-size))}))))
|
||||
|
||||
(reg-event-fx
|
||||
:set-active-user
|
||||
(fn [{:keys [db]} [_ user]]
|
||||
|
@ -43,10 +56,11 @@
|
|||
:url "/api/bounties"
|
||||
:on-success #(dispatch [:set-bounties %])}}))
|
||||
|
||||
(reg-event-db
|
||||
(reg-event-fx
|
||||
:set-bounties
|
||||
(fn [db [_ bounties]]
|
||||
(assoc db :all-bounties bounties)))
|
||||
(fn [{:keys [db]} [_ bounties]]
|
||||
{:db (assoc db :all-bounties bounties)
|
||||
:dispatch [:init-pagination bounties]}))
|
||||
|
||||
(reg-event-fx
|
||||
:load-owner-bounties
|
||||
|
|
|
@ -2,20 +2,43 @@
|
|||
(:require [reagent.core :as r]
|
||||
[re-frame.core :as rf]))
|
||||
|
||||
(defn pagination []
|
||||
(defn- page-btn
|
||||
[table selected-page current-page]
|
||||
^{:key current-page}
|
||||
[:a {:class (when (= selected-page current-page) "current")
|
||||
:on-click #(rf/dispatch [:set-page table current-page])}
|
||||
(str (inc current-page))])
|
||||
|
||||
(defn pagination [table]
|
||||
(fn []
|
||||
[:div.paginate-container
|
||||
[:div.pagination
|
||||
[:span.previous-page.disabled "Previous"]
|
||||
[:em.current "1"]
|
||||
[:a {:rel "next", :href "#"} "2"]
|
||||
[:a {:href "#"} "3"]
|
||||
[:a {:href "#"} "4"]
|
||||
[:a {:href "#"} "5"]
|
||||
[:span.gap "…"]
|
||||
[:a {:href "#"} "10"]
|
||||
[:a {:href "#"} "11"]
|
||||
[:a.next-page {:rel "next", :href "#"} "Next"]]]))
|
||||
(let [{page :page
|
||||
pages :pages} @(rf/subscribe [:pagination table])
|
||||
{pages-max :pages-max} @(rf/subscribe [:get-in [:pagination-props]])]
|
||||
(when (> pages 1)
|
||||
(let [last-page (dec pages)
|
||||
start-page (max 1 (min (- pages pages-max) (max 1 (- page (quot pages-max 2)))))
|
||||
end-page (min (dec pages) (+ pages-max start-page))
|
||||
gap-left (> start-page 1)
|
||||
gap-right (< end-page last-page)]
|
||||
[:div.paginate-container
|
||||
[:div.pagination
|
||||
[:span.previous-page
|
||||
(let [disabled (= page 0)]
|
||||
{:class (when disabled "disabled")
|
||||
:on-click (when-not disabled
|
||||
#(rf/dispatch [:set-page table (dec page)]))})
|
||||
"Previous"]
|
||||
(page-btn table page 0)
|
||||
(when gap-left [:span.gap "…"])
|
||||
(map #(page-btn table page %) (range start-page end-page))
|
||||
(when gap-right [:span.gap "…"])
|
||||
(page-btn table page last-page)
|
||||
[:span.next-page
|
||||
(let [disabled (= page last-page)]
|
||||
{:class (when disabled "disabled")
|
||||
:on-click (when-not disabled
|
||||
#(rf/dispatch [:set-page table (inc page)]))})
|
||||
"Next"]]])))))
|
||||
|
||||
(defn repo-link
|
||||
[owner repo]
|
||||
|
@ -63,14 +86,19 @@
|
|||
|
||||
(defn issues-list-table
|
||||
[issues-path issue-row-fn]
|
||||
(let [issues (rf/subscribe issues-path)]
|
||||
(fn []
|
||||
(fn []
|
||||
(let [{page :page} @(rf/subscribe (into [:pagination] issues-path))
|
||||
{page-size :page-size} @(rf/subscribe [:get-in [:pagination-props]])
|
||||
issues (rf/subscribe issues-path)
|
||||
issues-page (->> @issues
|
||||
(drop (* page page-size))
|
||||
(take page-size))]
|
||||
[:div.issues-list-table
|
||||
[:ul.issues-list
|
||||
(map issue-row-fn @issues)]])))
|
||||
(map issue-row-fn issues-page)]])))
|
||||
|
||||
(defn issues-page []
|
||||
(fn []
|
||||
[:div.container
|
||||
[(issues-list-table [:all-bounties] issue-row)]
|
||||
[pagination]]))
|
||||
[(pagination :all-bounties)]]))
|
||||
|
|
|
@ -26,6 +26,11 @@
|
|||
(fn [db _]
|
||||
(:owner-bounties db)))
|
||||
|
||||
(reg-sub
|
||||
:pagination
|
||||
(fn [db [_ table]]
|
||||
(get-in db [:pagination table])))
|
||||
|
||||
(reg-sub
|
||||
:get-in
|
||||
(fn [db [_ path]]
|
||||
|
|
Loading…
Reference in New Issue