How to programmatically close a pane inside a tabgroup inside a dockmanager

[hfirst]

I have an event firing that is needing to close certain panes in a tabgroup displayed in a dockmanager. I am finding the indexes of the panes to remove and splicing the panes area of the tabgroup. This does remove the tab (after I've switched to another tab, redraw issue below), but then I am no longer able to ever open this tab again. When the user clicks to open this tab, the route does route to the component and the constructor fires, but eventually I get a console error: ERROR TypeError: Cannot read properties of undefined (reading 'isPinned')

Also, I'm not seeing the changes in the browser. But if I click on another tab that is still open, then in switching to that tab, the tabs I closed earlier (but were still visible) do finally disappear. I've tried ChangeDetector markForCheck and detectChanges and also doing that inside a timeout, but nothing seems to work. Tab closing does work, if I click the x in the tab header, the tab closes. But for this current feature, I need a way to programmatically do it from behind scenes. For now, the only workaround I've found is that I need to fire router.navigateByUrl to launch a new link to get the current tabgroup to properly redraw without the closed tabs.

[ddaribo]

Hi @hfirst,

Here is a small sample demonstrating programmatically closing/removing and readding tab panes.
Please, compare it with your own implementation to eventually determine any discrepancies that may cause the observed on your side. With the current information only, I would assume the layout updates are not properly reflected. The layout usually needs to be reassigned:

      this.layout = { ...layout };
      this.dockManager.nativeElement.layout = { ...layout };

Keep me posted on your progress.