From a84cc03daef85462eda69221eac6bea09e58ee6a Mon Sep 17 00:00:00 2001 From: Dan Percic Date: Sat, 7 Aug 2021 16:57:23 +0300 Subject: [PATCH] move entities service to common lib --- .../downloads-list-screen.component.html | 4 +- .../downloads-list-screen.component.ts | 4 +- .../active-fields-listing.component.html | 10 +- .../active-fields-listing.component.ts | 19 +-- ...-attributes-csv-import-dialog.component.ts | 2 +- .../default-colors-screen.component.html | 2 +- .../default-colors-screen.component.ts | 2 +- .../dictionary-listing-screen.component.html | 12 +- .../dictionary-listing-screen.component.ts | 8 +- ...r-attributes-listing-screen.component.html | 15 +- ...ier-attributes-listing-screen.component.ts | 4 +- ...er-templates-listing-screen.component.html | 10 +- ...sier-templates-listing-screen.component.ts | 8 +- ...e-attributes-listing-screen.component.html | 12 +- ...ile-attributes-listing-screen.component.ts | 4 +- .../screens/trash/trash-screen.component.html | 14 +- .../screens/trash/trash-screen.component.ts | 14 +- .../user-listing-screen.component.html | 8 +- .../user-listing-screen.component.ts | 6 +- ...dossier-overview-bulk-actions.component.ts | 9 +- .../dossier-listing-screen.component.html | 4 +- .../dossier-listing-screen.component.ts | 10 +- .../dossier-overview-screen.component.html | 10 +- .../dossier-overview-screen.component.ts | 10 +- .../search-screen/search-screen.component.ts | 2 +- .../shared/base/base-listing.component.ts | 26 ++-- .../table-header/table-header.component.html | 8 +- .../table-header/table-header.component.ts | 9 +- .../shared/services/screen-state.service.ts | 133 ------------------ 29 files changed, 123 insertions(+), 256 deletions(-) delete mode 100644 apps/red-ui/src/app/modules/shared/services/screen-state.service.ts diff --git a/apps/red-ui/src/app/components/downloads-list-screen/downloads-list-screen.component.html b/apps/red-ui/src/app/components/downloads-list-screen/downloads-list-screen.component.html index 34208c997..8007a30fd 100644 --- a/apps/red-ui/src/app/components/downloads-list-screen/downloads-list-screen.component.html +++ b/apps/red-ui/src/app/components/downloads-list-screen/downloads-list-screen.component.html @@ -12,7 +12,7 @@ > @@ -74,7 +74,7 @@ d.storageId); + const storageIds = (downloads || this.entitiesService.selected).map(d => d.storageId); await this._downloadControllerService.deleteDownload({ storageIds }).toPromise(); await this._loadData(); } private async _loadData() { await this.fileDownloadService.getDownloadStatus().toPromise(); - this.screenStateService.setEntities(this.fileDownloadService.downloads); + this.entitiesService.setEntities(this.fileDownloadService.downloads); } } diff --git a/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/active-fields-listing/active-fields-listing.component.html b/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/active-fields-listing/active-fields-listing.component.html index 162b8475f..d2637374c 100644 --- a/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/active-fields-listing/active-fields-listing.component.html +++ b/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/active-fields-listing/active-fields-listing.component.html @@ -1,14 +1,14 @@
- {{ 'file-attributes-csv-import.table-header.title' | translate: { length: (screenStateService.allEntitiesLength$ | async) } }} + {{ 'file-attributes-csv-import.table-header.title' | translate: { length: (entitiesService.allLength$ | async) } }} - + diff --git a/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/active-fields-listing/active-fields-listing.component.ts b/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/active-fields-listing/active-fields-listing.component.ts index 5f571b70c..016cdcc13 100644 --- a/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/active-fields-listing/active-fields-listing.component.ts +++ b/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/active-fields-listing/active-fields-listing.component.ts @@ -12,37 +12,40 @@ import { fileAttributeTypesTranslations } from '../../../translations/file-attri providers: [...DefaultListingServices] }) export class ActiveFieldsListingComponent extends BaseListingComponent implements OnChanges { + protected readonly _primaryKey = 'csvColumn'; readonly circleButtonTypes = CircleButtonTypes; readonly translations = fileAttributeTypesTranslations; + readonly typeOptions = [ + FileAttributeConfig.TypeEnum.TEXT, + FileAttributeConfig.TypeEnum.NUMBER, + FileAttributeConfig.TypeEnum.DATE + ] as const; @Input() entities: Field[]; @Output() entitiesChange = new EventEmitter(); @Output() setHoveredColumn = new EventEmitter(); @Output() toggleFieldActive = new EventEmitter(); - readonly typeOptions = [FileAttributeConfig.TypeEnum.TEXT, FileAttributeConfig.TypeEnum.NUMBER, FileAttributeConfig.TypeEnum.DATE]; - protected readonly _primaryKey = 'csvColumn'; - constructor(protected readonly _injector: Injector) { super(_injector); } ngOnChanges(changes: SimpleChanges): void { if (changes.entities) { - this.screenStateService.setEntities(this.entities); - this.screenStateService.updateSelection(); + this.entitiesService.setEntities(this.entities); + this.entitiesService.updateSelection(); } } deactivateSelection() { this.allEntities.filter(field => this.isSelected(field)).forEach(field => (field.primaryAttribute = false)); - this.screenStateService.setEntities(this.allEntities.filter(field => !this.isSelected(field))); + this.entitiesService.setEntities(this.allEntities.filter(field => !this.isSelected(field))); this.entitiesChange.emit(this.allEntities); - this.screenStateService.setSelectedEntities([]); + this.entitiesService.setSelected([]); } setAttributeForSelection(attribute: string, value: any) { - for (const item of this.screenStateService.selectedEntities) { + for (const item of this.entitiesService.selected) { this.allEntities.find(f => f.csvColumn === item.csvColumn)[attribute] = value; } } diff --git a/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component.ts b/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component.ts index c9c1682c3..8ccc251f2 100644 --- a/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component.ts +++ b/apps/red-ui/src/app/modules/admin/dialogs/file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component.ts @@ -93,7 +93,7 @@ export class FileAttributesCsvImportDialogComponent extends BaseListingComponent this.parseResult.meta.fields = Object.keys(this.parseResult.data[0]); } - this.screenStateService.setEntities(this.parseResult.meta.fields.map(field => this._buildAttribute(field))); + this.entitiesService.setEntities(this.parseResult.meta.fields.map(field => this._buildAttribute(field))); this.activeFields = []; for (const entity of this.allEntities) { diff --git a/apps/red-ui/src/app/modules/admin/screens/default-colors/default-colors-screen.component.html b/apps/red-ui/src/app/modules/admin/screens/default-colors/default-colors-screen.component.html index 0113d7aab..7751a4b12 100644 --- a/apps/red-ui/src/app/modules/admin/screens/default-colors/default-colors-screen.component.html +++ b/apps/red-ui/src/app/modules/admin/screens/default-colors/default-colors-screen.component.html @@ -22,7 +22,7 @@
- {{ 'default-colors-screen.table-header.title' | translate: { length: screenStateService.allEntitiesLength$ | async } }} + {{ 'default-colors-screen.table-header.title' | translate: { length: entitiesService.allLength$ | async } }}
diff --git a/apps/red-ui/src/app/modules/admin/screens/default-colors/default-colors-screen.component.ts b/apps/red-ui/src/app/modules/admin/screens/default-colors/default-colors-screen.component.ts index 764693e33..31735d502 100644 --- a/apps/red-ui/src/app/modules/admin/screens/default-colors/default-colors-screen.component.ts +++ b/apps/red-ui/src/app/modules/admin/screens/default-colors/default-colors-screen.component.ts @@ -66,7 +66,7 @@ export class DefaultColorsScreenComponent key, value: data[key] })); - this.screenStateService.setEntities(entities); + this.entitiesService.setEntities(entities); this._loadingService.stop(); } } diff --git a/apps/red-ui/src/app/modules/admin/screens/dictionary-listing/dictionary-listing-screen.component.html b/apps/red-ui/src/app/modules/admin/screens/dictionary-listing/dictionary-listing-screen.component.html index 4bfce719e..486f7251f 100644 --- a/apps/red-ui/src/app/modules/admin/screens/dictionary-listing/dictionary-listing-screen.component.html +++ b/apps/red-ui/src/app/modules/admin/screens/dictionary-listing/dictionary-listing-screen.component.html @@ -23,12 +23,12 @@
- {{ 'dictionary-listing.table-header.title' | translate: { length: (screenStateService.displayedLength$ | async) } }} + {{ 'dictionary-listing.table-header.title' | translate: { length: (entitiesService.displayedLength$ | async) } }}
-
+
{ this._loadingService.start(); await this._dictionaryControllerService @@ -61,7 +61,7 @@ export class DictionaryListingScreenComponent extends BaseListingComponent !d.virtual); if (!loadEntries) - this.screenStateService.setEntities( + this.entitiesService.setEntities( entities.map(dict => { dict.entries = this.allEntities.find(d => d.type === dict.type)?.entries || []; return dict; }) ); - else this.screenStateService.setEntities(entities); + else this.entitiesService.setEntities(entities); if (!loadEntries) return; diff --git a/apps/red-ui/src/app/modules/admin/screens/dossier-attributes-listing/dossier-attributes-listing-screen.component.html b/apps/red-ui/src/app/modules/admin/screens/dossier-attributes-listing/dossier-attributes-listing-screen.component.html index d3be62bb8..c12b709fb 100644 --- a/apps/red-ui/src/app/modules/admin/screens/dossier-attributes-listing/dossier-attributes-listing-screen.component.html +++ b/apps/red-ui/src/app/modules/admin/screens/dossier-attributes-listing/dossier-attributes-listing-screen.component.html @@ -20,23 +20,22 @@
-
+
{{ - 'dossier-attributes-listing.table-header.title' - | translate: { length: (screenStateService.displayedLength$ | async) } + 'dossier-attributes-listing.table-header.title' | translate: { length: (entitiesService.displayedLength$ | async) } }}
-
+
{ this._loadingService.start(); - const ids = dossierAttribute ? [dossierAttribute.id] : this.screenStateService.selectedEntities.map(item => item.id); + const ids = dossierAttribute ? [dossierAttribute.id] : this.entitiesService.selected.map(item => item.id); await this._dossierAttributesService.deleteConfigs(ids); await this._loadData(); }); @@ -61,7 +61,7 @@ export class DossierAttributesListingScreenComponent extends BaseListingComponen private async _loadData() { this._loadingService.start(); const attributes = await this._dossierAttributesService.getConfig(); - this.screenStateService.setEntities(attributes); + this.entitiesService.setEntities(attributes); this._loadingService.stop(); } } diff --git a/apps/red-ui/src/app/modules/admin/screens/dossier-template-listing/dossier-templates-listing-screen.component.html b/apps/red-ui/src/app/modules/admin/screens/dossier-template-listing/dossier-templates-listing-screen.component.html index 3d0b22543..bf3379f53 100644 --- a/apps/red-ui/src/app/modules/admin/screens/dossier-template-listing/dossier-templates-listing-screen.component.html +++ b/apps/red-ui/src/app/modules/admin/screens/dossier-template-listing/dossier-templates-listing-screen.component.html @@ -11,14 +11,14 @@
{{ 'dossier-templates-listing.table-header.title' - | translate: { length: (screenStateService.displayedLength$ | async) } + | translate: { length: (entitiesService.displayedLength$ | async) } }} @@ -47,7 +47,7 @@
-
+
diff --git a/apps/red-ui/src/app/modules/admin/screens/dossier-template-listing/dossier-templates-listing-screen.component.ts b/apps/red-ui/src/app/modules/admin/screens/dossier-template-listing/dossier-templates-listing-screen.component.ts index 9a3098cf3..430ceddf0 100644 --- a/apps/red-ui/src/app/modules/admin/screens/dossier-template-listing/dossier-templates-listing-screen.component.ts +++ b/apps/red-ui/src/app/modules/admin/screens/dossier-template-listing/dossier-templates-listing-screen.component.ts @@ -41,9 +41,9 @@ export class DossierTemplatesListingScreenComponent extends BaseListingComponent return this._dialogService.openDialog('confirm', $event, null, async () => { this._loadingService.start(); await this._dossierTemplateControllerService - .deleteDossierTemplates(this.screenStateService.selectedEntities.map(d => d.dossierTemplateId)) + .deleteDossierTemplates(this.entitiesService.selected.map(d => d.dossierTemplateId)) .toPromise(); - this.screenStateService.setSelectedEntities([]); + this.entitiesService.setSelected([]); await this._appStateService.loadAllDossierTemplates(); await this._appStateService.loadDictionaryData(); this.loadDossierTemplatesData(); @@ -53,7 +53,7 @@ export class DossierTemplatesListingScreenComponent extends BaseListingComponent loadDossierTemplatesData() { this._loadingService.start(); this._appStateService.reset(); - this.screenStateService.setEntities(this._appStateService.dossierTemplates); + this.entitiesService.setEntities(this._appStateService.dossierTemplates); this._loadDossierTemplateStats(); this._loadingService.stop(); } @@ -67,7 +67,7 @@ export class DossierTemplatesListingScreenComponent extends BaseListingComponent } private _loadDossierTemplateStats() { - this.screenStateService.allEntities.forEach(rs => { + this.entitiesService.all.forEach(rs => { const dictionaries = this._appStateService.dictionaryData[rs.dossierTemplateId]; if (dictionaries) { rs.dictionariesCount = Object.keys(dictionaries) diff --git a/apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-listing-screen.component.html b/apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-listing-screen.component.html index bf302b737..40423855e 100644 --- a/apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-listing-screen.component.html +++ b/apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-listing-screen.component.html @@ -23,14 +23,12 @@
- {{ - 'file-attributes-listing.table-header.title' | translate: { length: (screenStateService.displayedLength$ | async) } - }} + {{ 'file-attributes-listing.table-header.title' | translate: { length: (entitiesService.displayedLength$ | async) } }}
-
+
diff --git a/apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-listing-screen.component.ts b/apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-listing-screen.component.ts index 0048f8903..a0ba6da26 100644 --- a/apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-listing-screen.component.ts +++ b/apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-listing-screen.component.ts @@ -65,7 +65,7 @@ export class FileAttributesListingScreenComponent extends BaseListingComponent f.id), + this.entitiesService.selected.map(f => f.id), this._appStateService.activeDossierTemplateId ) .toPromise(); @@ -98,7 +98,7 @@ export class FileAttributesListingScreenComponent extends BaseListingComponent - {{ 'trash.table-header.title' | translate: { length: (screenStateService.displayedLength$ | async) } }} + {{ 'trash.table-header.title' | translate: { length: (entitiesService.displayedLength$ | async) } }}
-
+
diff --git a/apps/red-ui/src/app/modules/admin/screens/trash/trash-screen.component.ts b/apps/red-ui/src/app/modules/admin/screens/trash/trash-screen.component.ts index 3a4950bd0..e26cf9d5d 100644 --- a/apps/red-ui/src/app/modules/admin/screens/trash/trash-screen.component.ts +++ b/apps/red-ui/src/app/modules/admin/screens/trash/trash-screen.component.ts @@ -21,9 +21,9 @@ const MINUTES_IN_AN_HOUR = 60; providers: [...DefaultListingServices, DossiersService] }) export class TrashScreenComponent extends BaseListingComponent implements OnInit { - readonly circleButtonTypes = CircleButtonTypes; readonly itemSize = 80; protected readonly _primaryKey = 'dossierName'; + readonly circleButtonTypes = CircleButtonTypes; private readonly _deleteRetentionHours = this._appConfigService.getConfig(AppConfigKey.DELETE_RETENTION_HOURS); constructor( @@ -46,7 +46,7 @@ export class TrashScreenComponent extends BaseListingComponent implemen } async loadDossierTemplatesData(): Promise { - this.screenStateService.setEntities(await this._dossiersService.getDeleted()); + this.entitiesService.setEntities(await this._dossiersService.getDeleted()); } canRestore(softDeletedTime: string): boolean { @@ -66,11 +66,11 @@ export class TrashScreenComponent extends BaseListingComponent implemen return moment(softDeletedTime).add(this._deleteRetentionHours, 'hours').toISOString(); } - bulkDelete(dossiers = this.screenStateService.selectedEntities) { + bulkDelete(dossiers = this.entitiesService.selected) { this._loadingService.loadWhile(this._hardDelete(dossiers)); } - bulkRestore(dossierIds = this.screenStateService.selectedEntities.map(d => d.dossierId)) { + bulkRestore(dossierIds = this.entitiesService.selected.map(d => d.dossierId)) { this._loadingService.loadWhile(this._restore(dossierIds)); } @@ -103,8 +103,8 @@ export class TrashScreenComponent extends BaseListingComponent implemen } private _removeFromList(ids: string[]): void { - const entities = this.screenStateService.allEntities.filter(e => !ids.includes(e.dossierId)); - this.screenStateService.setEntities(entities); - this.screenStateService.setSelectedEntities([]); + const entities = this.entitiesService.all.filter(e => !ids.includes(e.dossierId)); + this.entitiesService.setEntities(entities); + this.entitiesService.setSelected([]); } } diff --git a/apps/red-ui/src/app/modules/admin/screens/user-listing/user-listing-screen.component.html b/apps/red-ui/src/app/modules/admin/screens/user-listing/user-listing-screen.component.html index 099755b9c..38cab06b3 100644 --- a/apps/red-ui/src/app/modules/admin/screens/user-listing/user-listing-screen.component.html +++ b/apps/red-ui/src/app/modules/admin/screens/user-listing/user-listing-screen.component.html @@ -36,17 +36,17 @@
- {{ 'user-listing.table-header.title' | translate: { length: (screenStateService.displayedLength$ | async) } }} + {{ 'user-listing.table-header.title' | translate: { length: (entitiesService.displayedLength$ | async) } }} diff --git a/apps/red-ui/src/app/modules/dossier/screens/dossier-listing-screen/dossier-listing-screen.component.ts b/apps/red-ui/src/app/modules/dossier/screens/dossier-listing-screen/dossier-listing-screen.component.ts index 2275fdc47..79dea9cf2 100644 --- a/apps/red-ui/src/app/modules/dossier/screens/dossier-listing-screen/dossier-listing-screen.component.ts +++ b/apps/red-ui/src/app/modules/dossier/screens/dossier-listing-screen/dossier-listing-screen.component.ts @@ -27,6 +27,7 @@ import { dossierStatusChecker, dossierTemplateChecker } from '@shared/components/filters/popup-filter/utils/filter-utils'; +import { PermissionsService } from '@services/permissions.service'; const isLeavingScreen = event => event instanceof NavigationStart && event.url !== '/main/dossiers'; @@ -81,6 +82,7 @@ export class DossierListingScreenComponent protected readonly _injector: Injector, private readonly _userService: UserService, readonly changeDetectorRef: ChangeDetectorRef, + readonly permissionsService: PermissionsService, private readonly _appStateService: AppStateService, private readonly _translateService: TranslateService, private readonly _dialogService: DossiersDialogService, @@ -97,11 +99,11 @@ export class DossierListingScreenComponent } private get _activeDossiersCount(): number { - return this.screenStateService.allEntities.filter(p => p.dossier.status === Dossier.StatusEnum.ACTIVE).length; + return this.entitiesService.all.filter(p => p.dossier.status === Dossier.StatusEnum.ACTIVE).length; } private get _inactiveDossiersCount(): number { - return this.screenStateService.allEntities.length - this._activeDossiersCount; + return this.entitiesService.all.length - this._activeDossiersCount; } ngOnInit(): void { @@ -176,7 +178,7 @@ export class DossierListingScreenComponent } private _loadEntitiesFromState() { - this.screenStateService.setEntities(this._appStateService.allDossiers); + this.entitiesService.setEntities(this._appStateService.allDossiers); } private _computeAllFilters() { @@ -185,7 +187,7 @@ export class DossierListingScreenComponent const allDistinctNeedsWork = new Set(); const allDistinctDossierTemplates = new Set(); - this.screenStateService?.allEntities?.forEach(entry => { + this.entitiesService?.all?.forEach(entry => { // all people entry.dossier.memberIds.forEach(f => allDistinctPeople.add(f)); // Needs work diff --git a/apps/red-ui/src/app/modules/dossier/screens/dossier-overview-screen/dossier-overview-screen.component.html b/apps/red-ui/src/app/modules/dossier/screens/dossier-overview-screen/dossier-overview-screen.component.html index 7d43be517..1dd39f70e 100644 --- a/apps/red-ui/src/app/modules/dossier/screens/dossier-overview-screen/dossier-overview-screen.component.html +++ b/apps/red-ui/src/app/modules/dossier/screens/dossier-overview-screen/dossier-overview-screen.component.html @@ -5,17 +5,17 @@ [showCloseButton]="true" > (); const allDistinctNeedsWork = new Set(); - this.screenStateService.allEntities.forEach(file => { + this.entitiesService.all.forEach(file => { allDistinctPeople.add(file.currentReviewer); allDistinctFileStatusWrapper.add(file.status); allDistinctAddedDates.add(moment(file.added).format('DD/MM/YYYY')); @@ -362,7 +364,7 @@ export class DossierOverviewScreenComponent private _createQuickFilters() { let quickFilters = []; - if (this.screenStateService.allEntities.filter(this.recentlyModifiedChecker).length > 0) { + if (this.entitiesService.all.filter(this.recentlyModifiedChecker).length > 0) { const recentPeriod = this._appConfigService.getConfig(AppConfigKey.RECENT_PERIOD_IN_HOURS); quickFilters = [ { diff --git a/apps/red-ui/src/app/modules/dossier/screens/search-screen/search-screen.component.ts b/apps/red-ui/src/app/modules/dossier/screens/search-screen/search-screen.component.ts index d955f8e40..d539d7ca4 100644 --- a/apps/red-ui/src/app/modules/dossier/screens/search-screen/search-screen.component.ts +++ b/apps/red-ui/src/app/modules/dossier/screens/search-screen/search-screen.component.ts @@ -53,7 +53,7 @@ export class SearchScreenComponent extends BaseListingComponent implem switchMap(query => this._search(query)), map(searchResult => this._toMatchedDocuments(searchResult)), map(docs => this._toListItems(docs)), - tap(result => this.screenStateService.setEntities(result)), + tap(result => this.entitiesService.setEntities(result)), tap(() => this._loadingService.stop()) ); 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 4ace3e486..d2969f353 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 @@ -1,6 +1,7 @@ import { Component, Injector, OnDestroy, ViewChild } from '@angular/core'; import { AutoUnsubscribeComponent, + EntitiesService, FilterService, KeysOf, SearchService, @@ -9,26 +10,23 @@ import { TableColumnConfig } from '@iqser/common-ui'; import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling'; -import { ScreenStateService } from '../services/screen-state.service'; import { combineLatest, Observable } from 'rxjs'; import { distinctUntilChanged, map, switchMap } from 'rxjs/operators'; -import { PermissionsService } from '@services/permissions.service'; -export const DefaultListingServices = [FilterService, SearchService, ScreenStateService, SortingService] as const; +export const DefaultListingServices = [FilterService, SearchService, EntitiesService, SortingService] as const; @Component({ template: '' }) export abstract class BaseListingComponent extends AutoUnsubscribeComponent implements OnDestroy { @ViewChild(CdkVirtualScrollViewport) readonly scrollViewport: CdkVirtualScrollViewport; - readonly permissionsService = this._injector.get(PermissionsService); readonly filterService = this._injector.get(FilterService); - readonly sortingService = this._injector.get>(SortingService); readonly searchService = this._injector.get>(SearchService); - readonly screenStateService = this._injector.get>(ScreenStateService); + readonly sortingService = this._injector.get>(SortingService); + readonly entitiesService = this._injector.get>(EntitiesService); - readonly sortedDisplayedEntities$ = this._sortedDisplayedEntities$; readonly noMatch$ = this._noMatch$; + readonly sortedDisplayedEntities$ = this._sortedDisplayedEntities$; readonly tableColumnConfigs: TableColumnConfig[]; /** @@ -45,17 +43,17 @@ export abstract class BaseListingComponent extends AutoUnsubsc } get allEntities(): T[] { - return this.screenStateService.allEntities; + return this.entitiesService.all; } private get _sortedDisplayedEntities$(): Observable { const sort = entities => this.sortingService.defaultSort(entities); - const sortedEntities = () => this.screenStateService.displayedEntities$.pipe(map(sort)); + const sortedEntities = () => this.entitiesService.displayed$.pipe(map(sort)); return this.sortingService.sortingOption$.pipe(switchMap(sortedEntities)); } private get _noMatch$(): Observable { - return combineLatest([this.screenStateService.allEntitiesLength$, this.screenStateService.displayedLength$]).pipe( + return combineLatest([this.entitiesService.allLength$, this.entitiesService.displayedLength$]).pipe( map(([hasEntities, hasDisplayedEntities]) => hasEntities && !hasDisplayedEntities), distinctUntilChanged() ); @@ -70,23 +68,23 @@ export abstract class BaseListingComponent extends AutoUnsubsc } canBulkDelete$(hasPermission = true): Observable { - return this.screenStateService.areSomeEntitiesSelected$.pipe( + return this.entitiesService.areSomeSelected$.pipe( map(areSomeEntitiesSelected => areSomeEntitiesSelected && hasPermission), distinctUntilChanged() ); } toggleSelectAll() { - return this.screenStateService.selectEntities(); + return this.entitiesService.selectAll(); } toggleEntitySelected(event: MouseEvent, entity: T) { event.stopPropagation(); - return this.screenStateService.selectEntities([entity]); + return this.entitiesService.select(entity); } isSelected(entity: T): boolean { - return this.screenStateService.isSelected(entity); + return this.entitiesService.isSelected(entity); } trackByPrimaryKey(index: number, item: T) { diff --git a/apps/red-ui/src/app/modules/shared/components/table-header/table-header.component.html b/apps/red-ui/src/app/modules/shared/components/table-header/table-header.component.html index a7adb19b3..447aaded7 100644 --- a/apps/red-ui/src/app/modules/shared/components/table-header/table-header.component.html +++ b/apps/red-ui/src/app/modules/shared/components/table-header/table-header.component.html @@ -1,13 +1,13 @@
- {{ tableHeaderLabel | translate: { length: (screenStateService.displayedLength$ | async) } }} + {{ tableHeaderLabel | translate: { length: (entitiesService.displayedLength$ | async) } }} diff --git a/apps/red-ui/src/app/modules/shared/components/table-header/table-header.component.ts b/apps/red-ui/src/app/modules/shared/components/table-header/table-header.component.ts index 06ffcd60b..24bdc72db 100644 --- a/apps/red-ui/src/app/modules/shared/components/table-header/table-header.component.ts +++ b/apps/red-ui/src/app/modules/shared/components/table-header/table-header.component.ts @@ -1,6 +1,5 @@ import { ChangeDetectionStrategy, Component, Input, TemplateRef } from '@angular/core'; -import { ScreenStateService } from '@shared/services/screen-state.service'; -import { TableColumnConfig } from '@iqser/common-ui'; +import { EntitiesService, Required, TableColumnConfig } from '@iqser/common-ui'; @Component({ selector: 'redaction-table-header', @@ -9,11 +8,11 @@ import { TableColumnConfig } from '@iqser/common-ui'; changeDetection: ChangeDetectionStrategy.OnPush }) export class TableHeaderComponent { - @Input() tableHeaderLabel: string; - @Input() tableColumnConfigs: TableColumnConfig[]; + @Input() @Required() tableHeaderLabel: string; + @Input() @Required() tableColumnConfigs: TableColumnConfig[]; @Input() hasEmptyColumn = false; @Input() selectionEnabled = false; @Input() bulkActions: TemplateRef; - constructor(readonly screenStateService: ScreenStateService) {} + constructor(readonly entitiesService: EntitiesService) {} } diff --git a/apps/red-ui/src/app/modules/shared/services/screen-state.service.ts b/apps/red-ui/src/app/modules/shared/services/screen-state.service.ts deleted file mode 100644 index 9a8bf2756..000000000 --- a/apps/red-ui/src/app/modules/shared/services/screen-state.service.ts +++ /dev/null @@ -1,133 +0,0 @@ -import { Injectable } from '@angular/core'; -import { BehaviorSubject, combineLatest, Observable, pipe } from 'rxjs'; -import { distinctUntilChanged, map, tap } from 'rxjs/operators'; -import { FilterService, getFilteredEntities, SearchService } from '@iqser/common-ui'; - -const toLengthValue = (entities: unknown[]) => entities?.length ?? 0; -const getLength = pipe(map(toLengthValue), distinctUntilChanged()); - -@Injectable() -export class ScreenStateService { - private readonly _allEntities$ = new BehaviorSubject([]); - readonly allEntities$ = this._allEntities$.asObservable(); - readonly allEntitiesLength$ = this._allEntities$.pipe(getLength); - - private readonly _displayedEntities$ = new BehaviorSubject([]); - readonly displayedEntities$ = this._getDisplayedEntities$; - readonly displayedLength$ = this._displayedEntities$.pipe(getLength); - - private readonly _selectedEntities$ = new BehaviorSubject([]); - readonly selectedEntities$ = this._selectedEntities$.asObservable(); - readonly selectedLength$ = this._selectedEntities$.pipe(getLength); - - readonly noData$ = this._noData$; - readonly areAllEntitiesSelected$ = this._areAllEntitiesSelected$; - readonly areSomeEntitiesSelected$ = this._areSomeEntitiesSelected$; - readonly notAllEntitiesSelected$ = this._notAllEntitiesSelected$; - - constructor(private readonly _filterService: FilterService, private readonly _searchService: SearchService) { - // setInterval(() => { - // console.log('All entities subs: ', this._allEntities$.observers); - // console.log('Displayed entities subs: ', this._displayedEntities$.observers); - // console.log('Selected entities subs: ', this._selectedEntities$.observers); - // }, 10000); - } - - get allEntities(): T[] { - return Object.values(this._allEntities$.getValue()); - } - - get selectedEntities(): T[] { - return Object.values(this._selectedEntities$.getValue()); - } - - get displayedEntities(): T[] { - return Object.values(this._displayedEntities$.getValue()); - } - - get _getDisplayedEntities$(): Observable { - const filterGroups$ = this._filterService.filterGroups$; - const searchValue$ = this._searchService.valueChanges$; - - return combineLatest([this.allEntities$, filterGroups$, searchValue$]).pipe( - map(([entities, filterGroups]) => getFilteredEntities(entities, filterGroups)), - map(entities => this._searchService.searchIn(entities)), - tap(entities => this._displayedEntities$.next(entities)) - ); - } - - private get _areAllEntitiesSelected$(): Observable { - return combineLatest([this.displayedLength$, this.selectedLength$]).pipe( - map(([displayedLength, selectedLength]) => displayedLength && displayedLength === selectedLength), - distinctUntilChanged() - ); - } - - private get _areSomeEntitiesSelected$(): Observable { - return this.selectedLength$.pipe( - map(value => !!value), - distinctUntilChanged() - ); - } - - private get _notAllEntitiesSelected$(): Observable { - return combineLatest([this.areAllEntitiesSelected$, this.areSomeEntitiesSelected$]).pipe( - map(([allEntitiesAreSelected, someEntitiesAreSelected]) => !allEntitiesAreSelected && someEntitiesAreSelected), - distinctUntilChanged() - ); - } - - private get _noData$(): Observable { - return this.allEntitiesLength$.pipe( - map(length => length === 0), - distinctUntilChanged() - ); - } - - private get _allEntitiesSelected() { - return this.displayedEntities.length !== 0 && this.displayedEntities.length === this.selectedEntities.length; - } - - setEntities(newEntities: T[]): void { - this._allEntities$.next(newEntities); - } - - setSelectedEntities(newEntities: T[]): void { - this._selectedEntities$.next(newEntities); - } - - isSelected(entity: T): boolean { - return this.selectedEntities.indexOf(entity) !== -1; - } - - selectEntities(entities?: T[]): void { - if (entities?.length > 0) { - return entities.forEach(entity => this._selectOne(entity)); - } - return this._selectAll(); - } - - updateSelection(): void { - const items = this.displayedEntities.filter(item => this.selectedEntities.includes(item)); - this.setSelectedEntities(items); - } - - logCurrentState(): void { - console.log('Entities', this.allEntities); - console.log('Displayed', this.displayedEntities); - console.log('Selected', this.selectedEntities); - } - - private _selectOne(entity: T): void { - const currentEntityIdx = this.selectedEntities.indexOf(entity); - if (currentEntityIdx === -1) { - return this.setSelectedEntities([...this.selectedEntities, entity]); - } - this.setSelectedEntities(this.selectedEntities.filter((el, idx) => idx !== currentEntityIdx)); - } - - private _selectAll(): void { - if (this._allEntitiesSelected) return this.setSelectedEntities([]); - this.setSelectedEntities(this.displayedEntities); - } -}