Invoking Actors Solution

[00:00:00]
>> Alright, so let's talk about invoking actors. In exercise seven, we don't have this timer working or actually it is working, probably because I have the solution up here. Just fix that. Okay. So in exercise seven Obviously our timer doesn't work because we removed that use effect. And instead, we want to use that in the actual machine itself.

[00:00:30]
So here's how we would go about doing that. Just like you saw in the lesson, we're going to invoke a callback. So it's gonna be a source, and the source of this invoke Is we're going to be creating a callback so that we can take the context and the events that caused the invoke.

[00:00:53]
But we don't need that in this case. So we're just going to be using the context. And we're going to be returning a function. So there's two ways you could do this. You could either return the function here, which is that Send back and, and the receive which we're not going to be using over here.

[00:01:15]
Or you can make this a little bit more concise and just have context sent back. And then here is where we create the interval. So we say const interval equals or I'm just going to call this I. Equals setInterval. And on the every interval, we're going to send back a tick event.

[00:01:41]
And so that tick event is going to happen every, Well second times context, dot interval. Now, important note over here, this context represents the context at the time that this invoked actor was created. So it's not going to be in Updated context, you only get the context once basically.

[00:02:10]
And if the context changes, then you need to communicate that to the actor within the vents. So don't forget to return a function that cleans up that interval. So we're going to clear interval I But yeah, that should do the trick. So when we click, we see that we have our interval working just the same.

[00:02:35]
Now the good thing about this is that console dot log cleaning up is that we could. Only have this interval run when it's in this state. This is non state specific thing this in original state charts is you could consider it inactivity. It's basically That happens during the states or throughout the state.

[00:02:59]
So as long as you're in the running states, this invocation is still going to be running. Once you exit it, this is going to be cleaned up. So, we click here because it paused may be reset. So here we go paused, you can see that the timer is being cleaned up so it's no longer sending ticks.

[00:03:24]
It see cleaning up right over here. And of course if we reset, it's going to be cleaned up again. So it's creating a new timer every single time we enter the running state. And that's so that we don't get any wasted calls or, you know, wasted code basically running when it's not supposed to be running.

[00:03:48]
So were there any questions about that exercise. I just like how it gets rid of the use context because like our, our component is getting tinier and tinier. It's like pretty much JSX with like one or two hooks now, so it's, it's kind of elegant.
>> Yeah, yeah, because state machines and state charts can handle so much you end up not needing things such as use effect.

[00:04:12]
And other things like that. So.