One problem with this example is that there's no visual indication that a button links to the current URL. For example, when the app first loads the / URL, the Home button should stand out from the other buttons. One way to do this would be to change the color property to primary if the button is considered active.
You could use the NavLink component from react-router-dom. This component lets you set styles or class names that are only applied when the link is active. The challenge with doing this is that you only need to change a simple Button property when it is active. Having to maintain styles for active buttons seems like a bit much, especially if you want to make your UI easy to theme.
Instead, you can create a button ...
