diff options
| -rw-r--r-- | src/client/views/collections/collectionSchema/CollectionSchemaView.tsx | 19 |
1 files changed, 10 insertions, 9 deletions
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx index 5d4777e12..64c39cf1a 100644 --- a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx +++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx @@ -42,6 +42,7 @@ export class CollectionSchemaView extends CollectionSubView() { private _selectedDocSortedArray: Doc[] = []; private _closestDropIndex: number = 0; private _minColWidth: number = 150; + private _previewRef: HTMLDivElement | null = null; public static _rowMenuWidth: number = 100; public static _previewDividerWidth: number = 4; @@ -71,7 +72,7 @@ export class CollectionSchemaView extends CollectionSubView() { } @computed get tableWidth() { - return this.props.PanelWidth() - this.previewWidth - CollectionSchemaView._previewDividerWidth; + return this.props.PanelWidth() - this.previewWidth - (this.previewWidth === 0 ? 0 : CollectionSchemaView._previewDividerWidth); } @computed get columnKeys() { @@ -405,12 +406,12 @@ export class CollectionSchemaView extends CollectionSubView() { @action onDividerMove = (e: PointerEvent, down: number[], delta: number[]) => { - // const nativeWidth = this._previewCont!.getBoundingClientRect(); - // const minWidth = 40; - // const maxWidth = 1000; - // const movedWidth = this.props.ScreenToLocalTransform().transformDirection(nativeWidth.right - e.clientX, 0)[0]; - // const width = movedWidth < minWidth ? minWidth : movedWidth > maxWidth ? maxWidth : movedWidth; - this.props.Document.schemaPreviewWidth = this.previewWidth - delta[0]; + const nativeWidth = this._previewRef!.getBoundingClientRect(); + const minWidth = 40; + const maxWidth = 1000; + const movedWidth = this.props.ScreenToLocalTransform().transformDirection(nativeWidth.right - e.clientX, 0)[0]; + const width = movedWidth < minWidth ? minWidth : movedWidth > maxWidth ? maxWidth : movedWidth; + this.props.Document.schemaPreviewWidth = width; return false; }; @@ -566,9 +567,9 @@ export class CollectionSchemaView extends CollectionSubView() { </div> <EditableView GetValue={returnEmptyString} SetValue={this.addNewTextDoc} placeholder={"Type ':' for commands"} contents={'+ New Node'} menuCallback={this.menuCallback} /> </div> - <div className="schema-preview-divider" style={{ width: CollectionSchemaView._previewDividerWidth }} onPointerDown={this.onDividerDown}></div> + {this.previewWidth > 0 && <div className="schema-preview-divider" style={{ width: CollectionSchemaView._previewDividerWidth }} onPointerDown={this.onDividerDown}></div>} {this.previewWidth > 0 && ( - <div style={{ width: `${this.previewWidth}px` }}> + <div style={{ width: `${this.previewWidth}px` }} ref={ref => (this._previewRef = ref)}> {this._previewDoc && ( <DocumentView Document={this._previewDoc} |