Just to make sure that our solar item is working correctly, along with The Selecter that we put inside
of our sullies component, let's manually dispatch an action or two inside of our store once again to
create one or two cells.
We'll just make sure that the IDs of them are, in fact, being printed up successfully.
So back inside my state Staats file, I'm going to once again import action type from action types.
Well, then do a story, dispatch.
With that type of action type insert cell before in a payload of ID null and type of code and then going
to copy paste that down one time and for the second one, I'll give it a type of text so we will have
one of each kind of cell.
All right, let's save this, go back over to our browser, and if we refresh now, we should see the
ID of both those cells.
Well, that definitely looks good.
So it means that we are correctly selecting some information out of our store, getting information
those cells down into the cell list item and printing up some information.
Now, the last thing we really have to do inside of our cell list item for now is making sure that we
render the appropriate kind of cell.
So a code cell or a text editor or whatever we need to show rather than, of course, just simply the
ID.
So let's take care of that.
Back inside of cell list item, remember, right now, we do not actually have a text editor cell component,
but we do have a code cell component.
So we're going to use code cell and text editor for now.
We're going to show one of these two components based upon the kind of cell that we are iterating over
or the one that was passed in to our cells item as props.
So I'm going to import both those components at the top.
We'll get our code sell.
Kozel.
And text editor from.
Text Ed.
Then inside of our functional component.
There's many different ways, of course, that we can figure out what kind of cell we want to display,
what kind of component and what not.
We'll take a pretty straightforward approach.
I'm going to say let child Colin James export element.
And then if cell, that type is code.
Then I'm going to change the value of child to be.
Code cell.
Otherwise, child will be an instance of text editor, so again, many different ways we can put in
this logic right here, but this will work for now.
So then finally, rather than showing the slide, I'm going to replace that with whatever we decided
to show for child.
All right, let's save this, go back over and now if we refresh, we should see one code editor and
one text editor appear a there we go.
So we see our code editor up here with some code inside of it.
There's our text editor.
It does appear that I'm not seeing the bottom bar of kind of bottom reciter of our code editor itself.
Definitely something we can fix up in just a moment.
But overall, I would say that this is a reasonable success.
We can now start to copy paste a couple more of these dispatches inside of our store file if you want
to.
So I'm going to take the two existing ones we have really quick.
And two more underneath that, so I've now got four dispatches inside of here.
And if I save this, do a quick refresh now, I should see code editor, a cell code editor and Texel.
All right, I'd say this looks pretty reasonable.
It's obviously a couple of things for us to fix up here, a couple of things for us to improve because
well, as you could guess, we don't always want to just be mentally dispatching the creation of all
these cells.
So clearly, definitely still some work for us to do, but definitely a good step forward.
So let's continue with some improvements in just a moment.