diff options
4 files changed, 23 insertions, 11 deletions
diff --git a/src/client/views/collections/CollectionSchemaHeaders.tsx b/src/client/views/collections/CollectionSchemaHeaders.tsx index aaa2e6096..b84b75172 100644 --- a/src/client/views/collections/CollectionSchemaHeaders.tsx +++ b/src/client/views/collections/CollectionSchemaHeaders.tsx @@ -376,7 +376,7 @@ export class KeysDropdown extends React.Component<KeysDropdownProps> { <input className="keys-search" ref={this._inputRef} type="text" value={this._searchTerm} placeholder="Column key" onKeyDown={this.onKeyDown} onChange={e => this.onChange(e.target.value)} onClick={(e) => { - this._inputRef.current!.select(); + //this._inputRef.current!.select(); e.stopPropagation(); }} onFocus={this.onFocus} onBlur={this.onBlur}></input> <div className="keys-options-wrapper" onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerOut}> diff --git a/src/client/views/collections/CollectionSchemaView.scss b/src/client/views/collections/CollectionSchemaView.scss index a0bbae88f..a21249c58 100644 --- a/src/client/views/collections/CollectionSchemaView.scss +++ b/src/client/views/collections/CollectionSchemaView.scss @@ -182,6 +182,9 @@ color: gray; z-index: 10000; overflow-y: visible; + display: flex; + justify-content: space-between; + flex-wrap: wrap; .collectionSchema-header-menu { height: 100%; diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx index 9cd13058f..900949b94 100644 --- a/src/client/views/collections/CollectionSchemaView.tsx +++ b/src/client/views/collections/CollectionSchemaView.tsx @@ -299,20 +299,24 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) { @action closeHeader = () => { this._headerOpen = false; } + renderKeysDropDown = (col: any) => { + return <KeysDropdown + keyValue={col.heading} + possibleKeys={this.possibleKeys} + existingKeys={this.columns.map(c => c.heading)} + canAddNew={true} + addNew={false} + onSelect={this.changeColumns} + setIsEditing={this.setHeaderIsEditing} + />; + } + renderContent = (col: any) => { return ( <div className="collectionSchema-header-menuOptions"> <div className="collectionSchema-headerMenu-group"> <label>Key:</label> - <KeysDropdown - keyValue={col.heading} - possibleKeys={this.possibleKeys} - existingKeys={this.columns.map(c => c.heading)} - canAddNew={true} - addNew={false} - onSelect={this.changeColumns} - setIsEditing={this.setHeaderIsEditing} - /> + {this.renderKeysDropDown(col)} </div> {false ? <></> : <> diff --git a/src/client/views/collections/SchemaTable.tsx b/src/client/views/collections/SchemaTable.tsx index 97d4bb303..b9df2fe6b 100644 --- a/src/client/views/collections/SchemaTable.tsx +++ b/src/client/views/collections/SchemaTable.tsx @@ -163,15 +163,20 @@ export class SchemaTable extends React.Component<SchemaTableProps> { const menuContent = <div><FontAwesomeIcon icon={icon} size="sm" /> {col.heading}</div>; + const header = <div className="collectionSchemaView-header" - onClick={e => this.props.openHeader(col, menuContent, e.clientX, e.clientY)} + //onClick={e => this.props.openHeader(col, menuContent, e.clientX, e.clientY)} style={{ background: col.color, padding: "4px", letterSpacing: "2px", textTransform: "uppercase" }}> {menuContent} + <div onClick={e => this.props.openHeader(col, menuContent, e.clientX, e.clientY)} + style={{ float: "right" }}> + <FontAwesomeIcon icon={"caret-down"} size="2x" /> + </div> </div>; return { |