om-next-tree.cljs

(ns layout.core
  (:require
    [sablono.core :include-macros true :refer-macros [html]]
    [goog.dom :as gdom]
    [om.next :as om :refer-macros [defui]]))


(def leaves
  (atom {1 {:leaf/label   "Root"
            :leaf/id      1
            :leaf/_parent [2 3]
            :leaf/count 0}
         2 {:leaf/label   "First child"
            :leaf/id      2
            :leaf/_parent [4]
            :leaf/count 0}
         3 {:leaf/label   "Second child"
            :leaf/id      3
            :leaf/_parent []
            :leaf/count 0}
         4 {:leaf/label "Only grandchild"
            :leaf/id 4
            :leaf/_parent []
            :leaf/count 0}}))

(defn get-child
  "Get leaf, include descendents"
  [tree n]
  (let [{:keys [leaf/_parent] :as c} (get tree n)]
    (if (empty? _parent) c (update c :leaf/_parent #(map (partial get-child tree) %)))))

(defmulti read om/dispatch)

(defmethod read :leaf
  [{:keys [state]} _ {:keys [leaf/id]}]
  {:value (get-child @state id)})

(defmulti mutate om/dispatch)

(defmethod mutate 'click
  [{:keys [state]} _ {:keys [leaf/id]}]
  {:value [(:leaf {:leaf/id id})]
   :action #(swap! leaves update-in [id :leaf/count] inc)})

(defonce reconciler (om/reconciler
                      {:state  leaves
                       :parser (om/parser {:read read :mutate mutate})}))

(declare leaf)

(defui Leaf
       static om/IQuery
       (query [this] '[:leaf/label :leaf/id :leaf/_parent])
       static om/Ident
       (ident [this {:keys [leaf/id]}] [:leaf/id id])
       Object
       (render [this]
               (let [{:keys [leaf/_parent leaf/label leaf/count] :as props} (om/props this)]
                 (html [:div
                        [:span {:on-click #(om/transact! this `[(~'click ~props)])} (str label " - " count)]
                        (map #(leaf %) _parent)]))))

(def leaf (om/factory Leaf {:keyfn :leaf/id}))

(defui Root
       static om/IQuery
       (query [this]
              '[{(:leaf {:leaf/id 1}) ?subquery}])
       static om/IQueryParams
       (params [this]
               {:subquery (om/get-query Leaf)})
       static om/Ident
       (ident [this _] [:leaf/id 1])
       Object
       (render [this]
               (html (leaf (:leaf (om/props this))))))

(om/add-root! reconciler Root (gdom/getElement "outliner"))

The first time I click the root node, it updates, but after I get this error:

Uncaught #error {:message "No queries exist for component path (layout.core/Root layout.core/Leaf)", :data {:type :om.next/no-queries}}om.next.full_query.cljs$core$IFn$invoke$arity$2 @ next.cljs?rel=1445790400527:864om$next$full_query @ next.cljs?rel=1445790400527:845om$next$default_ui__GT_props @ next.cljs?rel=1445790400527:1140om.next.Reconciler.om$next$protocols$IReconciler$reconcile_BANG$arity$1 @ next.cljs?rel=1445790400527:1115om$next$protocols$reconcile_BANG_ @ protocols.cljs?rel=1445790400697:20om.next.schedule_render_BANG_.f @ next.cljs?rel=1445790400527:600