I have a code that displays an interface on jupyter notebook. However, each time I reopen the ipynb file, it shows the following instead of the full interface. Anyone knows how to fix this?

Tab(children=(Output(), Output(), Output()), _titles={'0':...

I'm able to click on logo1 to refresh the program and it'll nicely display the interface again but I'm hoping to be able to fix it such that the interface is always showing.

Snippets of my code:

def load_and_display_logos_with_toggle():
    try:
        current_directory = os.getcwd()
        logo1_path = os.path.join(current_directory, "system files", "logo1.png")
        logo2_path = os.path.join(current_directory, "system files", "logo2.jpg")

        # Encode logos in Base64
        with open(logo1_path, "rb") as file:
            logo1_data = base64.b64encode(file.read()).decode("utf-8")

        with open(logo2_path, "rb") as file:
            logo2_data = base64.b64encode(file.read()).decode("utf-8")

        # Create combined HTML with both header and container for tabs
        combined_html = f'''
        <style>
            .header-and-tabs {{
                display: flex;
                flex-direction: column;
                width: 100%;
            }}
        </style>
        <div class="header-and-tabs">
            <div style="display: flex; justify-content: space-between; align-items: center; height: 200px; width: 100%; max-width: 1650px;">
                <img id="logo1" src="data:image/png;base64,{logo1_data}" alt="Logo1" style="width: 241px; height: 95px; cursor: pointer; margin-left: 20px;" onclick="restart_run_all()">
                <img id="logo2" src="data:image/jpg;base64,{logo2_data}" style="width:258px;height:100px;" alt="Logo2">
            </div>
            <div id="tab-container"></div>
        </div>
        <script>
        function restart_run_all() {{
            IPython.notebook.kernel.restart();
            setTimeout(function() {{
                IPython.notebook.execute_cells([0]);
            }}, 1000);
        }}
        </script>
        '''
        display(HTML(combined_html))

        # Create tab outputs
        tab1_output = Output()
        tab2_output = Output()
        tab3_output = Output()

        # Create tabs widget
        tab = Tab()
        tab.children = [tab1_output, tab2_output, tab3_output]
        tab.set_title(0, 'Page 1')
        tab.set_title(1, 'Page 2')
        tab.set_title(2, 'Page 3')

        # Function to handle tab selection
        def on_tab_selected(change):
            if change['new'] == 1:  # If Simplified Results tab is selected
                with tab2_output:
                    clear_output()
                    page2()

        # Register the callback
        tab.observe(on_tab_selected, names='selected_index')

        # Define content for each tab
        with tab1_output:
            %run "./system files/page1.ipynb"

        with tab2_output:
            page2()

        with tab3_output:
            page3()

        # Display just the tab widget
        display(tab)

    except Exception as e:
        display(HTML(f'<p>Error loading logos: {e}</p>'))

# Call the function
load_and_display_logos_with_toggle()