This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2016-07-27
Channels
- # admin-announcements (1)
- # aws-lambda (2)
- # beginners (48)
- # boot (231)
- # capetown (1)
- # cider (35)
- # cljs-dev (25)
- # cljsrn (74)
- # clojure (273)
- # clojure-austin (2)
- # clojure-berlin (5)
- # clojure-hk (1)
- # clojure-poland (1)
- # clojure-russia (50)
- # clojure-spec (63)
- # clojure-uk (58)
- # clojurescript (51)
- # cursive (5)
- # datomic (39)
- # defnpodcast (3)
- # dirac (13)
- # editors (6)
- # emacs (3)
- # hoplon (86)
- # jobs (2)
- # lein-figwheel (1)
- # liberator (3)
- # off-topic (10)
- # om (113)
- # onyx (34)
- # protorepl (29)
- # re-frame (2)
- # reagent (8)
- # remote-jobs (1)
- # ring (4)
- # test-check (42)
- # untangled (31)
- # yada (2)
i have a question that is om/react interop related. I want to select all input characters but i do not know how i can translate the js code
this.refs['myinput'].select()
into clojurescript. I make use of the "ref String Attribute"
(dom/input #js {:ref "myinput"
:onFocus (fn [_] -code-here- )})
@thomasdeutsch: I’m pretty sure you can do that like so, but I haven’t tested this: (.select (om/get-node owner “myinput”))
i would expect this to work: (.. this -refs -minInput select)
, but it does not work.
@thomasdeutsch: does it work in JS?
or you wanted just a simple translation of your snippet?
(.select (om.dom/node this “myinput”))
should work, no?
yes, it does work... strange. Thank you @anmonteiro
depending whether the select
function is the DOM node function or a component function, use mine or @petterik ’s suggestion, respectively
Ok so I just discovered that elements that update local component state in a for loop tend to rerender. Trying to do variable amount of text fields with input-validation. The text field keeps going out of focus or becoming empty. The same setup without a for loop, works fine.
Also happens with map
, as soon as I add (update-state! this ....) for :on-change in text input field. The focus will randomly leave the text field (anytime the textfield is inside a sequence).
Is it incorrect to list the same key twice in a component's query? Potentially as two joins with different subqueries?
I notice it doesn't appear to throw any errors, but I'm not sure what it the behavior ought to be.
@peeja: what’s the use case?
I’m actually not sure if calling db->tree
on such a query would be additive or just execute one of them
No use case, but I'm picking out a join child from the ast, and I noticed that I could cause there to be more than one with the same :dispatch-key
.
pretty sure it won’t be additive because of this: https://github.com/omcljs/om/blob/master/src/main/om/next.cljs#L1505
it doesn’t throw, though
I’m not sure how it should be played with. probably something to think about when spec has parity with clojure? 🙂
exactly
yeeees! Fuck, dont make my mistake and have a random react-key generator inside a sequence. 🙂
Let's say I want to show a person's name and the names of their friends. I query for [{[person/by-id 1] [:person/name {:person/friends [:person/name]}]}]
. But all I have is a REST API for Person, which returns the person's name and the ids of their friends. Even when I translate those ids into idents, they're idents pointing at people which I have yet to fetch, so om/db->tree
leaves their data out when I read the key.
@peeja: I’d say override :merge
in the reconciler
I'm not sure I follow. The app state looks correct, except that the data for each friend hasn't been fetched yet.
So, I've got {:person/by-id {1 {:person/name "Joe" :person/friends [[person/by-id 2] [person/by-id 3]]}}}
(defn overridden-merge [reconciler state res query]
;; next is the next app state
(let [{:keys [next] :as om-merge} (om/default-merge reconciler state res query)]
(if (every-person-ident-is-mapped-to-a-person-in-the-db?)
om-merge
(go-fetch-those-missing-people)))
@peeja: something like that ^
so that function would need to gather-sends
and schedule-sends!
@peeja: the other alternative is to just inspect the result that you get in the send function
and only ever call the callback whenever you know you have all the data
Although, that's a pretty big pain (in both cases) if this isn't about fetching more people
so a multimethod should get you covered
@peeja: so a solution to your problem would be to dispatch on the remote in the send function
if you’re fetching people, use the :people-remote
remote
if you’re fetching pets, use some other, could be the :remote
default
then dispatch on that in your send function
Yeah, that's what I'm doing, but now I'm in the :people-remote
send
and I need to fetch each pet
call send
directly? 🙂
yeah, I understand it might not be the best option
I mean, ideally I'd like to be able to rely on the parser logic to map me back to the correct remote
@peeja: so the merge
option should work for that case
om.next/gather-sends
will defer to the parser
probably not
@peeja: so all it does is call the parser for the given remotes with the third argument set to that remote
and return a map with {:remote *remote-query*}
you’d probably need to do something like that
gather-sends, queue them and schedule
I guess I'm surprised it takes this much going off road. I would have expected something like this to be a pretty normal use case. Am I doing something wrong?
OK there might be another way around this
I just don’t have the full picture so kinda hard to tell what you really want
but here’s another alternative:
override the merge
function anyways, but queue the keys you need to obtain from the remote for re-reading
by keys I also mean idents
I think ideally, any time there's an ident in my query result with no local value, I want to read it from the parser
but I’m not sure if that will perform the sends
add-root!
, transact!
, set-query!
Part of what's bugging me is that db->tree
silently drops the idents it can't dereference
I'd really like to trigger the sends when the read
tries to return the person and finds there are idents it can't dereference yet
For instance, the server may respond with idents for things that my UI doesn't actually care about
@peeja: so you just need a different heuristic in your read function, it seems
for knowing when to return :remote
or not
So, when I read :person/by-id
and I get a person with pets which aren't present locally, I need to use the :pets
remote from there.
Which gets back to what I was saying before: if db->tree
could tell me that it was missing records for certain idents, it would help a lot.
I think that just falls out of the scope of db->tree
That's fair, I'd just like to find a way to make this work without re-implementing db->tree
Oh, I had it in my head that db->tree
replaced broken-link idents with nil
, but it actually leaves them as they are. So maybe I can just find them after db->tree
has had its way.
It occurs to me that just recursing in the parser instead of using db->tree
at all would probably make it work correctly. The issue I'm having is that only the root key's read
implementation gets a chance to invoke a remote. If you call the parser recursively, each level gets to add remote sends. Unless I'm missing something?
But I've been warned off calling the parser recursively, so maybe I am missing something…
@peeja: you don’t get to add remote sends on each recursive call, only the top level counts as you’d expect from a recursive invocation
That just sounds more sensible to me than db->tree
. Each ident type gets to define its remote fetching logic
might be a good option for your use case as it allows more fine-grained control
probably, but to be fair I have yet to write an Om Next application that deals with a REST API
@anmonteiro: a few days ago you answered my question about css-transition-group. I didn’t have chance to play with it until today. Still can’t figure it out. Do you have a working snippet somewhere? Thanks
@ag: never used it, mind posting a failing case so I can try to fix it?
hmmm. I can’t say I’m failing - yet have to learn how to make it fail 🙂 Alright, let me play with it, maybe I’ll find how to make it work.
this for example doesn’t seem to work:
(defn css-transition-group
"Create dom entrance and exit animations. Ensure that you have a unique :key
property set on each component/dom-element that you pass as a body"
[opts body]
(let [group (.. js/React -addons -CSSTransitionGroup)]
(js/React.createElement group (clj->js opts) (clj->js body))))
(def cpt
(om/factory
(ui
Object
(render [this]
(css-transition-group {:transitionName "bar"
:transitionLeaveTimeout 2000
:transitionEnterTimeout 2000}
(dom/h1 #js {:key "one"} "One"))))))
(defcard css-grp
(cpt nil))
@ag: that snippet renders for me
was that not the problem?
@ag: working for me
did you add the CSS?
let me get a snippet together
(defn css-transition-group
"Create dom entrance and exit animations. Ensure that you have a unique :key
property set on each component/dom-element that you pass as a body"
[opts body]
(let [group (.. js/React -addons -CSSTransitionGroup)]
(js/React.createElement group (clj->js opts) (clj->js body))))
(def st (atom ["ONE"]))
(defui cpt
Object
(render [this]
(let [lst (om/props this)]
(dom/div nil
(css-transition-group {:transitionName "bar"
:transitionLeaveTimeout 2000
:transitionEnterTimeout 2000
:transitionAppear true
:transitionAppearTimeout 2000}
(map-indexed (fn [idx item]
(dom/h1 #js {:key (str idx)} item)) lst))
(dom/button #js {:onClick #(swap! st conj (str "ITEM-" (rand-int 10)))})))))
(def reconciler (om/reconciler {:state st}))
(defcard css-grp
(dom-node (fn [_ node]
(om/add-root! reconciler cpt node))))
CSS:
.bar-appear {
opacity: 0.01;
}
.bar-appear.bar-appear-active {
opacity: 1;
transition: opacity .5s ease-in;
}
.bar-enter {
opacity: 0.01;
}
.bar-enter.bar-enter-active {
opacity: 1;
transition: opacity .5s ease-in;
}