diff --git a/apps/red-ui/src/app/modules/shared/base/base-listing.component.ts b/apps/red-ui/src/app/modules/shared/base/base-listing.component.ts index 3407e66c7..21ff8dba9 100644 --- a/apps/red-ui/src/app/modules/shared/base/base-listing.component.ts +++ b/apps/red-ui/src/app/modules/shared/base/base-listing.component.ts @@ -24,9 +24,27 @@ export abstract class BaseListingComponent { // ---- // Overwrite in child class: - protected abstract readonly _searchKey: string; - protected abstract readonly _selectionKey: string; - protected abstract readonly _sortKey: ScreenName; + protected readonly _searchKey: string; + protected readonly _selectionKey: string; + protected readonly _sortKey: ScreenName; + + private get _getSearchKey(): string { + if (!this._searchKey) throw new Error('Not implemented'); + + return this._searchKey; + } + + private get _getSelectionKey(): string { + if (!this._selectionKey) throw new Error('Not implemented'); + + return this._selectionKey; + } + + private get _getSortKey(): ScreenName { + if (!this._sortKey) throw new Error('Not implemented'); + + return this._sortKey; + } protected get _filters(): { values: FilterModel[]; checker: Function; matchAll?: boolean; checkerArgs?: any }[] { return []; @@ -41,8 +59,9 @@ export abstract class BaseListingComponent { } protected _searchField(entity: T): string { - return entity[this._searchKey]; + return entity[this._getSearchKey]; } + // ---- protected constructor(protected readonly _injector: Injector) { @@ -75,8 +94,10 @@ export abstract class BaseListingComponent { } protected _updateSelection() { - if (this._selectionKey) { - this.selectedEntitiesIds = this.displayedEntities.map((entity) => entity[this._selectionKey]).filter((id) => this.selectedEntitiesIds.includes(id)); + if (this._getSelectionKey) { + this.selectedEntitiesIds = this.displayedEntities + .map((entity) => entity[this._getSelectionKey]) + .filter((id) => this.selectedEntitiesIds.includes(id)); } } @@ -119,9 +140,9 @@ export abstract class BaseListingComponent { toggleEntitySelected($event: MouseEvent, entity: T) { $event.stopPropagation(); - const idx = this.selectedEntitiesIds.indexOf(entity[this._selectionKey]); + const idx = this.selectedEntitiesIds.indexOf(entity[this._getSelectionKey]); if (idx === -1) { - this.selectedEntitiesIds.push(entity[this._selectionKey]); + this.selectedEntitiesIds.push(entity[this._getSelectionKey]); } else { this.selectedEntitiesIds.splice(idx, 1); } @@ -131,7 +152,7 @@ export abstract class BaseListingComponent { if (this.areSomeEntitiesSelected) { this.selectedEntitiesIds = []; } else { - this.selectedEntitiesIds = this.displayedEntities.map((entity) => entity[this._selectionKey]); + this.selectedEntitiesIds = this.displayedEntities.map((entity) => entity[this._getSelectionKey]); } } @@ -144,16 +165,16 @@ export abstract class BaseListingComponent { } isEntitySelected(entity: T) { - return this.selectedEntitiesIds.indexOf(entity[this._selectionKey]) !== -1; + return this.selectedEntitiesIds.indexOf(entity[this._getSelectionKey]) !== -1; } // Sort get sortingOption(): SortingOption { - return this._sortingService.getSortingOption(this._sortKey); + return this._sortingService.getSortingOption(this._getSortKey); } toggleSort($event) { - this._sortingService.toggleSort(this._sortKey, $event); + this._sortingService.toggleSort(this._getSortKey, $event); } } diff --git a/apps/red-ui/src/app/modules/shared/shared.module.ts b/apps/red-ui/src/app/modules/shared/shared.module.ts index 02df28aba..edb7b8ac6 100644 --- a/apps/red-ui/src/app/modules/shared/shared.module.ts +++ b/apps/red-ui/src/app/modules/shared/shared.module.ts @@ -26,7 +26,6 @@ import { HiddenActionComponent } from './components/hidden-action/hidden-action. import { ConfirmationDialogComponent } from './dialogs/confirmation-dialog/confirmation-dialog.component'; import { FilterComponent } from './components/filter/filter.component'; import { EmptyStateComponent } from './components/empty-state/empty-state.component'; -import { BaseListingComponent } from './base/base-listing.component'; import { SortByPipe } from './components/sort-pipe/sort-by.pipe'; import { RoundCheckboxComponent } from './components/checkbox/round-checkbox.component'; import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core'; @@ -50,7 +49,6 @@ const components = [ FilterComponent, ConfirmationDialogComponent, EmptyStateComponent, - BaseListingComponent, SortByPipe, RoundCheckboxComponent, SelectComponent,