DEV Community

Discussion on: State machine advent: Everything you need to master statecharts (24/24)

Collapse
 
gcsalemao7 profile image
Gustavo Carvalho

Hi Mikey, I really liked your article. Finally, a place where the use of state machines is clearly explained.

Do you have an opensource example of an application using Xstate + React? I'm developing an application in React and I still have some doubts about the development standards using Xstate.

For example, I have a General application stage machine that carries general application data and that state machine is responsible for calling the submachines of the other components. However, I am having difficulty managing the application states because I have to make the machines communicate. I would like to see an example of a complete application that has error management, socket and submachines.

Collapse
 
codingdive profile image
Mikey Stengel

Thank you, glad you enjoyed the series.
For examples of child machines, I'd recommend reading the blog posts from day 21 to day 23 with day 22 being the most important one as I explain actor communication in detail.
Error management can be implemented in a variety of ways but what I usually do is to add a dedicated error state that upon entering writes an errorMessage into context.

error: {
  entry: assign({errorMessage: (context, event) => 'There was an error. Here is why.'+ event.data
// using `on: { /* events:  */ }`, we could eithet add a "RETRY" event or immediately transition to another node using a transient transition like this `"": { target: "stateAfterError"}`
}

Likewise, instead of assigning a context, you could also notify a parent machine using sendParent.
Even better, for exception handling with actors, you can also use the new escalate action creator which delegates errors to parent machines. It was just introduced in version 4.7 of XState which is probably why there aren't too many examples of it yet. xstate.js.org/docs/guides/actions....

Unfortunately, I'm also not aware of any example that uses sockets but would love to see one myself. You could implement streams/sockets by invoking callbacks as a service.