How to display a web page in the main area at the bottom of the top bar when developing a custom app?

Hi there,

I would like to develop a custom plug-in app and add it to the Jira top bar. (Top bar with Dashboard, Project, Issue, Board, etc… ) (Refer to below jira-main-view.png image)

After that, if click “AllView Report” on the “AllView” menu, I want to display the web page (HTML, react…) in the main div at the bottom of the top bar. Just like the page appears when click Tempo’s My Work. (Refer to below jira-tempo-view.png image)

I tried to use iframe, but the screen ratio doesn’t seem to match.
Is there a technical way to display a web page in the area when developing a custom app?
If anyone knows about this method, please reply as soon as possible.
Thank you!