title: react wait for another component to finish rendering
body: <p>I have the following situtation:
  2 components A and B.
  A is above B in the page layout.
  I wish to calculate B <code>height</code> css rule dynamically using it's <code>top</code>.
  B's <code>top</code> is affected by A because A is rendered above it. I attached a reference to B and then apply it style by calculating the bounding rect of the ref and calculating the desired <code>height</code> from the <code>top</code>.<br/>A problem occurs when component A is taking more time to fully render than component B because A loads images that takes a bit more time to load making B's top to shift a after it was already rendered so the calculating of the <code>height</code> in the function needs to be called again somehow after A was fully rendered but I don't wanna make B coupled to A just because it renders before it, what can I do to solve this issue?</p>