cleaned up SelectionManager. fixed schema view

1 files changed, 24 insertions, 14 deletions

diff --git a/src/client/views/collections/collectionSchema/SchemaRowBox.tsx b/src/client/views/collections/collectionSchema/SchemaRowBox.tsx
index 5a2926159..737d7e0f4 100644
--- a/src/client/views/collections/collectionSchema/SchemaRowBox.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaRowBox.tsx
@@ -1,13 +1,13 @@
 import * as React from 'react';
 import { IconButton, Size } from 'browndash-components';
-import { computed } from 'mobx';
+import { computed, makeObservable, override } from 'mobx';
 import { observer } from 'mobx-react';
 import { computedFn } from 'mobx-utils';
 import { CgClose } from 'react-icons/cg';
 import { FaExternalLinkAlt } from 'react-icons/fa';
 import { Doc } from '../../../../fields/Doc';
 import { BoolCast } from '../../../../fields/Types';
-import { emptyFunction, returnFalse, setupMoveUpEvents } from '../../../../Utils';
+import { copyProps, emptyFunction, returnFalse, setupMoveUpEvents } from '../../../../Utils';
 import { DragManager } from '../../../util/DragManager';
 import { SnappingManager } from '../../../util/SnappingManager';
 import { Transform } from '../../../util/Transform';
@@ -28,17 +28,27 @@ 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;
 
+    _prevProps: FieldViewProps & SchemaRowBoxProps;
+    @override _props: FieldViewProps & SchemaRowBoxProps;
+    constructor(props: FieldViewProps & SchemaRowBoxProps) {
+        super(props);
+        this._props = this._prevProps = props;
+        makeObservable(this);
+    }
+    componentDidUpdate() {
+        copyProps(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()?.Document;
+        return this._props.DocumentView?.()._props.docViewPath().lastElement()?.Document;
     }
 
     @computed get rowIndex() {
@@ -46,7 +56,7 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
     }
 
     componentDidMount(): void {
-        this.props.setContentView?.(this);
+        this._props.setContentView?.(this);
     }
 
     select = (ctrlKey: boolean, shiftKey: boolean) => {
@@ -54,12 +64,12 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
         const lastSelected = Array.from(this.schemaView._selectedDocs).lastElement();
         if (shiftKey && lastSelected) this.schemaView.selectRows(this.Document, lastSelected);
         else {
-            this.props.select?.(ctrlKey);
+            this._props.select?.(ctrlKey);
         }
     };
 
     onPointerEnter = (e: any) => {
-        if (SnappingManager.IsDragging && this.props.isContentActive()) {
+        if (SnappingManager.IsDragging && this._props.isContentActive()) {
             document.removeEventListener('pointermove', this.onPointerMove);
             document.addEventListener('pointermove', this.onPointerMove);
         }
@@ -103,7 +113,7 @@ 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) => {
@@ -114,7 +124,7 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
                     className="row-menu"
                     style={{
                         width: CollectionSchemaView._rowMenuWidth,
-                        pointerEvents: !this.props.isContentActive() ? 'none' : undefined,
+                        pointerEvents: !this._props.isContentActive() ? 'none' : undefined,
                     }}>
                     <IconButton
                         tooltip="close"
@@ -128,7 +138,7 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
                                 emptyFunction,
                                 undoable(e => {
                                     e.stopPropagation();
-                                    this.props.removeDocument?.(this.Document);
+                                    this._props.removeDocument?.(this.Document);
                                 }, 'Delete Row')
                             )
                         }
@@ -145,7 +155,7 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
                                 emptyFunction,
                                 undoable(e => {
                                     e.stopPropagation();
-                                    this.props.addDocTab(this.Document, OpenWhere.addRight);
+                                    this._props.addDocTab(this.Document, OpenWhere.addRight);
                                 }, 'Open schema Doc preview')
                             )
                         }
@@ -161,7 +171,7 @@ export class SchemaRowBox extends ViewBoxBaseComponent<FieldViewProps & SchemaRo
                             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 +182,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);
                             }}
                         />