Clojurians Log v2
re-frame
Hmm. I'm starting a new project (fairly simple, but my first cljs or re-frame project in many years) and trying to get a re-com tree-select component running, which more or less looks like this:
(defn topic-selector []
(let [doc-choices @(re-frame/subscribe [::subs/document-choices])
selected-docs @(re-frame/subscribe [::subs/selected-documents])]
(println doc-choices)
(println selected-docs) ;; for junky debugging cross-referenced with 10x
[re-com/tree-select
:choices doc-choices
:model selected-docs
...
:on-change (fn [choice-ids group-vectors]
(re-frame/dispatch [::events/set-selected-documents choice-ids])
)
:initial-expanded-groups :all]))selected-docs is correctly updated.
But the :model field does not get updated and the component neither re-renders or actually updates (for example, clicking on a different box sends a new message and selects a document as if the :model was still empty--all check boxes are always empty no matter what is clicked even though the set-selected-documents event is firing with the correct choice)
I had thought that by subscribing, the component would be correctly re-rendered when the subscriptions change. I do note in the documentation that the :on-change member "is responsible for changing the :model as needed" and in the demo in fact directly sets a model atom (`#(reset! model %1)`) which ... doesn't sound very re-framey to me.
Fairly noob to re-frame. Am I missing something incredibly obvious or is the tree-select component not ready for use in this way? I could do as the demo and define a component-specific atom, but that feels like it goes against the "app data in one db" mode of re-frame. Halp?
Hey, thanks for trying this out. Nested-grid is in alpha, but I think we can make it work for you here. Re-com is actually designed to work independently of re-frame - that's why the demos don't call re-frame at all.
Your code looks like it should work, though. As a sanity check, I'd make sure selected-docs is a clojure set, both before and after dispatching your ::set-selected-documents event.
If you can publish a minimal reproduction, I'd be happy to do more bug hunting on it. It could be a branch on re-frame or re-com.
Hmm, thanks, Kimo. Again it's been a real long time since doing any front-end (and I'm rewriting this from a try at elm) so it could be something truly simplistic. I'm using re-com 2.21.4, re-frame-10x 1.9.3, re-frame 1.4.2.
It looks like selected-docs is a clojure set, in that the new-docs argument in the event function
(re-frame/reg-event-db
::set-selected-documents
(fn-traced [db [_ new-docs]]
(assoc-in db [:ui :selected-documents] new-docs)
))#{0 3} so I think that's right. And the debug (println selected-docs) in the above corroborates this ("#{0 3}") as I click so I think that's correct.
let me try to zip something upUgh; not sure the best way to distribute since this isn't in a repo yet, but you can get the idea from the attached (have to manually install react with npm install react react-dom and then npx shadow-cljs watch app but I removed some things so the formatting is severely borked.
But it does roughly show the same behaviour (folding works, signals seem to work, model doesn't seem to update). Sorry about the attachment; still learning what belongs in the project and what doesn't.
As a minor: the tree-select docs say it needs an id-fn member, but it doesn't seem to take one and just relies on :id; did I miss something or should I raise an issue?
(also, just plain thanks; it looks like a very useful lib so I'm sorry my first interaction is confusion)
@kimo741 Seems to be the case of the "rookie mistake" from here: https://github.com/reagent-project/reagent/blob/master/doc/CreatingReagentComponents.md#form-2--a-function-returning-a-function
I don't see tree-select mentioning the model argument in the inner function's arguments.
@vputz A workaround would be to not use @ with selected-docs and just feed the component that subscription ratom.
That seems to work! Thanks; I can chug ahead now. Really appreciate it!
Note that initial-expanded-groups also has this issue.
And r/with-let is quite nice. ;)
yes, that prop is non-reactive on purpose
I wouldn't call it "non-reactive". More like "not susceptible to any updates after the first render".
So if anyone has the :initial-expanded-groups property be controlled by some other data, it won't work. So there's no way to programmatically expand/collapse groups. I don't know if it's a desirable property though - I don't use the up-to-date version of re-com so just spitting out thoughts.
Hmm... while I don't immediately see a reason, it certainly could be that the base source for everything could be changed (in this case I'm choosing documents from topics for RAG, so you could imagine a totally new document tree being picked from)---and in that case, where :choices could change, there's maybe a case for changing :initial-expanded-groups.
Looks like the missing :id-fn is fixed in master as well; look forward to the new release!