This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2015-10-17
Channels
- # admin-announcements (16)
- # beginners (1)
- # boot (7)
- # business (1)
- # cljs-dev (1)
- # clojure (119)
- # clojure-dev (2)
- # clojure-germany (1)
- # clojure-za (4)
- # clojurescript (73)
- # cursive (3)
- # datomic (2)
- # devcards (8)
- # editors (1)
- # events (1)
- # funcool (1)
- # ldnclj (3)
- # liberator (1)
- # off-topic (1)
- # om (52)
- # onyx (1)
- # re-frame (5)
- # reagent (28)
@anmonteiro: seems like the way we talked about it yesterday works. reader:
(defmethod read :app
[{:keys [state] :as env} key params]
(let [app (@app-state :app)]
{:value (map #(hash-map (nth % 0) (select-keys app (nth % 1))) (seq params))}))
root view
(defui RootComponent
static om/IQueryParams
(params [this]
{:codemirror-query (om/get-query CodemirrorComponent)})
static om/IQuery
(query [this]
'[(:app {:codemirror-query ?codemirror-query})])
codemirror
(defui CodemirrorComponent
static om/IQuery
(query [this]
[:codemirror])
I'm getting a :codemirror-query
element back that I'm then passing to the component itself
hi @dnolen will the remote sync tutorial also cover how to sync a datascript/global atom with datomic? For example if I wanted to design components using datascript for state and then persisting it to a datomic database
@zenleaf: there is already some work done on datomic integration in this repo: https://github.com/swannodette/om-next-demo/blob/master/todomvc/src/clj/todomvc/datomic.clj
in the datascript tutorial, how do i use (om/from-history reconciler #uuid "...")
to actually go back to that state? (reset! {:state reconciler} (om/from-history ...))
doesn't change the UI for me
@dvcrn I think you're still overcomplicating 馃槈
give me 10 min to tweak that for you
@dvcrn: alright so it seems to me that this is a lot less code:
(defmethod read :app
[{:keys [state selector] :as env} key params]
;; why use @app-state here? you should be using state from env
{:value (get-in @state (into [key] selector))})
(defui CodemirrorComponent
static om/IQuery
(query [this]
'[:codemirror]))
(defui RootComponent
static om/IQuery
(query [this]
[{:app (om/get-query CodemirrorComponent)}]))
also it's what I meant in the first place 馃槢
@anmonteiro: just tried that but getting Uncaught Error: No method in multimethod 'namespace.core/read' for dispatch value: :codemirror
. Seems like it's not actually filtering :app
plus it seems like I'm loosing the ability to differentiate which component requested which piece of state
with my code above, the resulting :app
prop looks something like {:app {:codemirror-query {:codemirror mooo}}}
, so I can easily pass only the :codemirror-query piece to the codemirror component and nothing else
But I don't think that's the intended way of doing things
I don't think params are supposed to contain queries
also it seems like with your code I get the data only and not the key-representation of it inside (om/props this)
. Looks something like {:app mooo}
in a speedy test where mooo
is the value of the codemirror state. And as soon as I change the CodemirrorComponent query to '[:codemirror :window])
, the RootComponent doesn't render anymore
that makes me wonder. If the reader returns {:value "foo"}
only, how is the component supposed to know which query fetched that kind of data when everything is just being passed into the props. Is {:value {:somekey "foo"}}
actually a 'acceptable' way of doing things? If yes, why not add a separate :key
field.
I've noticed that, it was not supposed to work like that
it's a bug in my example
so should the reader actually return the key as well so we have it inside props? Or just the value
it depends on the queries
i think it should return with keys, yes, in the root component
but then this root will pass only the values to its children
makes sense?
mhmm kind of. But we need to pass the key anyway in the (hello {:title "Hello, world!"})
way, right? Or what do you mean by passing 'only the values'
man, wrapping my head around the om-ey
way in next probably gave me the most question marks for anything I learned so far 馃槢
have you tried reading this? http://docs.datomic.com/pull.html
this helped me immensely
I didn't. Looking at datomic was on my todo list but wanted to understand the fundamental concept with a testapp first
that covers only the syntax
what i meant by passing only the values is if your ChildComponent requests [:foo] then your rootcomponent will pass (:foo (om/props this)) to ChildComponent
isn't that what I did with my code above? I collect what the childcomponent wants ([:foo]) inside a custom map key (:child-name) and only give the childcomponent the contents of that map
hmm. do you maybe have some next code that uses the app-state atom you are hacking on right now that I could peek into?
I'll eat my way through that datomic pull docs now and see if it makes things a bit clearer
it'd be probably best if you looked into om-next-demo: https://github.com/swannodette/om-next-demo
as my way of doing things might not be the intended way
(defui Todos
static om/IQueryParams
(params [this]
{:todo-item (om/get-query item/TodoItem)})
static om/IQuery
(query [this]
'[{:todos/list ?todo-item}])
this looks super familiar 馃槢it's kinda different from what you're doing, though isn't it?
because he's specifying the keys in the todos/list he wants
you're returning a value with a new key that was the param name or something like that 馃槢
Hey @danielsz This morning I was just about to look into getting the om-next-demo running with boot-clj and your https://github.com/danielsz/system.
@anmonteiro: I'm currently re-doing my mini sample with how that omdemo is done and have more questions 馃槢 He is defining a very generic reader:
(defmethod read :default
[{:keys [state]} k _]
(let [st @state] ;; CACHING!!!
(if (contains? st k)
{:value (get st k)}
{:remote true})))
Then in the actual todo component (https://github.com/swannodette/om-next-demo/blob/master/todomvc/src/cljs/todomvc/core.cljs#L54), he is using the mapping syntax. I copied it like this:
(defui RootComponent
static om/IQueryParams
(params [this]
{:codemirror (om/get-query CodemirrorComponent)})
static om/IQuery
(query [this]
'[{:codemirror ?codemirror}])
my CodemirrorComponent asks for the state element :window
only for testing purposes
but because I used {:codemirror}
the reader with the key :codemirror
is being called, which I don't want. I just want the rootcomponent to use the subquery to retrieve the element and store it inside :codemirror
in props so that I can pass it to the codemirror component.
If I change the query to '?subquery
(for pull syntax 'list', to just pass the query upwards), it is getting the state properties correctly, but again - I don't know which component requested what and have to pass the result of all requested state to every component.
(Plus I'm getting the ugly Uncaught #error {:message "No queries exist for component path
). ok, I got something that works and I am happy with:
I use the pull mapping syntax '[{:codemirror ?codemirror}])
like written above. My default reader changed to this:
(defmethod read :default
[{:keys [state selector]} k _]
(let [st @state]
{:value (select-keys st selector)}))
it will resolve the selector
and always return the map like so: {:key {k/v result from querying state with passed selector}}
. In my case it would look like this: {:codemirror {:window "foo"}}
because codemirror passed [:window]
as selector. Now I can use this information to pass everything under :codemirror
into the codemirror component and as a result the component receives only what it wanted (`:window`)
Please let me know if this is not the intended way either. The final result using this approach looks like this: https://github.com/dvcrn/dmedit/blob/master/src_front/dmedit_om/core.cljs#L42-L52@dnolen: how do you run your om-next-demo? I'm doing "lein run -m clojure.main script/brepl.clj" and then in a REPL: (require '[todomvc.core :as cc]) (cc/dev-start)