Open dschnare opened 5 years ago
This will be tricky. My understanding is that an internal transition is only available to sibling states. In xstate, you use the dot character to indicate that.
But we use IDs everywhere, so it won’t be obvious that you can’t target non-siblings.
This will need some thought before we attempt an implementation.
Ideally we will have a real world use case first to drive this through.
I ran into a potential use case for this. I needed the state to still change (therefore React to eventually re-render) without leaving and re-entering the state (I didn't want the callback to be called again -- I only wanted the "state" to change).
E.g.:
Loading First Thing
updated caption -> ^Loading First Thing
success -> Loading Second Thing
Loading Second Thing
updated caption -> ^Loading Second Thing
success -> Done
Done
and in Loading First Thing.js
:
export async function (evt, send) {
data.loadingCaption = 'Loading first thing...'
send('updated caption')
data.stuff = await loadFirstThing()
send('success')
}
and in Loading Second Thing.js
:
export async function (evt, send) {
data.loadingCaption = 'Loading second thing...'
send('updated caption')
data.stuff2 = await loadSecondThing()
send('success')
}
Currently I have to split out the caption update stuff into its own state. It's explicit and correct, but lengthy... this is what i have to do now:
Loading First Thing Caption Update
updated caption -> Loading First Thing
Loading First Thing
success -> Loading Second Thing Caption Update
Loading Second Thing Caption Update
updated caption -> Loading Second Thing
Loading Second Thing
success -> Done
Done
and a callback file for each
See: https://xstate.js.org/docs/guides/transitions.html#internal-transitions
Perhaps we add a new operator to signal the transition should be internal? This is not just an XState only thing, this is also supported by the SCXML spec.
I don't know what the character would be. Maybe hat
^
?Only reason I suggest we consider this is this could give the statechart author greater control over component redraws.