feat: filter strategy (#640)

* feat: filter strategy abstract class * feat: filter strategy adjusted to column type strategy * fix: lint issues * feat: column included in strategy methods * feat: tests updated * fix: fixed linting issues --------- Co-authored-by: markuczy <[email protected]>
onecx · Jan 20, 2025 · 85fd00c · 85fd00c
1 parent 60d9de7
commit 85fd00c
Show file tree

Hide file tree

Showing 10 changed files with 468 additions and 18 deletions.
diff --git a/libs/angular-accelerator/src/index.ts b/libs/angular-accelerator/src/index.ts
@@ -55,6 +55,7 @@ export * from './lib/functions/at-least-one-field-filled-validator'
 export * from './lib/utils/async-translate-loader.utils'
 export * from './lib/utils/caching-translate-loader.utils'
 export * from './lib/utils/colorutils'
+export * from './lib/utils/data-operation-strategy'
 export * from './lib/utils/create-translate-loader.utils'
 export * from './lib/utils/dateutils'
 export * from './lib/utils/objectutils'

diff --git a/libs/angular-accelerator/src/lib/components/data-sort-base/data-sort-base.ts b/libs/angular-accelerator/src/lib/components/data-sort-base/data-sort-base.ts
@@ -80,11 +80,13 @@ export class DataSortBase {
                 )?.toString()
                 switch (filter.filterType) {
                   case undefined:
-                  case FilterType.EQUAL:
+                  case FilterType.EQUALS:
                     return value === String(filter.value)
-                  case FilterType.TRUTHY: {
+                  case FilterType.IS_NOT_EMPTY: {
                     return filter.value ? !!value : !value
                   }
+                  default:
+                    return true
                 }
               })
           )

diff --git a/libs/angular-accelerator/src/lib/components/data-table/data-table.component.html b/libs/angular-accelerator/src/lib/components/data-table/data-table.component.html
@@ -164,7 +164,7 @@
                   <ng-container *ngIf="columnFilterTemplates$ | async as columnFilterTemplates">
                     <p-multiSelect
                       class="filterMultiSelect"
-                      *ngIf="column.filterable && (!column.filterType || column.filterType === FilterType.EQUAL)"
+                      *ngIf="column.filterable && (!column.filterType || column.filterType === FilterType.EQUALS)"
                       [options]="equalFilterOptions.column?.id === column.id ? equalFilterOptions.options : []"
                       [ngModel]="(currentEqualSelectedFilters$ | async) || []"
                       [showToggleAll]="true"
@@ -202,7 +202,7 @@
                 </ng-container>
                 <p-multiSelect
                   class="filterMultiSelect"
-                  *ngIf="column.filterable && column.filterType === FilterType.TRUTHY"
+                  *ngIf="column.filterable && column.filterType === FilterType.IS_NOT_EMPTY"
                   [options]="truthyFilterOptions"
                   [ngModel]="(currentTruthySelectedFilters$ | async) || []"
                   [showToggleAll]="true"

diff --git a/libs/angular-accelerator/src/lib/components/data-table/data-table.component.ts b/libs/angular-accelerator/src/lib/components/data-table/data-table.component.ts
@@ -454,7 +454,7 @@ export class DataTableComponent extends DataSortBase implements OnInit, AfterCon
         return filters
           .filter(
             (filter) =>
-              filter.columnId === currentFilterColumn?.id && currentFilterColumn.filterType === FilterType.TRUTHY
+              filter.columnId === currentFilterColumn?.id && currentFilterColumn.filterType === FilterType.IS_NOT_EMPTY
           )
           .map((filter) => filter.value)
       })
