mattpocock / xstate-catalogue

Professionally designed, interactive state machines
https://xstate-catalogue.com
MIT License
811 stars 62 forks source link

How to showcase machines which are build from multiple machines? #50

Open AleksejDix opened 3 years ago

AleksejDix commented 3 years ago

I have some examples which I want to contribute. They use Actor model to connect multiple machines together.

What would be the best way to show this in the catalogue?

tomByrer commented 3 years ago

It seems this cataloged is focused on practical uses, not theoretical. So what do you have that solves real-world programming issue?

AleksejDix commented 3 years ago

For Example, a shopping card consists of 1 or an infinite amount of machines. This is a very practical use.

Each Shooping Cart can create a CartItem and has its own state, where it stores cart items in the context as a spawned machines. The states of the cart might be

states

  1. noItems
  2. someItems

context cartItems

Every cart item has its own state and it cretead with the same CartItem machine.

context

  1. quntity
  2. SKU / Product to sell

states

  1. overOne
  2. zero

Then communicate by sending events with messages to each other via actor model.

This is a very tiny example. Imagine you are building an entire system with connected machines which will represent your final App. Business logic will stay in xState everything else will live in the framework of your choice.

mattpocock commented 3 years ago

@AleksejDix For sure - I have to do some thinking about how to visualise 'n' children of a machine.

Another example might be a file uploader where each file is represented by a machine.

AleksejDix commented 3 years ago

Even form validation is usually an machine orchestration. I have some demos to contribute. But they all require this feature. Waiting for an idea 💡

Form validation. Shopping cart. App notifications.