 We've done some great work in our other components, making sure that concerns are separated. The data and display are not intermingled. However, this ID pager is not a stellar example. It knows about state, it knows how to update state, but it's also mixing in these concerns of display. And at the moment, these are totally un-customizable. We have just these boring default buttons. If this were a component that we're trying to get others to use, no one would ever use it. Now, this ID pager is already set up to use render props. It's passing down the ID that we use in our app to fetch a Pokemon. I'd like to change it so that instead of rendering out these buttons directly, we're just sending the actions and the application can decide how it wants to render the buttons. So let's dive in. I like to think of things from the outside in. And if I'm consuming this component, I'd like to have two separate objects to work with. First, any data. And second, actions to operate on that data. Now let's start moving those actions into our render callback. For clarity, you can see that we have this data object first. We'll add a second object for actions. We'll call the first action increment. Here we can just cut and paste the increment implementation from the button. The second function is gonna be decrement. Again, we'll simply cut and paste our decrement function. Now these buttons are freed up to be moved out. We'll cut those and we'll paste them in our app. And we're getting a very helpful JSX error right here saying that attributes must only be assigned a non-empty expression. It doesn't like the fact that these are empty. So let's fill them in. Here we'll use those new actions we created, actions decrement for this button and here actions increment. Let's give it a test. Everything still works. But now we've pulled out this display concern from our ID pager component and exposed the smarts as actions. We have one last step to clean up our ID pager, which is that we no longer need this wrapping div. Now we have a beautiful ID pager component that is only concerned with the state of this ID and providing actions to increment and decrement it.