(ns auto-ap.views.components.invoice-table
  (:require [re-frame.core :as re-frame]
            [auto-ap.subs :as subs]
            [auto-ap.views.utils :refer [date->str]]
            [reagent.core :as reagent]
            [cljs-time.format :as format]))

(defn toggle-sort-by [params key]

  (-> params
      (assoc :sort-by key)
      (update :asc not)))

(defn sort-icon [which sort-by asc]
  (cond
    (and (= sort-by which) asc)
    [:span.icon
     [:i.fa.fa-sort-up]]

    (and (= sort-by which) (not asc))
    [:span.icon
     [:i.fa.fa-sort-down]]

    :else
    [:span.icon
     [:i.fa.fa-sort]]))

(defn query [params]
  {:venia/queries [[:invoice
                    (assoc params
                           :company-id (:id @(re-frame/subscribe [::subs/company]))) 
                    [:id :total :invoice-number :date [:vendor [:name :id]] [:company [:name :id]]]]]})

(defn invoice-table [{:keys [id invoices status on-params-change vendors params]}]
  (let [state (reagent/atom (or @params {}))]
    (fn [{:keys [id invoices status on-params-change vendors]}]
      (let [{:keys [sort-by asc]} @state]
        [:table.table.is-fullwidth 
         [:thead  
          [:tr  
           [:th {:on-click (fn [e]
                             (on-params-change (swap! state toggle-sort-by "vendor"))) :style {:width "25%" :cursor "pointer"}}  "Vendor"
            (sort-icon "vendor" sort-by asc)]
           [:th {:on-click (fn [e] (on-params-change (swap! state toggle-sort-by "company"))) :style {:width "25%" :cursor "pointer"}} "Company"
            (sort-icon "company" sort-by asc)]
           [:th {:on-click (fn [e] (on-params-change (swap! state toggle-sort-by "invoice-number"))) :style {:width "18%" :cursor "pointer"}} "Invoice #"
            (sort-icon "invoice-number" sort-by asc)]
           [:th {:on-click (fn [e] (on-params-change (swap! state toggle-sort-by "date"))) :style {:width "16%" :cursor "pointer"}} "Date"
            (sort-icon "date" sort-by asc)]
           [:th {:on-click (fn [e] (on-params-change (swap! state toggle-sort-by "total"))) :style {:width "16%" :cursor "pointer"}} "Amount"
            (sort-icon "total" sort-by asc)]]]
         [:tbody
          (if (:loading @status)
            [:tr 
             [:td {:col-span 5}
              [:i.fa.fa-spin.fa-spinner]]]
            (for [{:keys [company invoice-number date total id vendor] :as i} @invoices]
              ^{:key id}
              [:tr
               [:td (:name vendor)]
               [:td (:name company)]
               [:td invoice-number]
               [:td (date->str date) ]
               [:td total]]))]]))))