Merge branch 'master' of https://github.com/brown-dash/Dash-Web into joanne-tutorialagent

4 files changed, 21 insertions, 19 deletions

diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
index 6442385c0..2576bdf9b 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
@@ -1043,17 +1043,16 @@ export class CollectionSchemaView extends CollectionSubView() {
         if (!this._oldKeysWheel?.scrollTop && e.deltaY <= 0) e.preventDefault();
         e.stopPropagation();
     };
+    setRef = (r: HTMLDivElement | null) => {
+        this._oldKeysWheel?.removeEventListener('wheel', this.onKeysPassiveWheel);
+        this._oldKeysWheel = r;
+        r?.addEventListener('wheel', this.onKeysPassiveWheel, { passive: false });
+    };
     _oldKeysWheel: HTMLDivElement | null = null;
     @computed get keysDropdown() {
         return (
             <div className="schema-key-search">
-                <div
-                    className="schema-key-list"
-                    ref={r => {
-                        this._oldKeysWheel?.removeEventListener('wheel', this.onKeysPassiveWheel);
-                        this._oldKeysWheel = r;
-                        r?.addEventListener('wheel', this.onKeysPassiveWheel, { passive: false });
-                    }}>
+                <div className="schema-key-list" ref={this.setRef}>
                     {this._menuKeys.map(key => (
                         <div
                             key={key}
@@ -1294,6 +1293,9 @@ export class CollectionSchemaView extends CollectionSubView() {
     screenToLocal = () => this.ScreenToLocalBoxXf().translate(-this.tableWidth, 0);
     previewWidthFunc = () => this.previewWidth;
     displayedDocsFunc = () => this.docsWithDrag.docs;
+    setColHdrRef = (r: SchemaColumnHeader | null) => r && this._headerRefs.push(r);
+    setPreviewRef = (r: HTMLDivElement | null) => (this._previewRef = r);
+
     render() {
         return (
             <div
@@ -1331,7 +1333,7 @@ export class CollectionSchemaView extends CollectionSubView() {
                         {this.columnKeys.map((key, index) => (
                             <SchemaColumnHeader
                                 //cleanupField={this.cleanupComputedField}
-                                ref={r => r && this._headerRefs.push(r)}
+                                ref={this.setColHdrRef}
                                 keysDropdown={this.keysDropdown}
                                 schemaView={this}
                                 columnWidth={() => CollectionSchemaView._minColWidth} //TODO: update
@@ -1379,11 +1381,7 @@ export class CollectionSchemaView extends CollectionSubView() {
                 </div>
                 {this.previewWidth > 0 && <div className="schema-preview-divider" style={{ width: CollectionSchemaView._previewDividerWidth }} onPointerDown={this.onDividerDown} />}
                 {this.previewWidth > 0 && (
-                    <div
-                        style={{ width: `${this.previewWidth}px` }}
-                        ref={ref => {
-                            this._previewRef = ref;
-                        }}>
+                    <div style={{ width: `${this.previewWidth}px` }} ref={this.setPreviewRef}>
                         {Array.from(this._selectedDocs).lastElement() && (
                             <DocumentView
                                 Document={Array.from(this._selectedDocs).lastElement()}
diff --git a/src/client/views/collections/collectionSchema/SchemaCellField.tsx b/src/client/views/collections/collectionSchema/SchemaCellField.tsx
index 9ad94cb31..412daa105 100644
--- a/src/client/views/collections/collectionSchema/SchemaCellField.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaCellField.tsx
@@ -341,12 +341,14 @@ export class SchemaCellField extends ObservableReactComponent<SchemaCellFieldPro
         return <span className="editableView-static">{this._props.fieldContents ? <FieldView {...this._props.fieldContents} /> : ''}</span>;
     };
 
+    setRef = (r: HTMLDivElement | null) => (this._inputref = r);
+
     renderEditor = () => {
         return (
             <div
                 contentEditable
                 className="schemaField-editing"
-                ref={r => (this._inputref = r)}
+                ref={this.setRef}
                 style={{ minHeight: `min(100%, ${(this._props.GetValue()?.split('\n').length || 1) * 15})`, minWidth: 20 }}
                 onBlur={() => (this._props.refSelectModeInfo.enabled ? setTimeout(() => this.setIsFocused(true), 1000) : this.finalizeEdit(false, true, false))}
                 onInput={this.onChange}
diff --git a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
index 134f2ed31..64bfab856 100644
--- a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
@@ -118,6 +118,10 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea
         return { color, fieldProps, cursor };
     };
 
+    setRef = (r: EditableView | null) => {
+        this._inputRef = r;
+        this._props.autoFocus && r?.setIsFocused(true);
+    };
     @computed get editableView() {
         const { color, fieldProps } = this.renderProps(this._props);
 
@@ -133,10 +137,7 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea
                     width: '100%',
                 }}>
                 <EditableView
-                    ref={r => {
-                        this._inputRef = r;
-                        this._props.autoFocus && r?.setIsFocused(true);
-                    }}
+                    ref={this.setRef}
                     oneLine={true}
                     allowCRs={false}
                     contents={''}
diff --git a/src/client/views/collections/collectionSchema/SchemaTableCell.tsx b/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
index 8b34b4139..02e0d8100 100644
--- a/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
@@ -185,6 +185,7 @@ export class SchemaTableCell extends ObservableReactComponent<SchemaTableCellPro
         return eqSymbol + modField;
     };
 
+    setRef = (r: SchemaCellField | null) => selectedCell(this._props) && this._props.autoFocus && r?.setIsFocused(true);
     @computed get defaultCellContent() {
         const { color, textDecoration, fieldProps, pointerEvents } = SchemaTableCell.renderProps(this._props);
 
@@ -204,7 +205,7 @@ export class SchemaTableCell extends ObservableReactComponent<SchemaTableCellPro
                     Doc={this._props.Doc}
                     highlightCells={(text: string) => this._props.highlightCells(this.adjustSelfReference(text))}
                     getCells={(text: string) => this._props.eqHighlightFunc(this.adjustSelfReference(text))}
-                    ref={r => selectedCell(this._props) && this._props.autoFocus && r?.setIsFocused(true)}
+                    ref={this.setRef}
                     oneLine={this._props.oneLine}
                     contents={undefined}
                     fieldContents={fieldProps}