Let's move on to our bundles reducer, so back inside of my reducers directory, I find bundles, reducers,
it's.
I'm going to remove the export default of one at the very top.
Remember, we just had that in there to get a little air around, react out, to go away.
Then the very top, we will immediately import produce from IMR.
We'll get action type.
From action types.
And action from actions.
We'll then follow the exact same pattern we have inside of our other reducer, so we'll first define
an interface that describes the structure of the state that we will return from this reducer.
We'll initialize a state object or an initial state object, and we'll define our reducer and export
it.
So first things first.
I'll make an interface called Bundles States.
So we need to think about what structure of state we want to return for this particular reducer.
Well, I think we can follow a very similar pattern to what we did back inside of our cells reducer
for that data property.
Remember, the data property was an object where the keys were the idea of a particular cell and then
the values for each of those was the cell itself.
So we're going to say that our bundle state object is going to be an object, of course, that has a
key, that is a string, and that's going to be the ID of a particular cell.
And then the value is going to be an object.
That has a floating property.
A code property that is going to be a string and an air property that is a string to the loading right
here is going to be used to describe whether or not we are currently bundling the cell, the term loading
maybe not the best because we're not necessarily loading any data.
We're technically processing or bundling.
If you want to use a different name than loading, that is totally fine.
But I think the term loading is can be very easily understood as being we are currently processing something.
So whenever we receive this initial bundle start action, we're going to make sure that we flip loading
to true to say we are currently bundling.
Whenever we complete bundling, we're going to flip loading over to false.
And at that point in time, we should have an actual value to provide for a code and air.
Yes, I think this is a reasonable place to get started now we can define our initial state object,
do initial states, I'm going to annotate it as type bundles states, and then we're going to default
it to be an empty object because initially we have no bundles for any cells whatsoever.
Then after that, we can define our actual producer.
Remember to call produce, that's what's going to allow us to do some direct manipulation or mutation
of our state object.
I'll put in my producer function.
You'll receive state as the first argument, I will annotate that as type bundles state and I will default
it to be initial state.
We can then put in our action as a second argument and I'm going to annotate that as type action, which
we had already imported at the top.
And then finally, remember, this is something we discussed several times, because we are using IMR,
we do not technically have to return a state object, but if we don't return a state object, typescript
is going to get really confused really quickly.
So we are going to add on a return type annotation, even though it is not strictly required because
we are using IMR, it's going to put in a colon bundles state and that's just going to make sure that
in all scenarios, no matter what, we always return an object of type on the state.
And this is really just a clarifying step for typescript.
All right, so then inside of the body of our producer right now, we'll just put in just a little bit
of scaffolding.
So we'll do a switch over action type will add on our case of action type DOT.
Bundle start.
And in that case, I'm going to return state right now.
Action type one will complete in that case will return state again and default, which we do yet again
return state.
Then finally, at the very bottom, I will export default or reduce her.
OK, so that's it for right now, let's take a pause right here, come back to the next video and finish
up are implementation of the reducer.