lots of UI improvements

1 files changed, 11 insertions, 8 deletions

diff --git a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
index 03cf64fc8..bda9fc9b7 100644
--- a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
@@ -57,6 +57,11 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea
     @computed get fieldKey() {
         return this._props.columnKeys[this._props.columnIndex];
     }
+
+    constructor(props: SchemaColumnHeaderProps){
+        super(props);
+        this._props.schemaView.openColumnMenu(0, false)
+    }
     
     getFinfo = computedFn((fieldKey: string) => this._props.schemaView?.fieldInfos.get(fieldKey));
     setColumnValues = (field: string, defaultValue: string) => {this._props.schemaView?.setKey(field, defaultValue, this._props.columnIndex);}
@@ -77,10 +82,7 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea
     };
 
     openKeyDropdown = () => {
-        if (this.isDefaultTitle(this.fieldKey)){
-            this._props.schemaView.openColumnMenu(this._props.columnIndex, false)
-            this._displayKeysDropdown = true;
-        }
+        this._props.schemaView.openColumnMenu(this._props.columnIndex, false)
     }
 
     @action
@@ -125,7 +127,7 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea
     @computed get editableView() {
         const { color, fieldProps, pointerEvents } = this.renderProps(this._props); 
 
-        return <div className='schema-column-edit-wrapper' onPointerUp={() => this.openKeyDropdown()}
+        return <div className='schema-column-edit-wrapper' onPointerUp={() => {SchemaColumnHeader.isDefaultField(this.fieldKey) && this.openKeyDropdown()}}
         style={{
             color,
             width: '100%',
@@ -138,11 +140,12 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea
                 contents={undefined}
                 fieldContents={fieldProps}
                 editing={undefined}  
+                placeholder={'Add key'}
                 updateAlt={this.updateAlt} // alternate title to display
                 updateSearch={this.updateKeyDropdown}
-                showKeyNotVal={true} // tells the EditableView to display the fieldKey itself, and not its value
+                schemaHeader={true} 
                 GetValue={() => {
-                    if (this.isDefaultTitle(this.fieldKey)) return '';
+                    if (SchemaColumnHeader.isDefaultField(this.fieldKey)) return '';
                     else if (this._altTitle) return this._altTitle;
                     else return this.fieldKey;
                 }}
@@ -160,7 +163,7 @@ export class SchemaColumnHeader extends ObservableReactComponent<SchemaColumnHea
             </div>
     }
 
-    isDefaultTitle = (key: string) => {
+    public static isDefaultField = (key: string) => {
         const defaultPattern = /EmptyColumnKey/;
         let isDefault: boolean = (defaultPattern.exec(key) != null);
         return isDefault;