(core) Fixing couple of bugs in collapsed section layout

Summary:
The previous implementation for collapsing sections involved disposing of a view instance (Grid or Chart component). This caused numerous bugs with
linking sections as the implementation is located in the BaseView.js. Now the view instance is kept and attached to a dom in a hidden div, so it can respond
and function as a normal rendered section. It is also passed from between collapsed and main layout, when sections are dragged or moved using section's
menu commands (`collapse` and `add to main page`)

It also implies that the ViewLayout must still be rendered when a section is maximized (as it is responsible for the view instance), so the dom, and
some logic for rendering it, had to be changed.

Test Plan: New and updated

Reviewers: georgegevoian

Reviewed By: georgegevoian

Differential Revision: https://phab.getgrist.com/D3826
This commit is contained in:
Jarosław Sadziński
2023-03-22 16:21:53 +01:00
parent be8e13df64
commit a9ff6b9a84
11 changed files with 364 additions and 138 deletions

View File

@@ -25,7 +25,6 @@ import {get as getBrowserGlobals} from 'app/client/lib/browserGlobals';
import {DocPluginManager} from 'app/client/lib/DocPluginManager';
import {ImportSourceElement} from 'app/client/lib/ImportSourceElement';
import {makeT} from 'app/client/lib/localization';
import {allCommands} from 'app/client/components/commands';
import {createSessionObs} from 'app/client/lib/sessionObs';
import {setTestState} from 'app/client/lib/testState';
import {selectFiles} from 'app/client/lib/uploads';
@@ -243,7 +242,10 @@ export class GristDoc extends DisposableWithEvents {
this.docModel.views.createFloatingRowModel(toKo(ko, this.activeViewId) as ko.Computed<number>));
// When active section is changed, clear the maximized state.
this.autoDispose(this.viewModel.activeSectionId.subscribe(() => {
this.autoDispose(this.viewModel.activeSectionId.subscribe((id) => {
if (id === this.maximizedSectionId.get()) {
return;
}
this.maximizedSectionId.set(null);
// If we have layout, update it.
if (!this.viewLayout?.isDisposed()) {
@@ -1058,7 +1060,10 @@ export class GristDoc extends DisposableWithEvents {
// We can only open a popup for a section.
if (!hash.sectionId) { return; }
// We might open popup either for a section in this view or some other section (like Raw Data Page).
if (this.viewModel.viewSections.peek().peek().some(s => s.id.peek() === hash.sectionId && !s.isCollapsed.peek())) {
if (this.viewModel.viewSections.peek().peek().some(s => s.id.peek() === hash.sectionId)) {
if (this.viewLayout) {
this.viewLayout.previousSectionId = this.viewModel.activeSectionId.peek();
}
this.viewModel.activeSectionId(hash.sectionId);
// If the anchor link is valid, set the cursor.
if (hash.colRef && hash.rowId) {
@@ -1069,7 +1074,7 @@ export class GristDoc extends DisposableWithEvents {
view?.setCursorPos({ sectionId: hash.sectionId, rowId: hash.rowId, fieldIndex });
}
}
allCommands.maximizeActiveSection.run();
this.viewLayout?.maximized.set(hash.sectionId);
return;
}
// We will borrow active viewModel and will trick him into believing that