I'm not quite sure what you want to archive. You change props and/or state which causes a render. It's not a good idea to trigger things based on render calls because every change of props and state causes a render which can be a very high amount.
Better manipulate props and state and in render you only handle the result. This way it's pretty reliable.
I took your code you posted and the one you referenced in the sandbox and changed it the way I think it should look like.
In this example, you don't even need a middleware like thunk.
I made no use of the after click variable because there are just two values. The past (pre-click) one and the current one.
In the second example I made use of thunk to dispatch an action and call a callback afterwards. This is where thunk comes into play to enable this kind of action. Without thunk we can just dispatch objects.
Feel free to fork it and if you have questions, please post :).