added external drop and column resize

1 files changed, 7 insertions, 1 deletions

diff --git a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
index f93a3d13d..bee76bb24 100644
--- a/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaColumnHeader.tsx
@@ -12,6 +12,7 @@ export interface SchemaColumnHeaderProps {
     changeColumnKey: (index: number, newKey: string) => boolean;
     addColumn: (index: number) => void;
     removeColumn: (index: number) => void;
+    resizeColumn: (e: any, index: number, left: boolean) => void;
 }
 
 @observer
@@ -23,7 +24,10 @@ export class SchemaColumnHeader extends React.Component<SchemaColumnHeaderProps>
     render() {
         return (
             <div className="schema-column-header" style={{ width: this.props.columnWidths[this.props.columnIndex] }}>
-                <EditableView SetValue={(newKey: string) => this.props.changeColumnKey(this.props.columnIndex, newKey)} GetValue={() => this.fieldKey} contents={this.fieldKey} />
+                <div className="schema-column-resizer left" onPointerDown={e => this.props.resizeColumn(e, this.props.columnIndex, true)}></div>
+                <div className="schema-column-title">
+                    <EditableView SetValue={(newKey: string) => this.props.changeColumnKey(this.props.columnIndex, newKey)} GetValue={() => this.fieldKey} contents={this.fieldKey} />
+                </div>
 
                 <div className="schema-header-menu">
                     <div
@@ -41,6 +45,8 @@ export class SchemaColumnHeader extends React.Component<SchemaColumnHeaderProps>
                         <FontAwesomeIcon icon="trash" />
                     </div>
                 </div>
+
+                <div className="schema-column-resizer right" onPointerDown={e => this.props.resizeColumn(e, this.props.columnIndex, false)}></div>
             </div>
         );
     }