placeholders.cljs

(ns omscratch.core
  (:require [om.next :as om :refer-macros [defui]]
            [om.dom :as dom]))

(enable-console-print!)

(defonce app-state (atom {:transactions []}))

(defui ^:once SubComponentB
  static om/IQueryParams
  (params [_]
          {:ids []})
  static om/IQuery
  (query [this]
         [:attr1
          (list [:transactions '_] {:ids '?ids})])
  Object
  (render [this]
          (print "sub-component B props meta " (meta (om/props this)) " props " (om/props this))
          (dom/div nil
                   (dom/button #js {:onClick (fn [e]
                                               (.preventDefault e)
                                               (om/update-query! this (fn [q] (update-in q [:params :ids] conj "some-transaction")))
                                               (om/transact! this ['(add/transaction)]))}
                               
                               "Component B: Click to break")
                   (dom/p nil (str "Transaction count: " (count (get (om/props this) :transactions)))))))

(def sub-component-b (om/factory SubComponentB))

(defui ^:once SubComponentA
  static om/IQueryParams
  (params [_]
          {:ids []})
  static om/IQuery
  (query [this]
         [{:entity [{:ph/sub-component-b (om/get-query SubComponentB)}]}
          (list [:transactions '_] {:ids '?ids})])
  Object
  (render [this]
          (print "sub-component A props meta " (meta (om/props this)) " props " (om/props this))
          (dom/div nil
                   (dom/button #js {:onClick (fn [e]
                                               (.preventDefault e)
                                               (om/update-query! this (fn [q] (update-in q [:params :ids] conj "some-transaction")))
                                               (om/transact! this '[(add/transaction)]))}
                               
                               "Component A: Click")
                   (dom/p nil (str "Transaction count: " (count (get (om/props this) :transactions))))
                   (sub-component-b (get-in (om/props this) [:entity :ph/sub-component-b])))))

(def sub-component-a (om/factory SubComponentA))

(defui ^:once Root
  static om/IQueryParams
  (params [_]
          {:path []})
  static om/IQuery
  (query [this]
         [{:root (om/get-query SubComponentA)}])
  Object
  (render [this]
          (print "Root props meta " (meta (om/props this)) " props " (om/props this))
          (sub-component-a (:root (om/props this)))))

(defmulti read om/dispatch)

(defmethod read :root [{:keys [target state ast parser] :as env} k params]
  (let [transactions (:transactions @state)]
    {:value {:transactions transactions
             :entity {:ph/sub-component-b {:attr1 "val1" :transactions transactions}}}}))

(defmulti mutate om/dispatch)

(defmethod mutate 'add/transaction [{:keys [state] :as env} k params]
  {:value {:keys [:transactions]}
   :action (fn []
             (swap! state update :transactions conj 1))})

(defonce parser (om/parser {:read read :mutate mutate}))

(defn send [{:keys [remote] :as query} cb])

(defonce reconciler
  (om/reconciler
   {:state app-state
    :parser parser
    :send send
    :normalize false
    :migrate nil
    :remotes [:remote]}))

(defn render []
  (om/add-root! reconciler
                Root (js/document.getElementById "app")))

placeholders.gif