Made all interactions much better

This commit is contained in:
Bryce Covert
2020-08-17 19:43:31 -07:00
parent dbb671b5d9
commit 6a8bb77e95
10 changed files with 234 additions and 284 deletions

View File

@@ -1,6 +1,7 @@
(ns auto-ap.views.pages.data-page
(:require [auto-ap.status :as status]
[auto-ap.utils :refer [by merge-by replace-by]]
[auto-ap.subs :as subs]
[auto-ap.utils :refer [deep-merge replace-by]]
[re-frame.core :as re-frame]))
(re-frame/reg-sub
@@ -35,10 +36,30 @@
[::data id :data]
replace-by :id (update entity :class #(or % "live-added")))))
(re-frame/reg-event-db
(re-frame/reg-sub
::table-params
(fn [db [_ which]]
(get-in db [::table-params which])))
(re-frame/reg-sub
::params
(fn [[_ id]]
[(re-frame/subscribe [::subs/client])
(re-frame/subscribe [::settled-filters id])
(re-frame/subscribe [::table-params id])
(re-frame/subscribe [::subs/query-params])])
(fn [[client filters table-params query-params]]
(cond-> {}
client (assoc :client-id (:id client))
(seq query-params) (merge query-params)
(seq filters) (merge filters)
(seq table-params) (merge table-params))))
(re-frame/reg-event-fx
::received
(fn [db [_ id data]]
(assoc-in db [::data id] data)))
(fn [{:keys [db]} [_ id data]]
{:db (assoc-in db [::data id] data)
:set-uri-params (dissoc @(re-frame/subscribe [::params id]) :client-id)}))
(re-frame/reg-event-db
::dispose
@@ -46,7 +67,9 @@
(-> db
(update ::data dissoc id)
(update ::checked dissoc id)
(update ::params dissoc id))))
(update ::table-params dissoc id)
(update ::filters dissoc id)
(update ::settled-filters dissoc id))))
(re-frame/reg-sub
::data
@@ -58,13 +81,67 @@
(fn [[_ id]]
[(re-frame/subscribe [::data id])
(re-frame/subscribe [::status/single [::page id]])
(re-frame/subscribe [::checked id])])
(fn [[data status checked] [_ id]]
(re-frame/subscribe [::checked id])
(re-frame/subscribe [::params id])
(re-frame/subscribe [::table-params id])
(re-frame/subscribe [::filters id])])
(fn [[data status checked params table-params filters] [_ id]]
{:id id
:data data
:status status
:checked checked}))
:checked checked
:params params
:filters filters
:table-params table-params}))
(defn in-page-entities [which]
(re-frame/path [::data which :data ] ))
(re-frame/reg-event-fx
::table-params-changed
(fn [{:keys [db]} [_ which params :as z]]
{:db (update-in db [::table-params which] merge params)}))
(re-frame/reg-sub
::specific-filters
(fn [db [_ id]]
(get-in db [::filters id])))
(re-frame/reg-sub
::filters
(fn [[_ id]]
[(re-frame/subscribe [::specific-filters id])
(re-frame/subscribe [::subs/query-params])])
(fn [[specific-filters query-params] ]
(deep-merge query-params (or specific-filters {}) )))
(re-frame/reg-sub
::filter
(fn [[_ id]]
[(re-frame/subscribe [::filters id])])
(fn [[filters] [_ id which]]
(get filters which)))
(re-frame/reg-event-fx
::filters-settled
(fn [{:keys [db]} [_ id]]
{:db (assoc-in db [::settled-filters id] @(re-frame/subscribe [::filters id]))}))
(re-frame/reg-sub
::settled-filters
(fn [db [_ id]]
(get-in db [::settled-filters id])))
(re-frame/reg-event-fx
::filter-changed
(fn [{:keys [db]} [_ id & params]]
(let [[a b c] params
[which val] (if (= 3 (count params))
[(into [a] b) c]
[[a] b])]
{:db (assoc-in db (into [::filters id] which) val)
:dispatch-debounce
{:event [::filters-settled id]
:time 800
:key [::filters id]}})))

View File

