 I'm not sure about you, but I find this type of code problematic. Our button is starting to know a little too much, where it was only concerned with these applying these class names appropriately before. Now it seems totally interested in which type of element it's rendering. I think it'd be much better if we removed the smarts from this button component and explicitly state what type of tag or component we'd like to use. I'd like to say that the component I'd like to use is an anchor. Now that also means that we're going to be responsible for applying the right attributes that anchor needs. That's fine. Let's just go this route. So we're going to destructure the component value off of props. And since we already have a dynamic tag set up, we're just going to take that as the local identity tag. And if it's not defined, we're going to say that it should be button. Now instead of switching on whether or not it has an href, we're explicitly saying whether or not it should be an a or by default be a button. So we can delete this and everything will still work. Now what to do about this? It would be nice if these values were automatically put on there by some component for us. We don't actually have to use these string button to say what type of tag we want. We can default to another component. So let's call this button base. Now that's not defined so everything's going to break wildly, but we can define it with just the attributes that we want for a button. In this case, it's just type and then pass the rest of the props along. And that totally works. So now we can get rid of this and this and this is being in line. So we're good to remove all of this. All of the stuff that we added just goes away. And we can do the same for anchors that are supposed to be buttons. So here we have this component here. Let's copy that out. And instead of rendering an a we'll call this anchor base. Again, things break because we don't have that defined. Just paste in what we have below and delete the attributes we don't need. First, can I change this to an anchor? We're already defining that in this tag. This is a default attribute that we want. So we'll leave that, delete all the rest, spread those props out again. And we're good to go. So anywhere that we were explicitly stating roll, I'll delete that. And just in case you don't trust me, we'll inspect these again and make sure that everything's getting applied correctly. So we have an anchor here with a roll button, and these are both buttons with a type button.