Actions that return actions OR actions-with-payloads

[zaceno]

Say I have some component, which takes a property which it expects to be dispatchable (an action or action with payload):

...
h('div', {onclick: props.onexplode})
...

now imagine there is another onclick handler higher up in the component, and we want to stop propagation of this event. No problem we can easily:

h('div', {
  onclick: (_, event) => {
    event.stopPropagation()
    return props.onexplode
  }
})

That works fine if props.onexplode is an action with a custom payload, or if it is a bare action which doesn't care about the payload. But since this is a generic component, it should work also for actions which are expecting the default (event) payload. So we:

h('div', {
  onclick: (_, event) => {
    event.stopPropagation()
    return [props.onexplode, event]
  }
})

Ideally, the above would do the expected thing regardless of the type of dispatchable that onexplode is set to.

A) If it is [SomeAction, 42] then SomeAction will be dispatched with 42 as the payload
B) If it is just SomeAction then SomeAction will be dispatched with the event object as payload.

Unfortunately it seems in the case of A, that it is seen as an expression of [state, effects] and we get a runtime error.

Not sure if this can easily be solved or if it would have ramifications but I wanted to bring this to light anyway. It's not a huge deal (why I made a discussion rather than an issue of it) because it can be worked around:

h('div', {
  onclick: (_, event) => {
    event.stopPropagation()
    if (Array.isArray(props.onexplode) return props.onexplode
    return [props.onexplode, event]
  }
})

That's not too bad, just a little inelegant.

Thoughts?