That worked for one element! I now stumbled across a different problem with a collection inside a collection. I read all the wiki and i am stumped. I have (defc app-state {:components [{:id "b1" :caption "blah"} {:id "b2" }]}) And (defelem cbutton [att c] (div :id (:id att) (text (:caption att))) I tried both doing loop-tpl [c app-state] and loop-tpl [c (:components app-state)] as well as two loop-tpl: (Loop-tpl [c1 app-state] (Loop-tpl [c2 c1] ... And none of these approaches worked. I'm essentially trying to create a cbutton for each element in :components and then, when I update components I want the button to be updated. For example if I change the caption or if I remove the button from the collection, I want the UI to be updated. Thank you so much and apologies if this is really obvious, I read all the docs and tried multiple ways.
If you think this is the wrong way to model the app state I'm glad to listen to any feedback.
@geo.ciobanu you probably want to break the state into much smaller bits and then wire those small bits into a larger bit (if needed)
also loop/for-tpl on a map needs destructuring
you really dont want a large global app state
for many reasons
mostly because a large state with many things watching it will have negative performance impacts on the graph
where small independent bits will have a more localized effect on your application
Thank you @flyboarder. I can break it up into subcategories but the components collection for example will have elements added and removed as the user adds/removes items from the GUI.
yeah so I would keep that as a vector in it’s own state
Will do.
basically a list of components (defc components [])
Yup!
that will also make your for-tpl or loop-tpl easier
And thanks for the destructuring tip, I can't believe I missed that
also you dont want to nest -tpl blocks
since they return formula cells, you need an element in between them
Makes sense.
Thank you!
no prob!