We've got our Selous component set up, so they're not going to hook this thing up to our reduc store,
pulls some state out and render a list of cells if we do so.
However, just a really quick reminder.
You might recall back when we covered Redux a long time ago, at the start of the course, we created
a typed selecter.
The by default, if we make use of the use selector hook from react redux, we don't get any type things
coming out of our reduc store.
In other words, we don't know what type of data we are accessing.
So you might recall that we had to create a typed selector that pretty much just came down to writing
out a new hook.
We had to write a little bit of mystery code inside there just to help react redux, understand the
type of data inside of our store.
So in other words, we have to do that.
Just a little bit of administrative work.
Let's do it right now.
Inside my SAAC directory, I'm going to create a new folder called Hooke's.
And then inside there, I'll make a new file called.
New file, there we go, use typed selecter.
It's.
Then inside of here, we'll import use selecter and tight use selector hook from React Redux.
We'll get our route state type from up one directory state.
And then finally, that little mysterious bit of code, so it ends up being export const use typed selecter.
Colin typed use selector hook angle brackets we're going to put in root state inside their.
Equals use selecter.
OK, so now whenever we want to access any state instead of a component, we're going to use our use
type selector and this thing is going to understand the type of data that is stored inside of our store.
All right, so let's go back over to our cell list component.
And we'll go ahead and import that hook at the very top, it will do and import.
Use typed selecter.
From up on directory, folks use typed selecter.
Now, inside of our component itself.
If we just call use type selector and pass in an arrow function, we can add in a state argument to
it, I'm going to write out to state like so.
And if I mouse over state, it's going to correctly display the type of data that is stored inside of
our reduc store.
So we get all that cells related stuff inside there.
Looks like it definitely worked as expected.
Now that we've got the ability to get some state inside of our component, we need to think about what
state we actually need to pull out.
Remember, inside of our cells reducer right now, we have the data object that has essentially a collection
of all of our different cells.
We also have the order object that tells us the order of cells and the order they should be printed
out on the screen, the inside of cell list.
We really have to create a selector that is going to attempt to get data and order and then kind of
merge the two together into some appropriately ordered list of cells.
So let's take care of this little piece of logic in the next video.