This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2017-01-20
Channels
- # arachne (11)
- # aws (2)
- # beginners (33)
- # boot (167)
- # cider (71)
- # clara (2)
- # cljs-dev (28)
- # cljsrn (3)
- # clojars (1)
- # clojure (83)
- # clojure-austin (21)
- # clojure-dev (24)
- # clojure-russia (19)
- # clojure-spec (33)
- # clojure-uk (108)
- # clojurescript (114)
- # component (1)
- # core-async (1)
- # cursive (7)
- # datomic (13)
- # editors (1)
- # emacs (15)
- # hoplon (10)
- # lein-figwheel (4)
- # leiningen (3)
- # mount (2)
- # om (134)
- # om-next (4)
- # onyx (42)
- # pedestal (41)
- # quil (2)
- # re-frame (29)
- # reagent (4)
- # remote-jobs (6)
- # ring-swagger (5)
- # untangled (9)
If I want some data for component in the state, but I don’t want to add that piece of data to the global app state in reconciler.state
, and I’m not using Untangled, so I can’t use uc/InitialAppState
protocol, what would be the best/right way of injecting some data related to component from within the component body (I don’t want it to be somewhere else, since it’s used in the component)
One way that comes to my mind is to transact this thing right before component mounts, but that slightly complicates things, innit?
@ag sounds like you're looking for component local state
I want every instance of the component to be able to pull that data from the state and use it
I don't understand what you're asking then
seems like you want is relatively common - just declare that property in the query and grab it in the parser?
so let’s say I want a view with a table and I specifically want columns-definitions of that table in the state (so other instances of the table component can use the col-defs)
if I just use read method and then return that data from it all the time, then I can’t “generalize" column definitions for multiple tables. I want them to be normalized
sorry for confusing you. basically I need something similar to Untangled’s initial-state
but without the composition part
I still don't understand what you want specifically that is not possible to do currently
if you want to add stuff to the app-state, transact!
a mutation
if you want to have data in the app state initially, just pass that to the reconciler's :state
if sometimes I need data that I’m 100% sure will not be needed to trigger a re-render
componentWillMount + transact is OK (I think) - I’m sure I’ve done it more than once and haven’t noticed problems
all of my om.next experience is on React Native but I assume more or less the same in the browser
in fact, triggering a re-render as you’re changing them might only make the animation choppy or not perform well
I saw no point of putting those values inside the main application state (atom …) not that it cannot be done under a separate key; but they really feel “separate” and putting them together with the data that actually triggers re-renders would be, imho, complecting two things
you can always use :shared
...
tbh, this probably does not apply to the browser at all, just wanted to explain my reasoning 🙂
hold on, isn’t https://github.com/omcljs/om/wiki/Documentation-(om.next)#react-set-state for something like that
@anmonteiro I don’t think I knew about shared when I made that decision but you’re probably right 🙂
@anmonteiro I learned about om/computed a few days ago!!! I was like “OMG” haha
it is indeed useful
I don't think any Om contributor has time to work on tutorials right now
but a blog post explaining that would probably be helpful?
if you already have a blog set up, etc.
yes, on a free day I would write a thing about it… it’s really a more of an “advanced” feature, a paragraph would be more than enough
but that’s bad, since (I think) then it just triggers a re-render every single time (I think)? or it doesn’t actually trigger, I don’t remember
the problem that computed
solves is that on re-render your props will disappear if they're not part of the query
can't remember. I don't think it does
one indication of good software is when you keep discovering over time features that solve your subtle problems 🙂
Hi, Would you recommend starting a new project with untangled ? Are there any disadvantages to using untangled instead of just om.next ?
What is the best way to prevent a mutation from occurring twice?
@viebel any more context? I would answer 'not running it twice'..
Make sure any side effects are in the :action thunk, not in the parser fn body
@danielstockton Here is the full context: http://app.klipse.tech/?cljs_in.gist=viebel/c1bc2413ae680833482b399cb7d2ae44&container
If you press the button, and open the browser console, you’ll see twice the printing of “mutate"
That's normal viebel, which is why you put side effects in the :action key
let me try
ok. it works. thx @danielstockton
Is it ever ok to use (.forceUpdate this)
? I have a sidebar which updates the query on a parent (filter, search options...) and unless the props change, it doesn't re-render with the new options. I found (.forceUpdate this)
fixes it, in componentWillRecieveProps.
@viebel is this klipse.tech your own personal gist or can anyone paste (or embed) their own gists and make a link like that?
anyone can embed their own gist with the cljs_in.gist
url param
all the url params are documented here: https://github.com/viebel/klipse/blob/master/repl.md
Waiting for your gist @hlolli ...
(don’t forget the container=1
url param!!)
I've never made a github gist, just tried pasting some random cljs gist and it worked. But Im not gonna keep you waiting, I make one gist, 5 mins...
@viebel higly buggy and incomplete input-masker http://app.klipse.tech/?cljs_in.gist=hlolli/8d4c080edb803e4f1ff4f27782a0a8d1&container=1
Nice one @hlolli
I hope people will start using this interactive gist system for sharing stuff or asking questions on this channel 😃
yes, basically why doesnt my code work + someone edits the code = no miscommunication*fun
I have in klipse's backlog the idea of allowing people to save/fork gists directly from klipse so it will be even more fun
I see myself wanting to make my own browser text editor, then I can take my nerdy powers into parties without laptop and show off my cljs skills 😄
If I in my UI I have a component whose query returns a {:remote true}
because state is missing, do I expect that component to mount after that novelty has been received or before?
@tmulvaney it probably depends if its the root component or rendered conditionally
I believe it will mount before the novelty is received then
Yeah thats what i'm seeing. It's only annoying because the component has an ident which obviously can't be satisfied until the novelty comes in.
Actually no, mine mounts after receiving props, you must be returning {:value nil} from your parser?
forget that, mine is only not nil because i pass some computed props through from my wrapper
i think it is normal, what you're seeing
Yeah it wasn't a problem for me earlier as the entry point was always the index page
you should be able to place this component deeper in the tree and render it conditionally based on the presence of the needed props?
are you trying to build a detail view for some object?
Yeah but the issue is the page is already rendered, so the component that was rendered by the server will disappear while novely is being fetched to render the same thing
I don't have any experience in server side rendering, i know that for a detail page i worked on recently, i wrapped the component with an ident with another component that didnt have an ident, with a (when props
clause in render
are you using foam? isnt there a way to bootstrap the app-state so it doesn't make the remote call?
No I'm using om.next's server side rendering. Quite fancy, and so far trivial to get rendering.
So I think I can get around this if I get the initial root query and then somehow gave that to the reconciler, then after reconciliation mount the app so all the initial state is set. But I don't know if there are fns exist for A) passing the initial query to the reconciler and B) checking if reconciliation is complete. I could also be completely off track as to how I think i should be solving this. This seems to be the Relay approach when doing server side rendering.
om next quiz of the day:
How do I get C props: {:data-3 {:e 5 :f 6}}
displayed on the page via joins?
http://app.klipse.tech/?cljs_in.gist=hlolli/7a2a2b4c86f98f35de85156e20731108&container=1
❓ if I transact something that adds data into the state (in denormalized form, in componentWIllMount) should I expect things to be normalized automatically, if in the Root component I have a query with the correct ident?
the simple answer is no.
but it depends where your data is coming from
if you have :normalize true
in the reconciler and your data is coming from a remote, it'll probably get normalized
so how do I force data normalization, when I mutate state? e.g. I need to add :users/by-id :Phil
, to :users
, how do I do that?
transact and normalize All the :users
and then update the state? i.e. assoc @state :users (:users normalized) :users/by-id (:users/by-id normalized)
?
@ag normalize that data yourself with either tree->db
or manually
@anmonteiro can’t think of better way:
(defn normalize-into-state
"normalizes given data by applying om/tree->db
then merges it to the state
and properly updates :om.next/tables"
[state query data]
(let [normalized (om/tree->db query data true)]
(-> state
(merge state (dissoc normalized :om.next/tables))
(assoc :om.next/tables
(apply clojure.set/union (map :om.next/tables [state normalized]))))))
notice that'll overwrite any properties you may already have in state
well, technically it should overwrite only the data being normalized, so if say I’m applying :app.users
(with the right query) it should replace :app.users
and every :app.user/by-id
@ag I don't know what your use case is, but what I'm saying is if you have data in :app.user/by-id
already it'll get overwritten with the new one