Shows communication of local state between two components using core.async

local-state.clj

(ns ^:figwheel-always local-state.core
    (:require-macros [cljs.core.async.macros :refer [go]])
    (:require [om.core :as om :include-macros true]
              [om.dom :as dom :include-macros true]
              [cljs.core.async :refer [put! chan <!]]))

(enable-console-print!)

(defonce app-state (atom {}))

(defn field-view [data owner]
  (reify
    om/IRenderState
    (render-state [_ {:keys [index collapse-ch]}]
      (dom/button #js {:onClick (fn [_]
                                  (go (>! collapse-ch index)))}
                  (if (:collapsed? data)
                    "Collapsed"
                    "Showing")))))

(def init-state [true true true])

(defn form-view [data owner]
  (reify
    om/IInitState
    (init-state [_]
      {:collapsed init-state 
       :collapse-ch (chan)})
    om/IWillMount
    (will-mount [_]
      (let [collapse-ch (om/get-state owner :collapse-ch)]
        (go (loop []
              (let [index (<! collapse-ch)]
                (om/update-state! owner [:collapsed index] not))
              (recur)))))
    om/IRenderState
    (render-state [_ {:keys [collapsed collapse-ch]}]
      (dom/div nil
               (dom/button
                #js {:onClick (fn [_]
                                (om/set-state! owner :collapsed init-state))}
                "Collapse All")
               (apply dom/div nil
                      (map #(om/build field-view {:collapsed? %1}
                                      {:init-state {:index %2
                                                    :collapse-ch collapse-ch}})
                           collapsed
                           (range)))))))

(om/root
  form-view
  app-state
  {:target (. js/document (getElementById "app"))})