All right, my friends, let's kick off this refactor, so we're going to go through our entire project,
we're going to first start off inside the site of our project.
We're going to find any reference to insert cell before we're going to change it into insert cell after.
And then we're going to eventually go into a reducer and update the actual logic inside there as well.
So in this video, just the right side of things.
OK, I'm going to go back over to my editor.
I'm going to first begin incited by state action types in the states file.
We're going to first update our action typewrite here, I'm going to update the string itself to insert
cell after.
Now, one thing you might be a little tempted to do here is right.
Click on Insert Cell before and then you might have inside of your code editor the functionality to
automatically rename this type for you intelligently across the entire project.
If you want to do that, that is fine.
But I really recommend you not try this out inside this course.
And the only reason for this is that depending upon your editor, this renaming logic might be done
slightly differently.
And I just want to make sure that you and I have the exact same code inside of our editors.
So I recommend that you go through this refactor with me manually rather than trying to use any kind
of automatic refactoring inside of your editor.
OK, so with that in mind, let's do this manually, I'm going to change our action type to insert cell
after.
All right, so next up, I'm going to go into my action creator's index dots file.
At the very bottom of this file.
We've got insert cell before I'm going to change the name of that to.
Insert cell after.
I'm going to change the action type to.
Insert cell after.
I'm going to change.
The action return type invitation.
To insert cell after.
Will immediately get an air from that totally fine, let's go up to the top of the file.
I'm going to find insert cell before action right here or change it to insert cell after action.
We'll go into our actions directory, find index dots.
Inside of here, we've got insert cell before action, we will rename that to insert cell after change
the action, type two after.
And then finally, at the very bottom, when we export our action type, we will rename.
Do after aswell.
OK, so now if we go into our action Graeter's index dots file, we should have no errors if we go into
action types, no errors and if we go into actions, index dots, no errors inside of here as well.
So everything around our action craters is looking good.
Let's now go into our reducers, I'm going to find cels reducer.
And inside of here, we need to import or fix up some of our switch statements inside of here, so I'm
going to scroll down a little bit and eventually find insert cell before.
Of course, we're going to change this to insert cell after.
And then we just need to update a little bit of the logic inside of here.
Let's first get a very quick reminder on the logic that we currently have inside of Iraq.
We first begin by creating a brand new cell.
We add in that cell to our data object.
And then everything else inside of here is all about inserting the idea that cell into our order array.
You might recall that when we were writing out all this logic, I showed you a diagram that looked like
this right here.
So inside of our action payload that we have access to, there is an ID property and this ID property
is pointing at the ID of the cell.
So in this case, maybe D.F. where we want to insert the new cells ID right before that one.
So if our action payload says ID f we want to take this new ID that we have generated and put it right
there.
So we're now saying that we want to flip that behavior.
We want to still find the index of the cell that is provided inside of that ID property.
But now we want to add in this new ID immediately after.
In addition, there's one other case we need to think about in some cases, we are not able to find
the index of any idea inside of here because the ID or the payload ID property is null.
So previously in that scenario, we had assumed that meant that we wanted to add in this new ID to the
very end.
So we're now going to flip that logic.
We're going to say that we want to add in.
That new idea to the very start instead.
OK, so those two scenarios, crystal clear, hopefully maybe not, no problem, we're going to go back
over, we're going to find our statement right here.
Remember, if found index is less than zero, that means that we were not able to find any ID inside
of our order array matching the one inside of our payload.
So that was a case in which we would normally add in this new cell ID to the very end of the order array.
So, again, we want to flip that.
We want to instead out into the very start.
So instead of doing a push, we'll do an unseen shift, which will add in to the very start of the array.
Then for Splice, we are currently providing found index, which will take found index, add in this
new ID right before it.
So we're now going to take found index, add one to it, and that will cause us to insert this new thing
immediately after instead.
So for found index right here, we're going to found index plus one.
And that should be it.
OK, so let's save this, that should be it for the redock side of this refactor.
We'll take a quick pause right here, come back to the next video, picks up the back side of things,
and then, of course, do a nice, good test.