From 8d825b19eb39a8bb77bb092e8f968fc215213058 Mon Sep 17 00:00:00 2001 From: Vito Date: Fri, 2 Mar 2018 13:54:17 +0000 Subject: [PATCH] [ADF-2387] added a stream for pagination size change (#3014) * [ADF-2387] added a stream for pagination size change * [ADF-2387] added test for page size stream * [ADF-2387] start refactoring adding a general stream for user preference attributes * [ADF-2387] added documentation and test for user values stream --- .../process-service.component.ts | 8 +++- docs/user-preferences.service.md | 24 ++++++++++ .../services/user-preferences.service.spec.ts | 26 ++++++++++- lib/core/services/user-preferences.service.ts | 44 ++++++++++++++++--- .../components/task-list.component.ts | 9 +++- 5 files changed, 100 insertions(+), 11 deletions(-) diff --git a/demo-shell/src/app/components/process-service/process-service.component.ts b/demo-shell/src/app/components/process-service/process-service.component.ts index ec954d926d..d7ef59df72 100644 --- a/demo-shell/src/app/components/process-service/process-service.component.ts +++ b/demo-shell/src/app/components/process-service/process-service.component.ts @@ -32,7 +32,7 @@ import { ActivatedRoute, Router } from '@angular/router'; import { ProcessInstanceFilterRepresentation, Pagination } from 'alfresco-js-api'; import { FORM_FIELD_VALIDATORS, FormEvent, FormFieldEvent, FormRenderingService, FormService, - DynamicTableRow, ValidateDynamicTableRowEvent, AppConfigService, PaginationComponent + DynamicTableRow, ValidateDynamicTableRowEvent, AppConfigService, PaginationComponent, UserPreferenceValues } from '@alfresco/adf-core'; import { AnalyticsReportListComponent } from '@alfresco/adf-insights'; @@ -166,7 +166,7 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit private preferenceService: UserPreferencesService) { this.dataTasks = new ObjectDataTableAdapter(); this.dataTasks.setSorting(new DataSorting('created', 'desc')); - this.paginationPageSize = this.preferenceService.paginationSize; + this.defaultProcessName = this.appConfig.get('adf-start-process.name'); this.defaultProcessDefinitionName = this.appConfig.get('adf-start-process.processDefinitionName'); @@ -185,6 +185,10 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit this.logService.log(`Field value changed. Form: ${e.form.id}, Field: ${e.field.id}, Value: ${e.field.value}`); }); + this.preferenceService.select(UserPreferenceValues.PaginationSize).subscribe((pageSize) => { + this.paginationPageSize = pageSize; + }); + formService.validateDynamicTableRow.subscribe( (validateDynamicTableRowEvent: ValidateDynamicTableRowEvent) => { const row: DynamicTableRow = validateDynamicTableRowEvent.row; diff --git a/docs/user-preferences.service.md b/docs/user-preferences.service.md index 0f314ff52c..747798090b 100644 --- a/docs/user-preferences.service.md +++ b/docs/user-preferences.service.md @@ -31,6 +31,9 @@ Stores preferences for components. - `getDefaultLocale(): string` Gets the default locale. +- `select : Observable` + Return the value for the user status property changed + ## Details @@ -82,3 +85,24 @@ The service also provides quick access to a set of the "known" properties used a | disableCSRF | `boolean` | Prevents the CSRF Token from being submitted if true. Only valid for Process Services. | | paginationSize | `number` | Pagination size. | | locale | `string` | Current locale setting. | + +## User Preference onChange Stream +Whenever a property is set to the user preference service an onChange event is sent with the whole set of user properties. This comes in handy when a component wants to react to some property change. + +```ts + userPreferences.paginationSize = 10; + userPreferences.onChange().subscribe((userStatusValues) => { + console.log(userStatusValues.PAGINATION_SIZE); //this will be 10 + }); +``` + +We have added also the `select` method where the user can give the property name which wants to be notified the changes and get the updated value. +A set of basic properties is added into the enumeration `UserPreferenceValues` which gives you the key value to access the standard user preference service properties : **PaginationSize**, **DisableCSRF**, **Locale** and **SupportedPageSizes**. + +```ts + userPreferences.disableCSRF = true; + userPreferences.select(UserPreferenceValues.DisableCSRF).subscribe((CSRFflag) => { + console.log(CSRFflag); //this will be true; + }); +``` + diff --git a/lib/core/services/user-preferences.service.spec.ts b/lib/core/services/user-preferences.service.spec.ts index 37ae41949b..b39594abf9 100644 --- a/lib/core/services/user-preferences.service.spec.ts +++ b/lib/core/services/user-preferences.service.spec.ts @@ -24,10 +24,11 @@ import { AppConfigModule } from '../app-config/app-config.module'; import { StorageService } from './storage.service'; import { TranslateLoaderService } from './translate-loader.service'; import { UserPreferencesService } from './user-preferences.service'; +import { UserPreferenceValues } from './user-preferences.service'; describe('UserPreferencesService', () => { - const defaultPaginationSize: number = 10; + const defaultPaginationSize: number = 25; const supportedPaginationSize = [5, 10, 15, 20]; let preferences: UserPreferencesService; let storage: StorageService; @@ -66,6 +67,7 @@ describe('UserPreferencesService', () => { }); it('should get default pagination from app config', () => { + appConfig.config.pagination.size = 0; expect(preferences.defaults.paginationSize).toBe(defaultPaginationSize); }); @@ -75,6 +77,7 @@ describe('UserPreferencesService', () => { }); it('should use [GUEST] as default storage prefix', () => { + preferences.setStoragePrefix(null); expect(preferences.getStoragePrefix()).toBe('GUEST'); }); @@ -145,4 +148,25 @@ describe('UserPreferencesService', () => { expect(preferences.locale).toBe('fake-store-locate'); }); + it('should stream the page size value when is set', async(() => { + preferences.paginationSize = 5; + preferences.onChange.subscribe((userPreferenceStatus) => { + expect(userPreferenceStatus.PAGINATION_SIZE).toBe(5); + }); + })); + + it('should stream the user preference status when changed', async(() => { + preferences.set('propertyA', 'valueA'); + preferences.onChange.subscribe((userPreferenceStatus) => { + expect(userPreferenceStatus.propertyA).toBe('valueA'); + }); + })); + + it('should stream only the selected attribute changes when using select', async(() => { + preferences.disableCSRF = true; + preferences.select(UserPreferenceValues.DisableCSRF).subscribe((disableCSRFFlag) => { + expect(disableCSRFFlag).toBeTruthy(); + }); + })); + }); diff --git a/lib/core/services/user-preferences.service.ts b/lib/core/services/user-preferences.service.ts index d63c62560c..d9f1452db1 100644 --- a/lib/core/services/user-preferences.service.ts +++ b/lib/core/services/user-preferences.service.ts @@ -22,6 +22,14 @@ import { Observable } from 'rxjs/Observable'; import { AppConfigService } from '../app-config/app-config.service'; import { AlfrescoApiService } from './alfresco-api.service'; import { StorageService } from './storage.service'; +import 'rxjs/add/operator/distinctUntilChanged'; + +export enum UserPreferenceValues { + PaginationSize = 'PAGINATION_SIZE', + DisableCSRF = 'DISABLE_CSRF', + Locale = 'LOCALE', + SupportedPageSizes = 'supportedPageSizes' +} @Injectable() export class UserPreferencesService { @@ -32,8 +40,20 @@ export class UserPreferencesService { locale: 'en' }; - private localeSubject: BehaviorSubject ; + private userPreferenceStatus: any = { + paginationSize: 25, + supportedPageSizes: [5, 10, 15, 20], + LOCALE: 'en' + }; + + /** + * @deprecated we are grouping every value changed on the user preference in a single stream : userPreferenceValue$ + */ locale$: Observable; + private localeSubject: BehaviorSubject ; + + private onChangeSubject: BehaviorSubject; + onChange: Observable; constructor( public translate: TranslateService, @@ -41,11 +61,22 @@ export class UserPreferencesService { private storage: StorageService, private apiService: AlfrescoApiService ) { - const currentLocale = this.locale || this.getDefaultLocale(); - this.localeSubject = new BehaviorSubject(currentLocale); + this.initUserPreferenceStatus(); + this.localeSubject = new BehaviorSubject(this.defaults.locale); this.locale$ = this.localeSubject.asObservable(); - this.defaults.paginationSize = this.appConfig.get('pagination.size', this.defaults.paginationSize); - this.defaults.supportedPageSizes = this.appConfig.get('pagination.supportedPageSizes', this.defaults.supportedPageSizes); + this.onChangeSubject = new BehaviorSubject(this.userPreferenceStatus); + this.onChange = this.onChangeSubject.asObservable(); + } + + private initUserPreferenceStatus() { + this.userPreferenceStatus[UserPreferenceValues.Locale] = this.locale || this.getDefaultLocale(); + this.userPreferenceStatus[UserPreferenceValues.PaginationSize] = this.appConfig.get('pagination.size', this.defaults.paginationSize); + this.userPreferenceStatus[UserPreferenceValues.SupportedPageSizes] = this.appConfig.get('pagination.supportedPageSizes', this.defaults.supportedPageSizes); + this.userPreferenceStatus[UserPreferenceValues.DisableCSRF] = this.disableCSRF; + } + + select(property: string): Observable { + return this.onChange.map((userPreferenceStatus) => userPreferenceStatus[property]).distinctUntilChanged(); } /** @@ -69,11 +100,12 @@ export class UserPreferencesService { */ set(property: string, value: any) { if (!property) { return; } - this.storage.setItem( this.getPropertyKey(property), value ); + this.userPreferenceStatus[property] = value; + this.onChangeSubject.next(this.userPreferenceStatus); } /** Gets the active storage prefix for preferences. */ diff --git a/lib/process-services/task-list/components/task-list.component.ts b/lib/process-services/task-list/components/task-list.component.ts index 653707ff90..808dac9255 100644 --- a/lib/process-services/task-list/components/task-list.component.ts +++ b/lib/process-services/task-list/components/task-list.component.ts @@ -29,7 +29,8 @@ import { PaginationComponent, PaginatedComponent, PaginationQueryParams, - UserPreferencesService + UserPreferencesService, + UserPreferenceValues } from '@alfresco/adf-core'; import { AfterContentInit, @@ -163,7 +164,11 @@ export class TaskListComponent implements OnChanges, OnInit, AfterContentInit, P constructor(private taskListService: TaskListService, private appConfig: AppConfigService, private userPreferences: UserPreferencesService) { - this.size = this.userPreferences.paginationSize; + + this.userPreferences.select(UserPreferenceValues.PaginationSize).subscribe((pageSize) => { + this.size = pageSize; + }); + this.pagination = new BehaviorSubject( { maxItems: this.size, skipCount: 0,