Make it easier to pass state objects to events about mercury HOT 10 CLOSED

sounds like your using a triple nested array as a 3d matrix.

I recommend that you do something like

render() {
  h('.foo', { 'data-click': event(events.handler, { pos: [i, j, k] }) }
}

And then do

function handler(state, data) {
  state.arr.get(toIndex(state.pos)).prop.set('foo')
}

from mercury.

An alternative solution is to use more components.

If you put events for a component at state.arr.get(i).get(j).events and you put that list at state.arr.get(i).get(j).list

Then in a component it's own "state" is going to be state.arr.get(i).get(j) and in the event handler you just use event(events.handler, { pos: k }) Then in the handler you just do state.list.get(k).prop.set('foo')

Basically by moving the events hash from the top level to some level inside the state you can effectively prefix everything in the state, rendering & event handlers by some index.

This is using a technique similar to lenses

from mercury.

@Swatinem I added https://github.com/Raynos/mercury/blob/master/docs/faq.md#how-do-i-avoid-deeply-nested-paths--structures to the FAQ to explain in more detail how to avoid this problem.

I hope this is a solution you can use

from mercury.

Yes, that looks really good so far.
But again, I have intermingled the data state and ui state.
When I have a listener on state.arr (or state.calendar in your example), I can’t simply JSON.stringify() and POST that to a server without removing all the events and ui-specific state i added through.
Same thing as I asked in #39

from mercury.

@Swatinem that is correct.

The state that you pass to mercury.app() is the ui state

If you want a seperate data state that you can JSON.stringify & POST you will have to model that explicitely and make the state you pass to mercury.app() be computed from it.

I'll create an example of this.

@Swatinem I actually think this is a seperate question from both #40 and #39

It's basically seperation of serializable state and actual application state

from mercury.

@Swatinem added a placeholder to the FAQ about this ( https://github.com/Raynos/mercury/blob/master/docs/faq.md )

from mercury.

Thanks for taking care of this!

So yes, it is all somehow connected.
And in my component I want both.
Application state (might be local to a component) that toggles a selected tab, or the open state of a dropdown, with event handlers that work on that state.

And serializable state that actually holds my data. And events that work on that particular state.

Both should of course be convenient to use. :-)

from mercury.

Another question: Does observ support references?
With those you can have your serializable state in a different subtree but have references to the items from your application state tree.

from mercury.

@Swatinem what do you mean references ? you can embed an observ in multiple locations.

from mercury.

yes thats what i mean. Like my https://github.com/Swatinem/cow

from mercury.