diff options
-rw-r--r-- | src/client/views/collections/collectionSchema/CollectionSchemaView.tsx | 34 |
1 files changed, 20 insertions, 14 deletions
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx index d8f69b26a..966552cd2 100644 --- a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx +++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx @@ -199,7 +199,7 @@ export class CollectionSchemaView extends CollectionSubView() { {fireImmediately: true} ) this._disposers.sortHighlight = reaction( - () => [this.sortField, this._docs], + () => [this.sortField, this._docs, this._selectedDocs, this._highlightedCells], () => {setTimeout(() => this.highlightSortedColumn(), 5)}, {fireImmediately: true} ) @@ -401,8 +401,6 @@ export class CollectionSchemaView extends CollectionSubView() { const currWidths = this.storedColumnWidths.slice(); currWidths.splice(toIndex, 0, currWidths.splice(fromIndex, 1)[0]); this.layoutDoc.schema_columnWidths = new List<number>(currWidths); - - this._draggedColIndex = toIndex; }; @action @@ -479,27 +477,28 @@ export class CollectionSchemaView extends CollectionSubView() { highlightDraggedColumn = (index: number) => this._colEles.forEach((colRef, i) => { const edgeStyle = i === index ? `solid 2px ${Colors.MEDIUM_BLUE}` : ''; + const sorted = i === this.columnKeys.indexOf(this.sortField); + console.log(sorted) const cellEles = [ colRef, ...this.docsWithDrag.docs - .filter(doc => i !== this._selectedCol || !this._selectedDocs.includes(doc) || this.columnKeys.indexOf(this.sortField)) + .filter(doc => (i !== this._selectedCol || !this._selectedDocs.includes(doc)) && !sorted) .map(doc => this._rowEles.get(doc).children[1].children[i]), ]; - cellEles[0].style.borderTop = edgeStyle; + !sorted && (cellEles[0].style.borderTop = edgeStyle); cellEles.forEach(ele => { + if (ele === cellEles[0] && sorted) return; ele.style.borderLeft = edgeStyle; ele.style.borderRight = edgeStyle; }); - cellEles.slice(-1)[0].style.borderBottom = edgeStyle; + !sorted && (cellEles.slice(-1)[0].style.borderBottom = edgeStyle); }); highlightSortedColumn = (field?: string, descending?: boolean) => { - console.log('field: ' + field + ' desc: ' + descending); let index = -1; let highlightColors: string[] = []; if (field || this.sortField){ index = this.columnKeys.indexOf(field || this.sortField); - //console.log(index) const rowCount: number = this._rowEles.size + 1; const increment: number = 100/rowCount; for (let i = 0; i < rowCount; ++i){ @@ -511,7 +510,6 @@ export class CollectionSchemaView extends CollectionSubView() { this._colEles.forEach((colRef, i) => { const highlight: boolean = i === index; const desc: boolean = descending || this.sortDesc; - //console.log(desc) const cellEles = [ colRef, ...this.docsWithDrag.docs @@ -546,7 +544,7 @@ export class CollectionSchemaView extends CollectionSubView() { while ((match = pattern.exec(text)) !== null) { const docRef = match[1] === 'this' ? match[1] : match[2]; - matches.push({ docRef, field: match[3] }); + matches.push({ docRef, field: match[3] }); } const cells: Array<any> = []; @@ -674,7 +672,9 @@ export class CollectionSchemaView extends CollectionSubView() { e.stopPropagation(); this._colEles.forEach((colRef, i) => { - // style for menu cell + const sorted = i === this.columnKeys.indexOf(this.sortField); + if (sorted) return; + colRef.style.borderLeft = ''; colRef.style.borderRight = ''; colRef.style.borderTop = ''; @@ -1161,7 +1161,8 @@ export class CollectionSchemaView extends CollectionSubView() { const newIndex = this.findColDropIndex(e.clientX); if (newIndex !== this._draggedColIndex) this.moveColumn(this._draggedColIndex, newIndex ?? this._draggedColIndex); this._draggedColIndex = newIndex || this._draggedColIndex; - this.highlightDraggedColumn(newIndex ?? this._draggedColIndex); + this.highlightSortedColumn(); //TODO: Make this more efficient + !(this.sortField && this._draggedColIndex === this.columnKeys.indexOf(this.sortField)) && this.highlightDraggedColumn(newIndex ?? this._draggedColIndex); } }; @@ -1189,8 +1190,13 @@ export class CollectionSchemaView extends CollectionSubView() { } sortDocs = (field: string, desc: boolean, persistent?: boolean) => { - const numbers: Doc[] = this._docs.filter(doc => !isNaN(Number(Field.toString(doc[field] as FieldType)))); - const strings = this._docs.filter(doc => !numbers.includes(doc)); + const numbers: Doc[] = []; + const strings: Doc[] = []; + + this._docs.forEach(doc => { + if (!isNaN(Number(Field.toString(doc[field] as FieldType)))) numbers.push(doc); + else strings.push(doc); + }); const sortedNums = numbers.sort((numOne, numTwo) => { const numA = Number(Field.toString(numOne[field] as FieldType)); |