This course has been updated! We now recommend you take the State Machines in JavaScript with XState, v2 course.
Transcript from the "History States Exercise" Lesson
[00:00:00]
>> What we're going to do is, we're going to use history states in order to remember the last state that we were in. So, just to show you a little preview. The way that we define a history state is, let's say that we have a machine over here, const someMachine = createMachine and initial something.hist.
[00:00:31] And so, we could say states, say something. And let's have another somethingElse state, so somethingElse. So, imagine that this something state has nested states, so initial one, states one, two, and also we have a hist state. In order to define this hist state as a history state, we give it a type of history.
[00:01:04] And this is going to tell x state, this is a special, what's called a pseudo state that says go to the last visited state or by default, the initial state. So, somethingElse, so on, TOGGLE, and then we'll just go back to something.hist. And so we could go to something here, and TOGGLE between these two.
[00:01:26] So, your goal in this is to use history states, over here, and we are going to go to the last visible states when we turn back on. So you're going to change this TURN_ON to go directly to a history state, visible. And we also want to add the hierarchical states for light mode and dark mode over here.
[00:01:55] If you check the docs, then I highly recommend you go to the History section. So, History. And look at the examples over there because it's going to be exactly what you need.