All right hopefully you had some success wrapping the other to comment details with an approval card
element.
Let's now go to the solution to that.
So essentially we're just going to duplicate exactly what we did appear.
I'm going to find the second comment detail and I'm going to wrap it with an approval card.
I'll do the same closing tag after the common detail as well.
And I'll make sure that I indent the comment detail then I'll make sure I do the same thing for the
third comment as well.
And don't forget the closing tag.
All right.
Well it's good.
So now I'll save this I'll flip back over and we can see that all three comments are now being rendered
inside of an instance of approval Eckhardt.
Now the benefit to the approach that we used here is the fact that we set up approval card to take some
arbitrary child in is that now we can reduce the approval card for any other purpose we want let's try
it out right now let's say at the very top you're going to put a approval card use approval card.
So
and then I'm going to pass it some plain text I'll say Are you sure you want to do this.
So notice that we don't have to pass in a re-act component to this thing.
We can put in plain text or standard GSX as well.
So now I can save this and I'll see we have a new card up at the top that says simply Are you sure you
want to do this.
In addition we can also show multiple elements inside of here.
So I'm going to do a new line like so I'm going to put a div inside of here and I'll wrap that text
with the div and then right above the text in still inside the div.
I'll put in say an H for and I'll say something like warning how I can save this flip back over and
I'll see warning and then the text that I provided.
So by using this technique of passing children to a component and then showing the children inside of
that child component or in this case parent we can provide as many elements as we wish or we can just
show a single component if we wish.
It's totally up to you.
And the one key thing to keep in mind is that whenever we want to use this technique right here we always
have to make sure that we go into that target component.
In this case approval occurred and make sure that we somewhere reference props.
Children inside there if we don't reference props children then the child or the child children that
we passed to it from the parent are never going to show up inside of it.
All right.
So I think you get the idea now let's take a quick pause right here in the next video.
I'm going to show you a one or two quick exercises to go through.
So quick pause and I'll see you in just a minute.