From c36be605249ca00436b7f70068a1f961b66a8c5f Mon Sep 17 00:00:00 2001 From: Nathan Reese Date: Thu, 3 Oct 2024 12:16:07 -0600 Subject: [PATCH] setChildren --- .../public/dashboard_api/panels_manager.ts | 1 + .../embeddable/dashboard_container.tsx | 25 ++++++++++---- .../public/lib/containers/container.ts | 34 +++++++++++-------- 3 files changed, 39 insertions(+), 21 deletions(-) diff --git a/src/plugins/dashboard/public/dashboard_api/panels_manager.ts b/src/plugins/dashboard/public/dashboard_api/panels_manager.ts index b4861eb16b81b..1355eb411b2fc 100644 --- a/src/plugins/dashboard/public/dashboard_api/panels_manager.ts +++ b/src/plugins/dashboard/public/dashboard_api/panels_manager.ts @@ -168,6 +168,7 @@ export function initializePanelsManager( } if (resetChangedPanelCount) children$.next(currentChildren); }, + setChildren: (children: { [key: string]: unknown; }) => children$.next(children), setPanels: (panels: DashboardPanelMap) => { panels$.next(panels); }, diff --git a/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.tsx b/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.tsx index ff70a639e0566..7c957bcf8c1ee 100644 --- a/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.tsx +++ b/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.tsx @@ -347,17 +347,29 @@ export class DashboardContainer this.setRuntimeStateForChild = dashboardApi.setRuntimeStateForChild; this.canRemovePanels = dashboardApi.canRemovePanels; this.removePanel = dashboardApi.removePanel; + this.children$ = dashboardApi.children$; + this.getChildren = () => { + return { ...this.children$.value }; + }; + this.setChildren = dashboardApi.setChildren; this.dashboardApi = dashboardApi; this.useMargins$ = new BehaviorSubject(this.getState().explicitInput.useMargins); this.publishingSubscription.add( - this.onStateChange(() => { - const state = this.getState(); - if (this.useMargins$.value !== state.explicitInput.useMargins) { - this.useMargins$.next(state.explicitInput.useMargins); + this.getInput$().subscribe((input) => { + if (this.useMargins$.value !== input.useMargins) { + this.useMargins$.next(input.useMargins); } - if (this.panels$.value !== state.explicitInput.panels) { - dashboardApi.setPanels(state.explicitInput.panels); + if (this.panels$.value !== input.panels) { + dashboardApi.setPanels(input.panels); + } + }) + ); + + this.publishingSubscription.add( + this.panels$.subscribe((panels) => { + if (panels !== this.getInput().panels) { + this.updateInput({ panels: this.panels$.value }) } }) ); @@ -569,6 +581,7 @@ export class DashboardContainer public expandedPanelId: BehaviorSubject; public focusedPanelId$: BehaviorSubject; public managed$: BehaviorSubject; + public children$: BehaviorSubject<{ [key: string]: unknown }>; public fullScreenMode$: BehaviorSubject; public hasRunMigrations$: BehaviorSubject; public hasUnsavedChanges$: BehaviorSubject; diff --git a/src/plugins/embeddable/public/lib/containers/container.ts b/src/plugins/embeddable/public/lib/containers/container.ts index 7372645a58fe0..0ebf3aeb0d4e6 100644 --- a/src/plugins/embeddable/public/lib/containers/container.ts +++ b/src/plugins/embeddable/public/lib/containers/container.ts @@ -54,14 +54,10 @@ export abstract class Container< TContainerOutput extends ContainerOutput = ContainerOutput > extends Embeddable - implements IContainer, PresentationContainer + implements IContainer, Omit { public readonly isContainer: boolean = true; - public children$: BehaviorSubject<{ [key: string]: unknown }> = new BehaviorSubject<{ - [key: string]: unknown; - }>({}); - private subscription: Subscription | undefined; private readonly anyChildOutputChange$; @@ -123,6 +119,14 @@ export abstract class Container< ); } + protected getChildren(): { [key: string]: unknown } { + throw new Error('getChildren implemenation not provided') + } + + protected setChildren(children: { [key: string]: unknown }): void { + throw new Error('getChildren implemenation not provided') + } + public getPanelCount() { return Object.keys(this.getInput().panels).length; } @@ -157,8 +161,8 @@ export abstract class Container< return; } - const currentChildren = this.children$.value; - this.children$.next({ + const currentChildren = this.getChildren; + this.setChildren({ ...currentChildren, [embeddable.id]: embeddable, }); @@ -193,7 +197,7 @@ export abstract class Container< } public reload() { - for (const child of Object.values(this.children$.value)) { + for (const child of Object.values(this.getChildren())) { (child as IEmbeddable)?.reload?.(); } } @@ -280,11 +284,11 @@ export abstract class Container< } public getChildIds(): string[] { - return Object.keys(this.children$.value); + return Object.keys(this.getChildren()); } public getChild(id: string): E { - return this.children$.value[id] as E; + return this.getChildren()[id] as E; } public getInputForChild( @@ -325,7 +329,7 @@ export abstract class Container< public destroy() { super.destroy(); - for (const child of Object.values(this.children$.value)) { + for (const child of Object.values(this.getChildren())) { (child as IEmbeddable)?.destroy?.(); } this.subscription?.unsubscribe(); @@ -339,14 +343,14 @@ export abstract class Container< } if (this.output.embeddableLoaded[id]) { - return this.children$.value[id] as TEmbeddable; + return this.getChildren()[id] as TEmbeddable; } return new Promise((resolve, reject) => { const subscription = merge(this.getOutput$(), this.getInput$()).subscribe(() => { if (this.output.embeddableLoaded[id]) { subscription.unsubscribe(); - resolve(this.children$.value[id] as TEmbeddable); + resolve(this.getChildren()[id] as TEmbeddable); } // If we hit this, the panel was removed before the embeddable finished loading. @@ -509,9 +513,9 @@ export abstract class Container< embeddable.destroy(); // Remove references. - const nextChildren = this.children$.value; + const nextChildren = this.getChildren(); delete nextChildren[id]; - this.children$.next(nextChildren); + this.setChildren(nextChildren); } this.updateOutput({