new columns display blank

1 files changed, 20 insertions, 14 deletions

diff --git a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
index f404eb444..6e2f85cc0 100644
--- a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
@@ -39,7 +39,7 @@ export interface SchemaColumnHeaderProps {
     rowHeight: () => number;
     resizeColumn: (e: any, index: number) => void;
     dragColumn: (e: any, index: number) => boolean;
-    openContextMenu: (x: number, y: number, index: number, fieldType: ColumnType) => void;
+    openContextMenu: (x: number, y: number, index: number) => void;
     setColRef: (index: number, ref: HTMLDivElement) => void;
     rootSelected?: () => boolean;
     columnWidth: () => number;
@@ -50,15 +50,21 @@ export interface SchemaColumnHeaderProps {
 @observer
 export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHeaderProps> {
 
-    @observable _editing: boolean | undefined = false;
-    @observable _fieldType: ColumnType = ColumnType.String;
+    @observable _altTitle: string | undefined = undefined;
 
     @computed get fieldKey() {
         return this._props.columnKeys[this._props.columnIndex];
     }
 
+    isDefaultTitle = (key: string) => {
+        const defaultPattern = /EmptyColumnKey/;
+        let isDefault: boolean = (defaultPattern.exec(key) != null);
+        return isDefault;
+    }
+
     getFinfo = computedFn((fieldKey: string) => this._props.schemaView?.fieldInfos.get(fieldKey));
     setColumnValues = (field: string, defaultValue: string) => {this._props.schemaView?.setKey(field, defaultValue, this._props.columnIndex);}
+    @action updateAlt = (newAlt: string) => {this._altTitle = newAlt;}
 
     @action
     sortClicked = (e: React.PointerEvent) => {
@@ -128,15 +134,21 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea
                 contents={undefined}
                 fieldContents={fieldProps}
                 editing={undefined}  
+                updateAlt={this.updateAlt} // alternate title to display
                 showKeyNotVal={true} // tells the EditableView to display the fieldKey itself, and not its value
-                GetValue={() => this.fieldKey}
+                GetValue={() => {
+                    if (this.isDefaultTitle(this.fieldKey)) return '';
+                    else if (this._altTitle) return this._altTitle;
+                    else return this.fieldKey;
+                }}
                 SetValue={undoable((value: string, shiftKey?: boolean, enterKey?: boolean) => {
                     if (shiftKey && enterKey) { // if shift & enter, set value of each cell in column
-                        this.setColumnValues(value, value);
+                        this.setColumnValues(value, '');
+                        this._altTitle = undefined;
                         this._props.finishEdit?.();
                         return true;
-                    }
-                    this._props.finishEdit?.(); // else save new value to header field
+                    } else if (enterKey) this.updateAlt(value);
+                    this._props.finishEdit?.(); 
                     return true;
                 }, 'edit column header')}
             />
@@ -155,12 +167,6 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea
                     width: this._props.columnWidths[this._props.columnIndex],
                 }}
                 onPointerDown={this.setupDrag}
-                // onPointerEnter={() => {
-                //     console.log(true);
-                //     this._editing = true}}
-                // onPointerLeave={() => {
-                //     console.log(false);
-                //     this._editing = false}}
                 ref={col => {
                     if (col) {
                         this._props.setColRef(this._props.columnIndex, col);
@@ -171,7 +177,7 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea
                 <div>{this.editableView}</div>
 
                 <div className="schema-header-menu">
-                    <div className="schema-header-button" onPointerDown={e => this._props.openContextMenu(e.clientX, e.clientY, this._props.columnIndex, this._fieldType)}>
+                    <div className="schema-header-button" onPointerDown={e => this._props.openContextMenu(e.clientX, e.clientY, this._props.columnIndex)}>
                         <FontAwesomeIcon icon="ellipsis-h" />
                     </div>
                     <div className="schema-sort-button" onPointerDown={this.sortClicked} style={this._props.sortField === this.fieldKey ? { backgroundColor: Colors.MEDIUM_BLUE } : {}}>