(core) Proper way to recreate collapsed section.

Summary: Fix for a bug with a collapsed custom widget, which doesn't work it is detached from a dom.

Test Plan: Added

Reviewers: georgegevoian

Reviewed By: georgegevoian

Differential Revision: https://phab.getgrist.com/D3835
This commit is contained in:
Jarosław Sadziński 2023-03-27 18:35:57 +02:00
parent 01fbe871aa
commit edff50238d

View File

@ -41,6 +41,7 @@ export class LayoutTray extends DisposableWithEvents {
public active = Signal.create(this, false); public active = Signal.create(this, false);
private _rootElement: HTMLElement; private _rootElement: HTMLElement;
constructor(public viewLayout: ViewLayout) { constructor(public viewLayout: ViewLayout) {
super(); super();
// Create a proxy for the LayoutEditor. It will mimic the same interface as CollapsedLeaf. // Create a proxy for the LayoutEditor. It will mimic the same interface as CollapsedLeaf.
@ -49,8 +50,6 @@ export class LayoutTray extends DisposableWithEvents {
// Build layout using saved settings. // Build layout using saved settings.
this.layout.buildLayout(this.viewLayout.viewModel.collapsedSections.peek()); this.layout.buildLayout(this.viewLayout.viewModel.collapsedSections.peek());
this._registerCommands(); this._registerCommands();
// Override the drop event, to detect if we are dropped on the tray, and no one else // Override the drop event, to detect if we are dropped on the tray, and no one else
@ -121,11 +120,7 @@ export class LayoutTray extends DisposableWithEvents {
const section = Observable.create<number|null>(owner, null); const section = Observable.create<number|null>(owner, null);
owner.autoDispose(selected.addListener((cur, prev) => { owner.autoDispose(selected.addListener((cur, prev) => {
if (prev && !cur) { if (prev && !cur) {
const vs = this.viewLayout.gristDoc.docModel.viewSections.getRowModel(prev); this.layout.getBox(prev)?.recreate();
const vi = vs.viewInstance.peek();
if (vi) {
detachNode(vi.viewPane);
}
} }
section.set(cur); section.set(cur);
})); }));
@ -488,6 +483,10 @@ class CollapsedLayout extends Disposable {
return this._boxes.get().map(l => l.id.get()).filter(x => x && typeof x === 'number'); return this._boxes.get().map(l => l.id.get()).filter(x => x && typeof x === 'number');
} }
public getBox(leaf: number): CollapsedLeaf|undefined {
return this._boxes.get().find(l => l.id.get() === leaf) as CollapsedLeaf|undefined;
}
public buildDom() { public buildDom() {
return (this.rootElement = cssLayout( return (this.rootElement = cssLayout(
testId('layout'), testId('layout'),
@ -641,6 +640,12 @@ class CollapsedLeaf extends Leaf implements Draggable, Dropped {
}); });
} }
public recreate() {
const previous = this._hiddenViewInstance.get();
this._hiddenViewInstance.set(cssHidden(dom.maybe(this._viewInstance, view => view.viewPane)));
previous && dom.domDispose(previous);
}
public buildDom() { public buildDom() {
this._content.set(this.model.buildContentDom(this.id.get())); this._content.set(this.model.buildContentDom(this.id.get()));
return this.rootElement = cssBox( return this.rootElement = cssBox(