@@ -17,7 +17,11 @@
[clojure.string :as str]
[vimsical.re-frame.cofx.inject :as inject]
[auto-ap.status :as status]
[vimsical.re-frame.fx.track :as track]))
[vimsical.re-frame.fx.track :as track]
[auto-ap.views.pages.data-page :as data-page]
[clojure.set :as set]
[auto-ap.effects.forward :as forward]))
(defn dropzone []
(let [client (re-frame/subscribe [::subs/client])
token (re-frame/subscribe [::subs/token])
@@ -30,7 +34,7 @@
(.on (js-this) "success" (fn [_ files]
(re-frame/dispatch [::invalidated])))
(.on (js-this) "error" (fn [_ error]
(re-frame/dispatch [::errored error]))))
(re-frame/dispatch [::status/error ::import [(edn/read-string error)]]))))
:paramName "file"
:headers {"Authorization" (str "Token " @token)}
:url (str "/api/invoices/upload"
@@ -59,7 +63,6 @@
:value @vendor}]]
]
[:div.tile.notification
[:div.has-text-centered {:style {:padding "80px 0px" :width "100%"}}
[:span
[:span {:class "icon"}
@@ -68,15 +71,6 @@
))
(re-frame/reg-sub
::invoice-page
(fn [db]
(-> db ::invoice-page)))
(re-frame/reg-sub
::error
(fn [db]
(-> db ::error)))
(re-frame/reg-sub
@@ -86,65 +80,49 @@
(re-frame/reg-event-fx
::invalidated
(fn [cofx [_ params]]
{:dispatch [::params-change @(re-frame/subscribe [::params])]}))
(fn [{:keys [db]} [_ params]]
{:dispatch-n [[::params-change @(re-frame/subscribe [::data-page/params :import-invoices])]
[::data-page/reset-checked :import-invoices]/]
:db (update db ::batch inc)}
))
(re-frame/reg-event-fx
::mounted
(fn [cofx [_ params]]
{::track/register {:id ::params
:subscription [::params]
:event-fn (fn [params]
[::params-change params])}}))
{::track/register [{:id ::params
:subscription [::data-page/params :import-invoices]
:event-fn (fn [params]
[::params-change params])}
]
::forward/register [{:id ::received
:events #{::data-page/received}
:event-fn (fn [[_ _ {:keys [data]}]]
[::received data])}]
:dispatch [::data-page/dispose :import-invoices]}))
(re-frame/reg-event-fx
::unmounted
(fn [cofx [_ params]]
{::track/dispose {:id ::params}}))
(re-frame/reg-event-fx
::completed
(fn [cofx [_ params]]
(println (::batch (:db cofx)))
{:dispatch [::invalidated]
:db (-> (:db cofx)
(update ::batch inc))}))
(re-frame/reg-sub
::params
:<- [::subs/client]
:<- [::invoice-table/table-params]
(fn [[client table-params]]
(cond-> {:import-status "pending"}
client (assoc :client-id (:id client))
(seq table-params) (merge table-params))))
(re-frame/reg-event-fx
::params-change
[with-user (re-frame/inject-cofx ::inject/sub [::params])]
(fn [{:keys [db user] ::keys [params]} [_]]
{:db (-> db
(dissoc ::error))
:graphql {:token user
:owns-state {:single ::page}
:query-obj (invoice-table/query params)
:on-success [::received]}}))
[with-user]
(fn [{:keys [user] } [_ params]]
{:graphql {:token user
:owns-state {:single [::data-page/page :import-invoices]}
:query-obj (invoice-table/query (assoc params :import-status "pending"))
:on-success (fn [result]
(let [result (set/rename-keys (first (:invoice-page result))
{:invoices :data})]
(re-frame/reg-event-db
[::data-page/received :import-invoices result]))}}))
(re-frame/reg-event-fx
::received
(fn [db [_ data]]
(-> db
(assoc ::invoice-page (first (:invoice-page data)))
(update-in [::invoice-page] (fn [ip]
(assoc ip :checked (set (map :id (:invoices ip))))))
(assoc-in [:status :loading] false))))
(re-frame/reg-event-db
::errored
(fn [db [_ error]]
(assoc db ::error (or (:message (edn/read-string error))
"An unknown error has occured."))))
(fn [_ [_ data]]
{:dispatch [::data-page/toggle-check :import-invoices (set (map :id data))]}))
(re-frame/reg-event-fx
::reject-invoices-clicked
@@ -154,12 +132,10 @@
:owns-state {:single ::reject}
:query-obj {:venia/operation {:operation/type :mutation
:operation/name "RejectInvoices"}
:venia/queries [[:reject-invoices
{:invoices (vec invoices)}
[]]]}
:on-success [::completed]}
}))
[]]]}
:on-success [::invalidated]}}))
(re-frame/reg-event-fx
::approve-invoices-clicked
@@ -169,12 +145,10 @@
:owns-state {:single ::approve}
:query-obj {:venia/operation {:operation/type :mutation
:operation/name "ApproveInvoices"}
:venia/queries [[:approve-invoices
{:invoices (vec invoices)}
[]]]}
:on-success [::completed]}
}))
[]]]}
:on-success [::invalidated]}}))
(re-frame/reg-event-fx
::approve-invoices
@@ -184,17 +158,10 @@
:uri (str "/api/invoices/approve"
(when-let [client-id (:id @(re-frame/subscribe [::subs/client]))]
(str "?client=" client-id)))
:on-success on-success
}}))
(re-frame/reg-event-db
::toggle-check
(fn [db [_ new]]
(-> db (assoc-in [::invoice-page :checked] new))))
:on-success on-success}}))
(defn approve-reject-button [checked]
[:div.is-pulled-right
[:button.button.is-success {:on-click (dispatch-event [::approve-invoices-clicked checked])
:class (status/class-for @(re-frame/subscribe [::status/single ::approve]))
:disabled (if (seq checked)
@@ -205,8 +172,6 @@
(str
(count checked)
" invoices"))
[:span " "]]
[:button.button.is-danger {:on-click (dispatch-event [::reject-invoices-clicked checked])
:class (status/class-for @(re-frame/subscribe [::status/single ::reject]))
@@ -218,47 +183,34 @@
(str
(count checked)
" invoices"))
[:span " "]
]])
[:span " "]]])
(def import-invoices-content
(with-meta
(fn []
(let [invoice-page (re-frame/subscribe [::invoice-page])
status (re-frame/subscribe [::subs/status])
error (re-frame/subscribe [::error])
batch (re-frame/subscribe [::batch])
params @(re-frame/subscribe [::params])
(let [page @(re-frame/subscribe [::data-page/page :import-invoices])
batch @(re-frame/subscribe [::batch])
client (:id @(re-frame/subscribe [::subs/client]))]
^{:key (str client "-" @batch)}
^{:key (str client "-" batch)}
[:div
[:h1.title "Upload invoices"]
^{:key (str @batch)}
[status/status-notification {:statuses [[::status/single ::approve]
[::status/single ::reject]
[::status/single ::import]]}]
^{:key (str batch)}
[dropzone]
[:div {:class "section"}
(when @error
[:div.notification.is-warning @error])]
[:div {:class "card found-invoices",}
[:div {:class "card-header"}
[:span {:class "card-header-title"} "Found Invoices"]]
[:div {:class "card-content"}
[approve-reject-button (:checked @invoice-page)]
(if (seq (:invoices @invoice-page))
[approve-reject-button (:checked page)]
(if (seq (:data (:data page)))
[invoice-table {:id :approved
:invoice-page @invoice-page
:data-page :import-invoices
:overrides {:client (fn [row]
[:p (:name (:client row))
[:p [:i.is-size-7 (:client-identifier row)]]])}
:check-boxes true
:checked (:checked @invoice-page)
:on-check-changed (fn [which]
(re-frame/dispatch [::toggle-check which]))
:status @(re-frame/subscribe [::status/single ::page])}]
:check-boxes true}]
[:span "No pending invoices"])]]]))
{:component-did-mount (fn []
(re-frame/dispatch-sync [::mounted]))

View File

@@ -35,22 +35,6 @@
[reagent.core :as r]
[vimsical.re-frame.fx.track :as track]))
;; TODO: Sort out approaches for which buttons to show
;; TODO: make it so filters are basically free
(re-frame/reg-sub
::params
:<- [::subs/client]
:<- [::side-bar/filter-params]
:<- [::table/table-params]
(fn [[client filter-params table-params]]
(cond-> {:import-status "imported"}
client (assoc :client-id (:id client))
(seq filter-params) (merge filter-params)
(seq table-params) (merge table-params))))
(re-frame/reg-event-fx
::params-change
[with-user]
@@ -63,11 +47,7 @@
{:invoices :data})]
[::data-page/received :invoices result]))
:on-error [::events/page-failed]}
:set-uri-params (dissoc params
:status
:client-id
:import-status)}))
:on-error [::events/page-failed]}}))
(re-frame/reg-event-fx
::unmounted
@@ -82,7 +62,7 @@
::mounted
(fn [{:keys [db]} _]
{::track/register [{:id ::params
:subscription [::params]
:subscription [::data-page/params :invoices]
:event-fn (fn [params]
[::params-change params])}]
::forward/register [{:id ::updated
@@ -207,7 +187,7 @@
(dispatch-event [::data-page/remove-check :invoices id])}]]) checked-invoices))]]))
(defn unpaid-invoices-content [{:keys [status] :as params}]
(defn unpaid-invoices-content [{:keys [status]}]
(let [page @(re-frame/subscribe [::data-page/page :invoices])
current-client @(re-frame/subscribe [::subs/client])]
[:div
@@ -216,12 +196,8 @@
(when (= status :unpaid)
[pay-button])
[table/invoice-table {:id (:id page)
:checked (:checked page)
:data (:data page)
:status (:status page)
:data-page :invoices
:check-boxes (= status :unpaid)
:on-check-changed (fn [new]
(re-frame/dispatch [::data-page/toggle-check :invoices new ]))
:actions #{:edit :void :expense-accounts}}]]))
(defn unpaid-invoices-page [params]
@@ -231,8 +207,7 @@
:component-did-mount #(re-frame/dispatch [::mounted])
:reagent-render
(fn []
(let [{invoice-bar-active? :active?} @(re-frame/subscribe [::forms/form ::form/form])
params @(re-frame/subscribe [::params])]
[side-bar-layout {:side-bar [invoices-side-bar {}]
(let [{invoice-bar-active? :active?} @(re-frame/subscribe [::forms/form ::form/form])]
[side-bar-layout {:side-bar [invoices-side-bar {:data-page :invoices}]
:main [unpaid-invoices-content params]
:right-side-bar [appearing-side-bar {:visible? invoice-bar-active?} [form/form {}]]}]))}))