Im using golden layout with some containers in it, in my app there is an edit mode that permise the user to edit and resize the containers, when the user finish to modify he click "end edit" and the containers cannot be moved or resized, but if two container are part of the same space in edit mode you can switch tab to change what container you want to see, but when The Edit mode finish the tab cannot change

function initializeGoldenLayout() {
    try {
        console.log("Starting GoldenLayout initialization...");

        // Configurazione del layout
        const config = {
            settings: {
                showPopoutIcon: false,
                showMaximiseIcon: false,
                showCloseIcon: false,
                selectionEnabled: true
            },
            dimensions: {
                borderWidth: 5,
                minItemHeight: 100,
                minItemWidth: 100
            },
            content: [{
                type: 'row',
                content: [{
                    type: 'column',
                    content: [
                        {
                            type: 'row',
                            height: 40,
                            content: [
                                createComponentConfig(panelConfigs.videoList),
                                createComponentConfig(panelConfigs.miniatures),
                                createComponentConfig(panelConfigs.stats)
                            ]
                        },
                        {
                            type: 'row',
                            height: 60,
                            content: [
                                createComponentConfig(panelConfigs.fullscreen),
                                createComponentConfig(panelConfigs.events)
                            ]
                        }
                    ]
                }]
            }]
        };

        const container = document.getElementById('layout-container');
        if (!container) {
            console.error('Container not found for GoldenLayout');
            fallbackToSimpleLayout();
            return;
        }

        // Distruggi l'istanza precedente se esiste
        if (glLayout) {
            try {
                glLayout.destroy();
                glLayout = null;
                console.log("Destroyed existing GoldenLayout instance");
            } catch (e) {
                console.warn("Error destroying previous GoldenLayout:", e);
            }
        }

        glLayout = new GoldenLayout(config, container);

        // Registrazione dei componenti - IMPORTANTE: deve avvenire prima di init()
        registerGoldenLayoutComponents();

        // Evento emesso quando il layout è pronto
        glLayout.on('initialised', function () {
            console.log('GoldenLayout inizializzato con successo');
            layoutInitState.glInitialized = true;

            // Ritardo per permettere a GoldenLayout di renderizzare completamente
            setTimeout(function () {
                initializeGridStack();
                checkAndInitialize(); // Verificare lo stato dopo l'inizializzazione
            }, 300);

            isPageLoaded = true;
        });

        // Inizializza il layout
        console.log("Calling glLayout.init()...");
        try {
            glLayout.init();
            console.log("GoldenLayout initialization completed successfully");
        } catch (e) {
            console.error("Error during glLayout.init():", e);
            throw e;
        }

        // Gestione del ridimensionamento con debounce
        const resizeDebounce = debounce(function () {
            if (glLayout && layoutInitState.glInitialized) {
                try {
                    glLayout.updateSize();
                } catch (error) {
                    console.error('Errore durante updateSize:', error);
                }
            }
        }, 100);

        window.addEventListener('resize', resizeDebounce);
    } catch (error) {
        console.error('Errore nell\'inizializzazione di GoldenLayout:', error);
        fallbackToSimpleLayout();
    }
}

function registerGoldenLayoutComponents() {
    if (!glLayout) {
        console.error("Cannot register components: glLayout is null");
        return false;
    }

    try {
        console.log("Registering GoldenLayout components...");

        // Componente lista video
        glLayout.registerComponent('videoList', function (container, state) {
            console.log("Creating videoList component");
            const element = $('#videoList-template').clone().removeAttr('id');
            container.getElement().html(element);

            // Aggiorna il titolo con la traduzione corrente
            container.setTitle(dictionary['menuListaVideo'][currentLanguage] || 'Canali');
        });

        // Componente miniature video
        glLayout.registerComponent('miniatures', function (container, state) {
            console.log("Creating miniatures component");
            const element = $('#miniatures-template').clone().removeAttr('id');
            container.getElement().html(element);

            // Aggiorna il titolo con la traduzione corrente
            container.setTitle(dictionary['menuMiniature'][currentLanguage] || 'Live');

            container.on('open', function () {
                console.log('miniatures container opened');
                isGridReinitializing = true;

                setTimeout(function () {
                    try {
                        initializeGridStack();

                        // Controlla se dobbiamo ripristinare i video
                        if (grid && grid.engine && grid.engine.nodes.length === 0) {
                            const currentLayoutName = getCurrentLayoutName();
                            const miniatures = layouts[currentLayoutName]?.miniatures;

                            if (miniatures && Object.keys(miniatures).length > 0) {
                                console.log("Grid is empty but layout has miniatures, restoring...");
                                restoreVideoMiniatures(miniatures);
                            }
                        }
                    } catch (e) {
                        console.error("Error initializing grid after container open:", e);
                    } finally {
                        setTimeout(() => {
                            isGridReinitializing = false;
                        }, 500);
                    }
                }, 300);
            });

            // eventi di resize
            let resizeTimeout;
            container.on('resize', function () {
                if (grid) {
                    isGridReinitializing = true;

                    // Cancella eventuali timeout precedenti
                    clearTimeout(resizeTimeout);

                    // Imposta un nuovo timeout
                    resizeTimeout = setTimeout(() => {
                        try {
                            updateGridSize();
                        } finally {
                            isGridReinitializing = false;
                        }
                    }, 300);
                }
            });
        });

        // Componente statistiche/trascrizioni
        glLayout.registerComponent('stats', function (container, state) {
            console.log("Creating stats component");
            const element = $('#stats-template').clone().removeAttr('id');
            container.getElement().html(element);

            // Aggiorna il titolo con la traduzione corrente
            container.setTitle(dictionary['metadata'][currentLanguage] || 'Trascrizioni');

            container.on('open', function () {
                console.log('stats opened');
                changeMetadataLanguage($('#selezionaLingua').val());
            });
        });

        // Componente video a schermo intero
        glLayout.registerComponent('fullscreen', function (container, state) {
            console.log("Creating fullscreen component");
            const element = $('#fullscreen-template').clone().removeAttr('id');
            container.getElement().html(element);

            // Aggiorna il titolo con la traduzione corrente
            container.setTitle(dictionary['videoPlayer'][currentLanguage] || 'Video Player');

            container.on('open', function () {
                console.log('fullscreen opened');
            });
        });

        // Componente eventi
        glLayout.registerComponent('events', function (container, state) {
            console.log("Creating events component");
            const element = $('#events-template').clone().removeAttr('id');
            container.getElement().html(element);

            // Aggiorna il titolo con la traduzione corrente
            container.setTitle(dictionary['eventi'][currentLanguage] || 'Eventi');

            container.on('open', function () {
                console.log('events opened');
            });
        });

        isComponentsRegistered = true;
        console.log("GoldenLayout components registered successfully");
        return true;
    } catch (error) {
        console.error('Errore nella registrazione dei componenti:', error);
        return false;
    }
}