00:00 Alright, so we've got a little bit of duplication in these different boxes and I think it would be cool to take the parts that are common between the boxes and move it into a box component. So where we have this with the div and we specify a class name that's box, all of our boxes have a class name of box. We specify a style that has the font style of italic.

00:19 All of our boxes have a font style of italic. The only difference is this class name and this background color. So and then of course the children, that's also a prop. So it would be cool to have a box that accepted those props and then combined them so that

00:35 we could get the proper finished result but not have to specify all of the common things. So here's what we should be able to do when we're done. We should just have a class name where we only pass the box style and the box is added for us by the box component.

00:52 And then we have a style prop that automatically adds the font style for us but also we can specify additional style elements that we want to have applied. And then of course it should forward along the children prop to the underlying div as well.

01:09 And there is a common, this is a pretty common thing to do is wrapping other elements like you make your own custom input or whatever. And the way that you can kind of say hey I'm an input but I'm special or hey I'm a div but I'm special. You can get the props or the type definition for the props using React component props

01:28 and then you pass the element type that you want to get the props for. And so now our props are all of those. And if we wanted to we could of course destructure stuff. Here's our class name and then we'll take the rest of the props.

01:44 We could pluck off the style and the rest of the props would be here and we could spread the rest of those and we could do whatever we want to with these. You could even add additional props. This is foreshadowing for what we're going to do later but you could have a size prop as well and then you would need to just say and size is something, whatever.

02:04 Then you have your own size prop there. Anyway that should be enough to get you going here. Have a good time.