How and where to dispatch actions when multiple sibling components use the same response data

I'd like to make components stand-alone so instead of passing all data from top to bottom, I was thinking of making each component dispatching actions to make sure they have data they need, and also to pull data from store.

I had run in couple of problems with redux from begging:

1. I've tried dispatching actions that make http requests from page and then I'd pass them down the three, but that approach was terrible, since all child components would seem stand alone, but would still be dependant on their top grand parent on dispatching actions and getting the data in store
2. Second approach I've tried to make each component dispatch actions that would provide data that they need but I've run into a problem that if two child components use same state, from same request, request would be fired twice or more times.
3. And finally, I've tried improving the second approach by "lifting the state up", where in case of 2 child components having a data from the same parent, I'd move dispatching and getting data from store to their wrapper "smart" parent and passing it down as props, but in that scenario I've also had a problem with UI. What if, lets say, components A & C had same data and would've needed the "smart parent wrapper" but in visual hierarchy their real parent would render them in order A -> B -> C? In that case B wouldn't need to inside the smart wrapper?

What are the common patterns to this problem?