@@ -465,15 +465,15 @@ export class DataTableComponent extends DataSortBase implements OnInit, AfterCon
           .filter(
             (filter) =>
               filter.columnId === currentFilterColumn?.id &&
-              (!currentFilterColumn.filterType || currentFilterColumn.filterType === FilterType.EQUAL)
+              (!currentFilterColumn.filterType || currentFilterColumn.filterType === FilterType.EQUALS)
           )
           .map((filter) => filter.value)
       })
     )
     this.currentEqualFilterOptions$ = combineLatest([this._rows$, this.currentFilterColumn$, this._filters$]).pipe(
       filter(
         ([_, currentFilterColumn, __]) =>
-          !currentFilterColumn?.filterType || currentFilterColumn.filterType === FilterType.EQUAL
+          !currentFilterColumn?.filterType || currentFilterColumn.filterType === FilterType.EQUALS
       ),
       mergeMap(([rows, currentFilterColumn, filters]) => {
         if (!currentFilterColumn?.id) {
@@ -484,7 +484,7 @@ export class DataTableComponent extends DataSortBase implements OnInit, AfterCon
           .filter(
             (filter) =>
               filter.columnId === currentFilterColumn?.id &&
-              (!currentFilterColumn.filterType || currentFilterColumn.filterType === FilterType.EQUAL)
+              (!currentFilterColumn.filterType || currentFilterColumn.filterType === FilterType.EQUALS)
           )
           .map((filter) => filter.value)
 

diff --git a/libs/angular-accelerator/src/lib/components/filter-view/filter-view.component.html b/libs/angular-accelerator/src/lib/components/filter-view/filter-view.component.html
@@ -45,15 +45,15 @@
                       style="white-space: nowrap"
                       class="p-chip-text flex flex-nowrap"
                       >{{column?.nameKey ?? '' | translate }}:<ng-container
-                        *ngIf="filter.filterType === FilterType.EQUAL || !filter.filterType"
+                        *ngIf="filter.filterType === FilterType.EQUALS || !filter.filterType"
                         [ngTemplateOutlet]="chipTemplate"
                         [ngTemplateOutletContext]="{
                         templates: templates,
                         filter: filter,
                         column: column
                       }"
                       ></ng-container>
-                      <ng-container *ngIf="filter.filterType === FilterType.TRUTHY">
+                      <ng-container *ngIf="filter.filterType === FilterType.IS_NOT_EMPTY">
                         <ng-container
                           [ngTemplateOutlet]="truthyTemplate"
                           [ngTemplateOutletContext]="{
@@ -152,7 +152,7 @@
               <ng-template pTemplate="valueIdCell" let-rowObject="rowObject" let-column="column">
                 <ng-container *ngIf="getColumn(rowObject['valueColumnId'], columns) as valueColumn">
                   <ng-container
-                    *ngIf="!valueColumn.filterType || valueColumn.filterType === FilterType.EQUAL"
+                    *ngIf="!valueColumn.filterType || valueColumn.filterType === FilterType.EQUALS"
                     [ngTemplateOutlet]="templates[valueColumn.id]"
                     [ngTemplateOutletContext]="{
               rowObject: getRowForValueColumn(rowObject),
@@ -161,7 +161,7 @@
                   >
                   </ng-container>
                   <ng-container
-                    *ngIf="valueColumn.filterType === FilterType.TRUTHY"
+                    *ngIf="valueColumn.filterType === FilterType.IS_NOT_EMPTY"
                     [ngTemplateOutlet]="truthyTemplate"
                     [ngTemplateOutletContext]="{
         value: resolveFieldData(rowObject, column.id)

diff --git a/...elerator/src/lib/components/interactive-data-view/interactive-data-view.component.spec.ts b/...elerator/src/lib/components/interactive-data-view/interactive-data-view.component.spec.ts
@@ -240,7 +240,7 @@ describe('InteractiveDataViewComponent', () => {
       nameKey: 'COLUMN_HEADER_NAME.TEST_TRUTHY',
       filterable: true,
       sortable: true,
-      filterType: FilterType.TRUTHY,
+      filterType: FilterType.IS_NOT_EMPTY,
       predefinedGroupKeys: ['PREDEFINED_GROUP.EXTENDED', 'PREDEFINED_GROUP.FULL'],
     },
   ]
@@ -308,7 +308,7 @@ describe('InteractiveDataViewComponent', () => {
     editItemEvent = undefined
     deleteItemEvent = undefined
 
-    console.log("Global IntersectionObserver", global.IntersectionObserver)
+    console.log('Global IntersectionObserver', global.IntersectionObserver)
   })
 
   it('should create', () => {

diff --git a/libs/angular-accelerator/src/lib/components/interactive-data-view/storybook-config.ts b/libs/angular-accelerator/src/lib/components/interactive-data-view/storybook-config.ts
@@ -139,7 +139,7 @@ export const defaultInteractiveDataViewArgs = {
       nameKey: 'Available',
       sortable: false,
       filterable: true,
-      filterType: FilterType.TRUTHY,
+      filterType: FilterType.IS_NOT_EMPTY,
       predefinedGroupKeys: ['test2'],
     },
     {

diff --git a/libs/angular-accelerator/src/lib/model/filter.model.ts b/libs/angular-accelerator/src/lib/model/filter.model.ts
@@ -2,9 +2,21 @@ export interface ColumnFilterDataSelectOptions {
   reverse: boolean
 }
 
-export type Filter = { columnId: string; value: unknown; filterType?: FilterType }
+export type FilterObject = { columnId: string; filterType?: FilterType }
+
+export type Filter = FilterObject & { value: unknown }
 
 export enum FilterType {
-  EQUAL = 'EQUAL',
-  TRUTHY = 'TRUTHY',
+  ENDS_WITH = 'endsWith',
+  STARTS_WITH = 'startsWith',
+  CONTAINS = 'contains',
+  NOT_CONTAINS = 'notContains',
+  EQUALS = 'equals',
+  NOT_EQUALS = 'notEquals',
+  LESS_THAN = 'lessThan',
+  GREATER_THAN = 'greaterThan',
+  LESS_THAN_OR_EQUAL = 'lessThanOrEqual',
+  GREATER_THAN_OR_EQUAL = 'greaterThanOrEqual',
+  IS_EMPTY = 'isEmpty',
+  IS_NOT_EMPTY = 'isNotEmpty',
 }