 Now, everything's looking good, but we have one more problem, not all buttons or buttons. Sometimes our buttons can be anchors. And sometimes those anchors have extra attributes attached to them. We need a way of switching this component when it needs to be an anchor or when it's supposed to be a button. The way we can do that very simply is to look for the presence of an href attribute. Now we're going to introduce some logic here so we can't just depend on the automatic returns. We need to create a block here and return this button explicitly. Now we can assign a local variable to decide what tag we want to render out given if we have an href or not. If it's present, we'll render on A. If it's not, we'll use a button. And instead of rendering a button, we render our tag. Oops, forgot I need to get that value off of props. Let's inspect this button and make sure that it is doing that switch that we anticipate. And indeed it is. This one is an anchor and the other two are buttons. However, anchors don't have this type button. It should be roll button. Let's fix that. Unfortunately, this is going to get a little bit complicated. We're going to create a new object called this attributes. And we'll give it a couple properties. We'll give it an A and a button. In the button, we'll put our type button property and in the A, we'll put roll button. Now on our components, we'll use that JSX spread operator again and grab the attributes of the tag that we're rendering. Now when we inspect this button again, we'll see that the anchor is using roll button and the button is using type button. This is exactly what we wanted.