mirror of
https://github.com/gristlabs/grist-core.git
synced 2024-10-27 20:44:07 +00:00
a9ff6b9a84
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
77 lines
3.3 KiB
TypeScript
77 lines
3.3 KiB
TypeScript
import {BoxSpec} from 'app/client/components/Layout';
|
|
import {KoArray} from 'app/client/lib/koArray';
|
|
import * as koUtil from 'app/client/lib/koUtil';
|
|
import {DocModel, IRowModel, recordSet, refRecord} from 'app/client/models/DocModel';
|
|
import {TabBarRec, ViewSectionRec} from 'app/client/models/DocModel';
|
|
import * as modelUtil from 'app/client/models/modelUtil';
|
|
import * as ko from 'knockout';
|
|
|
|
// Represents a view (now also referred to as a "page") containing one or more view sections.
|
|
export interface ViewRec extends IRowModel<"_grist_Views"> {
|
|
viewSections: ko.Computed<KoArray<ViewSectionRec>>;
|
|
tabBarItem: ko.Computed<KoArray<TabBarRec>>;
|
|
|
|
layoutSpecObj: modelUtil.SaveableObjObservable<BoxSpec>;
|
|
|
|
// An observable for the ref of the section last selected by the user.
|
|
activeSectionId: ko.Computed<number>;
|
|
|
|
// This is active collapsed section id. Set when the widget is clicked.
|
|
activeCollapsedSectionId: ko.Observable<number>;
|
|
|
|
// Saved collapsed sections.
|
|
collapsedSections: ko.Computed<number[]>;
|
|
|
|
// Active collapsed sections, changed by the user, can be different from the
|
|
// saved collapsed sections, for a brief moment (editor is buffering changes).
|
|
activeCollapsedSections: ko.Observable<number[]>;
|
|
|
|
activeSection: ko.Computed<ViewSectionRec>;
|
|
|
|
// If the active section is removed, set the next active section to be the default.
|
|
_isActiveSectionGone: ko.Computed<boolean>;
|
|
}
|
|
|
|
export function createViewRec(this: ViewRec, docModel: DocModel): void {
|
|
this.viewSections = recordSet(this, docModel.viewSections, 'parentId');
|
|
this.tabBarItem = recordSet(this, docModel.tabBar, 'viewRef');
|
|
|
|
this.layoutSpecObj = modelUtil.jsonObservable(this.layoutSpec);
|
|
|
|
this.activeCollapsedSectionId = ko.observable(0);
|
|
|
|
this.collapsedSections = this.autoDispose(ko.pureComputed(() => {
|
|
const allSections = new Set(this.viewSections().all().map(x => x.id()));
|
|
const collapsed: number[] = (this.layoutSpecObj().collapsed || []).map(x => x.leaf as number);
|
|
return collapsed.filter(x => allSections.has(x));
|
|
}));
|
|
this.activeCollapsedSections = ko.observable(this.collapsedSections.peek());
|
|
|
|
// An observable for the ref of the section last selected by the user.
|
|
this.activeSectionId = koUtil.observableWithDefault(ko.observable(), () => {
|
|
// The default function which is used when the conditional case is true.
|
|
// Read may occur for recently disposed sections, must check condition first.
|
|
// `!this.getRowId()` implies that this is an empty (non-existent) view record
|
|
// which happens when viewing the raw data tables, in which case the default is no active view section.
|
|
|
|
if (this.isDisposed() || !this.getRowId()) { return 0; }
|
|
const all = this.viewSections().all();
|
|
const collapsed = new Set(this.activeCollapsedSections());
|
|
const visible = all.filter(x => !collapsed.has(x.id()));
|
|
|
|
return visible.length > 0 ? visible[0].getRowId() : 0;
|
|
});
|
|
|
|
this.activeSection = refRecord(docModel.viewSections, this.activeSectionId);
|
|
|
|
|
|
|
|
// If the active section is removed, set the next active section to be the default.
|
|
this._isActiveSectionGone = this.autoDispose(ko.computed(() => this.activeSection()._isDeleted()));
|
|
this.autoDispose(this._isActiveSectionGone.subscribe(gone => {
|
|
if (gone) {
|
|
this.activeSectionId(0);
|
|
}
|
|
}));
|
|
}
|