From 8da249005f78f99db57d017c528cc3c49023c024 Mon Sep 17 00:00:00 2001 From: Thomas <4159106+dtslvr@users.noreply.github.com> Date: Sun, 15 May 2022 21:22:35 +0200 Subject: [PATCH] Refactor filtering in activities table --- .../src/lib/interfaces/filter.interface.ts | 2 +- .../activities-filter.component.ts | 14 ++-- .../activities-table.component.ts | 78 ++++++++++--------- 3 files changed, 49 insertions(+), 45 deletions(-) diff --git a/libs/common/src/lib/interfaces/filter.interface.ts b/libs/common/src/lib/interfaces/filter.interface.ts index 7a7e79988..a4280f4f4 100644 --- a/libs/common/src/lib/interfaces/filter.interface.ts +++ b/libs/common/src/lib/interfaces/filter.interface.ts @@ -1,5 +1,5 @@ export interface Filter { id: string; label?: string; - type: 'ACCOUNT' | 'TAG'; + type: 'ACCOUNT' | 'SYMBOL' | 'TAG'; } diff --git a/libs/ui/src/lib/activities-filter/activities-filter.component.ts b/libs/ui/src/lib/activities-filter/activities-filter.component.ts index 33869e1c4..2be3f8a49 100644 --- a/libs/ui/src/lib/activities-filter/activities-filter.component.ts +++ b/libs/ui/src/lib/activities-filter/activities-filter.component.ts @@ -141,12 +141,14 @@ export class ActivitiesFilterComponent implements OnChanges, OnDestroy { }); } - return filterGroups.map((filterGroup) => { - return { - ...filterGroup, - filters: filterGroup.filters - }; - }); + return filterGroups + .sort((a, b) => a.name.localeCompare(b.name)) + .map((filterGroup) => { + return { + ...filterGroup, + filters: filterGroup.filters + }; + }); } private updateFilters() { diff --git a/libs/ui/src/lib/activities-table/activities-table.component.ts b/libs/ui/src/lib/activities-table/activities-table.component.ts index 724537c4f..6f73b0b48 100644 --- a/libs/ui/src/lib/activities-table/activities-table.component.ts +++ b/libs/ui/src/lib/activities-table/activities-table.component.ts @@ -105,17 +105,17 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy { this.defaultDateFormat = getDateFormatString(this.locale); if (this.activities) { - this.allFilters = this.getSearchableFieldValues(this.activities).map( - (label) => { - return { label, id: label, type: 'TAG' }; - } - ); + this.allFilters = this.getSearchableFieldValues(this.activities); this.dataSource = new MatTableDataSource(this.activities); this.dataSource.filterPredicate = (data, filter) => { const dataString = this.getFilterableValues(data) + .map((currentFilter) => { + return currentFilter.label; + }) .join(' ') .toLowerCase(); + let contains = true; for (const singleFilter of filter.split(SEARCH_STRING_SEPARATOR)) { contains = @@ -190,50 +190,51 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy { private getFilterableValues( activity: OrderWithAccount, - fieldValues: Set = new Set() - ): string[] { - fieldValues.add(activity.Account?.name); - fieldValues.add(activity.Account?.Platform?.name); - fieldValues.add(activity.SymbolProfile.currency); + fieldValueMap: { [id: string]: Filter } = {} + ): Filter[] { + fieldValueMap[activity.Account?.id] = { + id: activity.Account?.id, + label: activity.Account?.name, + type: 'ACCOUNT' + }; + + fieldValueMap[activity.SymbolProfile.currency] = { + id: activity.SymbolProfile.currency, + label: activity.SymbolProfile.currency, + type: 'TAG' + }; if (!isUUID(activity.SymbolProfile.symbol)) { - fieldValues.add(activity.SymbolProfile.symbol); + fieldValueMap[activity.SymbolProfile.symbol] = { + id: activity.SymbolProfile.symbol, + label: activity.SymbolProfile.symbol, + type: 'SYMBOL' + }; } - fieldValues.add(activity.type); - fieldValues.add(format(activity.date, 'yyyy')); + fieldValueMap[activity.type] = { + id: activity.type, + label: activity.type, + type: 'TAG' + }; - return [...fieldValues].filter((item) => { - return item !== undefined; - }); + fieldValueMap[format(activity.date, 'yyyy')] = { + id: format(activity.date, 'yyyy'), + label: format(activity.date, 'yyyy'), + type: 'TAG' + }; + + return Object.values(fieldValueMap); } - private getSearchableFieldValues(activities: OrderWithAccount[]): string[] { - const fieldValues = new Set(); + private getSearchableFieldValues(activities: OrderWithAccount[]): Filter[] { + const fieldValueMap: { [id: string]: Filter } = {}; for (const activity of activities) { - this.getFilterableValues(activity, fieldValues); + this.getFilterableValues(activity, fieldValueMap); } - return [...fieldValues] - .filter((item) => { - return item !== undefined; - }) - .sort((a, b) => { - const aFirstChar = a.charAt(0); - const bFirstChar = b.charAt(0); - const isANumber = aFirstChar >= '0' && aFirstChar <= '9'; - const isBNumber = bFirstChar >= '0' && bFirstChar <= '9'; - - // Sort priority: text, followed by numbers - if (isANumber && !isBNumber) { - return 1; - } else if (!isANumber && isBNumber) { - return -1; - } else { - return a.toLowerCase() < b.toLowerCase() ? -1 : 1; - } - }); + return Object.values(fieldValueMap); } private getTotalFees() { @@ -276,6 +277,7 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy { return filter.label; }) .join(SEARCH_STRING_SEPARATOR); + const lowercaseSearchKeywords = filters.map((filter) => { return filter.label.trim().toLowerCase(); });