Reload component state in iframe in ReactJS

Question

I have this schema of application architecture:

-- main page (lot of react components)
----- iframe 1 (lot of react components)
-------- iframe 2 (lot of react components)
---------- iframe 3 (lot of react components)

I cant modify this schema. It should be not modified.

Description of using:

1. I am on main page. Then I am clicking some react component.
2. After click it opens iframe 1. Then i entry for example some input data etc.
3. In frame 1 I am clicking some react component and it opens iframe 2.
4. The same situation. On iframe 2 I am clicking some react component and it opens iframe 3.
5. On iframe 3 I am modifing some data (for example dropdowns, inmputs, etc). On I frame 3 I am clicking save button after entry data.
6. Clicking save button closing iframe 3 and iframe 2.
7. On this moment I have main page and iframe 1.

Now I want to reload one with lot of components on iframe 1. I want to fetch data by API (this data was modified on closed iframe 3). It is not problem for me to fetch data and refresh component. But the question is: how to perform refresh iframe1 component after close iframe3? I need something like event, callback, etc, but I don't know how to do it.

I tried to use hooks and call data by dispatch but it not working.