sortable_table.cljs

(ns sortable-table.core
  (:require [reagent.core :as reagent :refer [atom]]))

(def data
  (atom
   {:header ["Id" "Name" "City"]
    :rows [["1" "Joe" "New York"]
           ["2" "Harry" "Boston"]
           ["3" "Alicia" "Miami"]]}))

(defn table [data]
  [:table
   [:tr
    (map-indexed
     (fn [idx column]
       [:th
        {:onClick
         (fn [e]
           (swap! data update-in [:rows]
                  (fn [rows]
                    (sort-by
                     #(get % idx)
                     rows))))}
        column])
     (:header @data))]
   (map
    (fn [row]
      [:tr
       (map
        (fn [column]
          [:td column])
        row)])
    (:rows @data))])

(defn current-page []
  [:div [table data]])

;; -------------------------
;; Initialize app
(defn mount-root []
  (reagent/render [current-page] (.getElementById js/document "app")))

(defn init! []
  (mount-root))