Redux and the State ADT
Initialize Redux Application State Using The State ADT
Not only will we need to give our initial state to a Redux store, we will also need to be able to reset our state at any time by dispatching an action. We can get the best of both worlds by having a function that will return an object with all of our initial values in it. Then use that function to craft a State ADT transition that will throw out whatever our previous state was and replace it with the original initial state.
We’ll not only build out an initialize state transaction, but also use that new transaction to craft an action creator to expose a means to dispatch at any time an action that will reset our state.
Instructor: [00:00] We start with this function initial state which we import in from our initialize model. When run, it provides an initial state for our game, not a state transition but the actual state. Popping over to our initialized model, we see initial state defined as a function that takes a unit to an app state, returning this object when invoked.
[00:19] We define it as a function not only to keep mutability to a minimum, but we also want to ensure that we get a new number for our seed when calling date dot now, getting a new value every time this function is invoked.
[00:32] We can use this function to create a state transition that can be dispatched through Redux, dubbing it initialize and taking a unit as its sole argument. We'll define this new state transaction as a function that goes from unit to a state app state of unit.
[00:48] To implement, we'll use the put state construction helper which will replace the state to whatever value we pass to it. In our case, we'd like the state replaced with the result of calling initial state. That's all we really need, so we can just export initialize as the default for this model file.
[01:05] Meanwhile, behind the facade of this innocent-looking index file, we import in initialize to give it a play by replacing initial state in our log function to see we get back a new state instance, which we'll execute with an empty object to get the ball rolling, getting back our expected initial state. Though it matters not what we start with, as we see with null as a value.
[01:27] Now that we have a working transition, let's go about creating an action that we can use in Redux, starting with an action name of reset game that we can use to reset the game state. What good is an action name without an action creator? With a little copypasta goodness, we'll copy start game and rename it to reset game. Change the action name to reset game and update the siggy to accept a unit.
[01:50] Now we just finish it off by adding a handler for reset game in the game reducer, assigning reset game to the initialize state transition that we import in from the initialize model file, pulling it off of the default, then pairing it with reset game down in our game reducer. Now it's all over but the testing.
[02:10] To have a play with how our new reducer works, we'll import in the reset game action creator into our index by plucking it off of the exports of our game reducer file.
[02:21] Now we can see how we can go about resetting our game state at any time through Redux by dispatching our reset game action through our reducer, getting the same result with an object or a swanky null value. Heck, we can even use this boisterous number 76.