react learning: sorting table

(enable-console-print!)
(println "js app is started.")

(def excel-data (reagent/atom {:h ["book" "author" "language" "published" "sales"]
                               :b [["The Lord of the Rings" "J. R. R. Tolkien" "English" "1954–1955" "150 million"]
                                   ["Le Petit Prince (The Little Prince)" "Antoine de Saint-Exupéry" "French" "1943" "140 million"]
                                   ["Harry Potter and the Philosopher's Stone" "J. K. Rowling" "English" "1997" "107 million"]
                                   ["And Then There Were None" "Agatha Christie" "English" "1939" "100 million"]
                                   ["Dream of the Red Chamber" "Cao Xueqin" "Chinese" "1754–1791" "100 million"]
                                   ["The Hobbit" "J. R. R. Tolkien" "English" "1937" "100 million"]
                                   ["She: A History of Adventure" "H. Rider Haggard" "English" "1887" "100 million"]]
                               :sort-type {true > false <}
                               :sort-current true
                               :sort-column 0}))

(defn table-body
  [body]
  (for [row body]
    ^{:key (gensym)} [:tr (for [cell row]
                            ^{:key (gensym)}  [:td cell])]))

(defn change-sort-direction-if-needed
  [column-index]
  ;; when click on the same column then change sort direction
  (when (= column-index (:sort-column @excel-data))
    (swap! excel-data assoc-in [:sort-current] (not (:sort-current @excel-data)))))

(defn sort-table [column-index]
  (change-sort-direction-if-needed column-index)
  (let [sort-fn ((:sort-type @excel-data) (:sort-current @excel-data))
        sorted-data (sort-by #(nth % column-index) sort-fn (:b @excel-data))]
    (swap! excel-data assoc-in [:b] sorted-data)
    (swap! excel-data assoc-in [:sort-column] column-index)))

(defn table-header
  [header]
  [:tr
   (doall
    (for [header-item header]
      ^{:key (gensym)} [:th (if (= (.indexOf header header-item) (:sort-column @excel-data))
                              (str header-item (if (:sort-current @excel-data) \u2193 \u2191))
                              header-item)]))])

(defn excel-app
  "Excel prototype application"
  [excel-data]
  [:div
   [:table
    [:thead {:on-click #(sort-table (-> % .-target .-cellIndex))} (table-header (:h @excel-data))]
    [:tbody (table-body (:b @excel-data))]]])

(reagent/render-component [excel-app excel-data]
                          (.getElementById js/document "app"))

looks like this: