Clojurians Log v2
hyperfiddle
Last night I tried to make a nested tree picker component using v3 that returns the id of the most recently clicked child node by passing back its id when the text is clicked.
I am trying to use the return node values instead of passing down atoms or callbacks that update the parent node's value (this seems more electrical?), but I can't quite figure out how to deal with the nested return values and only extract the latest value.
(edit: posted snippet in thread – could not add snippet to edited message)
When I click on a node, I get back a top-level value like [nil [nil nil] nil [nil [:child3-a nil] nil nil]], but I only want the latest value.
I tried a variety of conditional returns and e/When, (which returns (e/amb) on nil) as well as forms/LatestEdit, but I can't quite figure out how to deal with "nested value streams."
Maybe Form! is the right thing here, but Form! emits a <form> element which messes with my layout.
Is this the right way to approach a tree picker in v3?
I just skimmed through, but if you
• drop the (when (seq children)) conditional and put the e/for-by only
• change the when-let on click to use an e/When
then you are close. The problem is clicks need to return a value until consumed. I.e. if you click on 2 nodes you still only want 1 value. Which implies state.
Tokens match the "return value until acknowledged" pattern
@xifi thx. I only want dom/ul to render when a node has children, otherwise childless nodes have a nested <ul>, which can affect layout (although does not with my current CSS).
Ah, so I need to return an e/Token from TreeNode* along with id, e.g. [t id] for consumption at the caller?
e/Token is really meant for forms that transact to the server, i.e. there are busy, success, failure, retry affordances
I would start with a client-only picker, which can emit it's current state as a value
So what you want is to return the most recently clicked thing as a value, one easy way to model that is an atom, have each of your dom/On things write to a shared atom
example of a dom/On which writes to an atom - https://electric.hyperfiddle.net/tutorial/system_properties
example of what NOT to do - https://electric.hyperfiddle.net/tutorial/temperature2 - this demo collects multiple values in superposition using e/amb, that is not what a picker does, a picker returns only one
i think you've seen the typeahead from the tutorial before, note the reset! on L28 which is inside the e/for
that typeahead picker is very nearly the structure of a treepicker, just flattened, right? pick from a list of options vs a tree of options
it even has the ul/li structure, just not recursive
i recommend you type that in and master it, before moving on to the recursive case (which will be quite straightforward once you have the flat version)
Thanks 🙂 So that's actually what I was doing before (I had a working tree picker I ported from my accounting system from v2), but I figured the signal flow might be more "idiomatic".
you did well to consider, really the essence of this problem is how to encode "most recent selection" and the best answer that comes to mind is racing writes into an atom
there may be a better encoding
in fact, in missionary "most recent" is the discard operation, so i would look into racing a set of discrete flows into a single continuous flow with discard as the merge operator
I think the atom is perfectly idiomatic though, electric-level solutions are definitely preferred
I’m seeing a new problem with electric-fiddle (commit 115f20b).
For both the index page and a couple of example pages that I have tried, the UI comes up and works, but after about 10 seconds the UI is replaced with a blank page and I get an error message in the console.
See thread for details.
This is the console error message.
that's a new one, hmm
just to be clear, you have not made any local changes to electric-fiddle?
That’s right — no local changes
ok, can repro, i bet it's the datomic thing
i can deal with it now
pull latest, i think its fixed
sorry
Yes, that’s fixed it — thanks