Merge branch 'moreUpgrading' into dataViz-annotations

1 files changed, 23 insertions, 19 deletions

diff --git a/src/client/views/collections/collectionSchema/SchemaRowBox.tsx b/src/client/views/collections/collectionSchema/SchemaRowBox.tsx
index 7346c4f12..5a3be826b 100644
--- a/src/client/views/collections/collectionSchema/SchemaRowBox.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaRowBox.tsx
@@ -1,13 +1,13 @@
-import React = require('react');
 import { IconButton, Size } from 'browndash-components';
-import { computed } from 'mobx';
+import { computed, makeObservable } from 'mobx';
 import { observer } from 'mobx-react';
 import { computedFn } from 'mobx-utils';
+import * as React from 'react';
 import { CgClose } from 'react-icons/cg';
 import { FaExternalLinkAlt } from 'react-icons/fa';
+import { emptyFunction, returnFalse, setupMoveUpEvents } from '../../../../Utils';
 import { Doc } from '../../../../fields/Doc';
 import { BoolCast } from '../../../../fields/Types';
-import { emptyFunction, returnFalse, setupMoveUpEvents } from '../../../../Utils';
 import { DragManager } from '../../../util/DragManager';
 import { SnappingManager } from '../../../util/SnappingManager';
 import { Transform } from '../../../util/Transform';
@@ -28,38 +28,42 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
     public static LayoutString(fieldKey: string, rowIndex: number) {
         return FieldView.LayoutString(SchemaRowBox, fieldKey).replace('fieldKey', `rowIndex={${rowIndex}} fieldKey`);
     }
-
     private _ref: HTMLDivElement | null = null;
 
+    constructor(props: any) {
+        super(props);
+        makeObservable(this);
+    }
+
     bounds = () => this._ref?.getBoundingClientRect();
 
     @computed get schemaView() {
-        return this.props.DocumentView?.().props.docViewPath().lastElement()?.ComponentView as CollectionSchemaView;
+        return this._props.DocumentView?.()._props.docViewPath().lastElement()?.ComponentView as CollectionSchemaView;
     }
 
     @computed get schemaDoc() {
-        return this.props.DocumentView?.().props.docViewPath().lastElement()?.rootDoc;
+        return this._props.DocumentView?.()._props.docViewPath().lastElement()?.Document;
     }
 
     @computed get rowIndex() {
-        return this.schemaView?.rowIndex(this.rootDoc) ?? -1;
+        return this.schemaView?.rowIndex(this.Document) ?? -1;
     }
 
     componentDidMount(): void {
-        this.props.setContentView?.(this);
+        this._props.setContentView?.(this);
     }
 
     select = (ctrlKey: boolean, shiftKey: boolean) => {
         if (!this.schemaView) return;
         const lastSelected = Array.from(this.schemaView._selectedDocs).lastElement();
-        if (shiftKey && lastSelected) this.schemaView.selectRows(this.rootDoc, lastSelected);
+        if (shiftKey && lastSelected) this.schemaView.selectRows(this.Document, lastSelected);
         else {
-            this.props.select?.(ctrlKey);
+            this._props.select?.(ctrlKey);
         }
     };
 
     onPointerEnter = (e: any) => {
-        if (SnappingManager.GetIsDragging() && this.props.isContentActive()) {
+        if (SnappingManager.IsDragging && this._props.isContentActive()) {
             document.removeEventListener('pointermove', this.onPointerMove);
             document.addEventListener('pointermove', this.onPointerMove);
         }
@@ -103,18 +107,18 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
         return (
             <div
                 className="schema-row"
-                style={{ height: this.props.PanelHeight(), backgroundColor: this.props.isSelected() ? Colors.LIGHT_BLUE : undefined }}
+                style={{ height: this._props.PanelHeight(), backgroundColor: this._props.isSelected() ? Colors.LIGHT_BLUE : undefined }}
                 onPointerEnter={this.onPointerEnter}
                 onPointerLeave={this.onPointerLeave}
                 ref={(row: HTMLDivElement | null) => {
-                    row && this.schemaView?.addRowRef?.(this.rootDoc, row);
+                    row && this.schemaView?.addRowRef?.(this.Document, row);
                     this._ref = row;
                 }}>
                 <div
                     className="row-menu"
                     style={{
                         width: CollectionSchemaView._rowMenuWidth,
-                        pointerEvents: !this.props.isContentActive() ? 'none' : undefined,
+                        pointerEvents: !this._props.isContentActive() ? 'none' : undefined,
                     }}>
                     <IconButton
                         tooltip="close"
@@ -128,7 +132,7 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
                                 emptyFunction,
                                 undoable(e => {
                                     e.stopPropagation();
-                                    this.props.removeDocument?.(this.rootDoc);
+                                    this._props.removeDocument?.(this.Document);
                                 }, 'Delete Row')
                             )
                         }
@@ -145,7 +149,7 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
                                 emptyFunction,
                                 undoable(e => {
                                     e.stopPropagation();
-                                    this.props.addDocTab(this.rootDoc, OpenWhere.addRight);
+                                    this._props.addDocTab(this.Document, OpenWhere.addRight);
                                 }, 'Open schema Doc preview')
                             )
                         }
@@ -155,13 +159,13 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
                     {this.schemaView?.columnKeys?.map((key, index) => (
                         <SchemaTableCell
                             key={key}
-                            Document={this.rootDoc}
+                            Document={this.Document}
                             col={index}
                             fieldKey={key}
                             allowCRs={false} // to enter text with new lines, must use \n
                             columnWidth={this.columnWidth(index)}
                             rowHeight={this.schemaView.rowHeightFunc}
-                            isRowActive={this.props.isContentActive}
+                            isRowActive={this._props.isContentActive}
                             getFinfo={this.getFinfo}
                             selectCell={this.selectCell}
                             deselectCell={this.deselectCell}
@@ -172,7 +176,7 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
                             transform={() => {
                                 const ind = index === this.schemaView.columnKeys.length - 1 ? this.schemaView.columnKeys.length - 3 : index;
                                 const x = this.schemaView?.displayColumnWidths.reduce((p, c, i) => (i <= ind ? p + c : p), 0);
-                                const y = (this.props.rowIndex ?? 0) * this.props.PanelHeight();
+                                const y = (this._props.rowIndex ?? 0) * this._props.PanelHeight();
                                 return new Transform(x + CollectionSchemaView._rowMenuWidth, y, 1);
                             }}
                         />