Discussion on: State machine advent: One event, two possible state transitions (15/24)

[Joel]

Right, I'm referring in particular to the prefix dot though, didn't see that syntax explained anywhere. Is .warm different to warm in any meaningful way?

[Mikey Stengel]

Ah right. The dot is added (and needed) for the transition to be recognized as an internal transition. We don't want the machine to leave the active state. Instead, we are specifying a relative target (e.g .warm) to transition to the active.cold or active.warm state.

Without the relative target, the machine could think that we are transitioning to a warm state by assuming a state structure like the following and would then fail since the state node does not exist.

interface ThermostatStateSchema {
  states: {
    active: {};
    inactive: {};
    // this one doesn't actually exist since it's a child of active 
    warm: {};
  }
}

[Joel]

Makes sense! Wasn't trivial to figure out without XState experience though :)

[Mikey Stengel]

I'm glad you asked! I couldn't figure out a good way to include it in the post as I found the transition pages of docs the most difficult to grasp and a bit discouraging for beginners.
On day 15 I was also still naive enough to believe I can get away with explaining one concept per day. 😁 Towards the end, I had to ramp up and explain 2-3 things per post to write about most XState features I wanted to cover.

[Joel]

Either way, really happy to have come across your calendar, will make a good basis for me to dive into XState myself!

[Mikey Stengel]

Thank you.
It's a high reward decision for sure!

Let me know if you are struggling with anything and feel free to send me machines for feedback.