From 898d62477e8243e0b08f2577b41f65b9e575a18e Mon Sep 17 00:00:00 2001 From: Silviu Popa Date: Tue, 26 Feb 2019 11:41:42 +0200 Subject: [PATCH] [ADF-4038] People/GroupCloudDemo - add appName filter (#4283) * [ADF-4038] - People/Group Cloud Component add app name filter * [ADF-4038] add unit test, modify ngOnChange appName condition * [ADF-4038] People/GroupCloudDemo - add radio button to filter application name or roles --- demo-shell/resources/i18n/en.json | 5 +- .../people-groups-cloud-demo.component.html | 34 +++++++++++--- .../people-groups-cloud-demo.component.scss | 6 ++- .../people-groups-cloud-demo.component.ts | 47 +++++++++++++++++++ .../components/group-cloud.component.spec.ts | 22 +++++++++ .../group/components/group-cloud.component.ts | 17 ++++--- .../people-cloud.component.spec.ts | 23 ++++++++- .../people-cloud/people-cloud.component.ts | 17 +++++-- 8 files changed, 150 insertions(+), 21 deletions(-) diff --git a/demo-shell/resources/i18n/en.json b/demo-shell/resources/i18n/en.json index 2148b7f76c..f6aa850fcd 100644 --- a/demo-shell/resources/i18n/en.json +++ b/demo-shell/resources/i18n/en.json @@ -293,7 +293,10 @@ "SINGLE": "Single Selection", "MULTI": "Multiple Selection", "PRESELECTED_VALUE": "Preselect: ", - "ROLE": "Roles: " + "ROLE": "Roles: ", + "APP_NAME": "Aplication Name", + "APP_FILTER_MODE": "Filter by application name", + "ROLE_FILTER_MODE": "Filter by role" }, "ABOUT": { "TITLE": "Plugins", diff --git a/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.html b/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.html index c7bcf39771..d7344500b0 100644 --- a/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.html +++ b/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.html @@ -12,17 +12,27 @@ 'PEOPLE_GROUPS_CLOUD.MULTI' | translate }}
- + + {{ + 'PEOPLE_GROUPS_CLOUD.APP_FILTER_MODE' | translate }} + {{ + 'PEOPLE_GROUPS_CLOUD.ROLE_FILTER_MODE' | translate }} + + {{ 'PEOPLE_GROUPS_CLOUD.ROLE' | translate }} ['ACTIVITI_ADMIN', "ACTIVITI_USER"] - + + {{ 'PEOPLE_GROUPS_CLOUD.APP_NAME' | translate }} + + + {{ 'PEOPLE_GROUPS_CLOUD.PRESELECTED_VALUE' | translate }}: {{ DEFAULT_PEOPLE_PLACEHOLDER }}
- +
@@ -50,18 +60,28 @@ 'PEOPLE_GROUPS_CLOUD.MULTI' | translate }}
- + + {{ + 'PEOPLE_GROUPS_CLOUD.APP_FILTER_MODE' | translate }} + {{ + 'PEOPLE_GROUPS_CLOUD.ROLE_FILTER_MODE' | translate }} + + {{ 'PEOPLE_GROUPS_CLOUD.ROLE' | translate }} ['ACTIVITI_ADMIN', "ACTIVITI_USER"] - + + {{ 'PEOPLE_GROUPS_CLOUD.APP_NAME' | translate }} + + + Preselect: {{ DEFAULT_GROUP_PLACEHOLDER }}
- +
diff --git a/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.scss b/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.scss index 539d1c9b00..3603ae7b91 100644 --- a/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.scss +++ b/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.scss @@ -18,9 +18,13 @@ margin-right: 15px; min-width: 330px; - &-full { + &-big { width:60%; } + + &-full { + width:100%; + } } } } diff --git a/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.ts b/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.ts index 5de5f57564..be5e208751 100644 --- a/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.ts +++ b/demo-shell/src/app/components/app-layout/cloud/people-groups-cloud-demo.component.ts @@ -27,17 +27,22 @@ import { MatRadioChange } from '@angular/material'; }) export class PeopleGroupCloudDemoComponent { + DEFAULT_FILTER_MODE: string = 'appName'; DEFAULT_GROUP_PLACEHOLDER: string = `[{"id": "1", "name":"activitiUserGroup"}]`; DEFAULT_PEOPLE_PLACEHOLDER: string = `[{"email": "example@alfresco.com", "firstName":"Administrator", "lastName": "ADF"}]`; peopleMode: string = PeopleCloudComponent.MODE_SINGLE; preSelectUsers: string[] = []; peopleRoles: string[] = []; + peopleAppName: string; + peopleFilterMode: string = this.DEFAULT_FILTER_MODE; groupMode: string = GroupCloudComponent.MODE_SINGLE; preSelectGroup: GroupModel[] = []; selectedGroupList: GroupModel[] = []; groupRoles: string[]; + groupAppName: string; + groupFilterMode: string = this.DEFAULT_FILTER_MODE; setPeoplePreselectValue(event: any) { this.preSelectUsers = this.getArrayFromString(event.target.value); @@ -55,6 +60,14 @@ export class PeopleGroupCloudDemoComponent { this.groupRoles = this.getArrayFromString(event.target.value); } + setPeopleAppName(event: any) { + this.peopleAppName = event.target.value; + } + + setGroupAppName(event: any) { + this.groupAppName = event.target.value; + } + onChangePeopleMode(event: MatRadioChange) { this.peopleMode = event.value; this.preSelectUsers = [...this.preSelectUsers]; @@ -65,6 +78,40 @@ export class PeopleGroupCloudDemoComponent { this.preSelectGroup = [...this.preSelectGroup]; } + onChangePeopleFilterMode(event: MatRadioChange) { + this.peopleFilterMode = event.value; + this.resetPeopleFilter(); + } + + onChangeGroupsFilterMode(event: MatRadioChange) { + this.groupFilterMode = event.value; + this.restGroupFilter(); + } + + isPeopleAppNameSelected() { + return this.peopleFilterMode === 'appName'; + } + + isGroupAppNameSelected() { + return this.groupFilterMode === 'appName'; + } + + resetPeopleFilter() { + if (this.isPeopleAppNameSelected()) { + this.peopleRoles = []; + } else { + this.peopleAppName = ''; + } + } + + restGroupFilter() { + if (this.isGroupAppNameSelected()) { + this.groupRoles = []; + } else { + this.groupAppName = ''; + } + } + isStringArray(str: string) { try { const result = JSON.parse(str); diff --git a/lib/process-services-cloud/src/lib/group/components/group-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/group/components/group-cloud.component.spec.ts index 338a0f8f13..d6a2cf18a0 100644 --- a/lib/process-services-cloud/src/lib/group/components/group-cloud.component.spec.ts +++ b/lib/process-services-cloud/src/lib/group/components/group-cloud.component.spec.ts @@ -26,6 +26,7 @@ import { GroupCloudService } from '../services/group-cloud.service'; import { setupTestBed, AlfrescoApiServiceMock } from '@alfresco/adf-core'; import { mockGroups } from '../mock/group-cloud.mock'; import { GroupModel } from '../models/group.model'; +import { SimpleChange } from '@angular/core'; describe('GroupCloudComponent', () => { let component: GroupCloudComponent; @@ -59,6 +60,9 @@ describe('GroupCloudComponent', () => { }); it('should be able to fetch client id', async(() => { + component.ngOnChanges( { + appName: new SimpleChange(null, component.appName, true) + }); fixture.detectChanges(); fixture.whenStable().then(() => { expect(getClientIdByApplicationNameSpy).toHaveBeenCalled(); @@ -291,4 +295,22 @@ describe('GroupCloudComponent', () => { expect(checkGroupHasAccessSpy).not.toHaveBeenCalled(); }); })); + + it('should load the clients if appName change', async( () => { + component.appName = 'ADF'; + fixture.detectChanges(); + fixture.whenStable().then( () => { + fixture.detectChanges(); + expect(getClientIdByApplicationNameSpy).toHaveBeenCalled(); + }); + })); + + it('should filter users if appName change', async(() => { + component.appName = 'ADF'; + fixture.detectChanges(); + fixture.whenStable().then( () => { + fixture.detectChanges(); + expect(checkGroupHasAccessSpy).toHaveBeenCalled(); + }); + })); }); diff --git a/lib/process-services-cloud/src/lib/group/components/group-cloud.component.ts b/lib/process-services-cloud/src/lib/group/components/group-cloud.component.ts index 7f1d804ea8..4866eae98e 100644 --- a/lib/process-services-cloud/src/lib/group/components/group-cloud.component.ts +++ b/lib/process-services-cloud/src/lib/group/components/group-cloud.component.ts @@ -107,19 +107,24 @@ export class GroupCloudComponent implements OnInit, OnChanges { } ngOnInit() { - this.initSearch(); - - if (this.appName) { - this.disableSearch(); - this.loadClientId(); - } } ngOnChanges(changes: SimpleChanges) { if (changes.preSelectGroups && this.hasPreSelectGroups()) { this.loadPreSelectGroups(); } + + if (changes.appName && this.isAppNameChanged(changes.appName)) { + this.disableSearch(); + this.loadClientId(); + } else { + this.enableSearch(); + } + } + + private isAppNameChanged(change) { + return change.previousValue !== change.currentValue && this.appName && this.appName.length > 0; } private async loadClientId() { diff --git a/lib/process-services-cloud/src/lib/task/start-task/components/people-cloud/people-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/task/start-task/components/people-cloud/people-cloud.component.spec.ts index 1e10a34e1c..0487ffbb35 100644 --- a/lib/process-services-cloud/src/lib/task/start-task/components/people-cloud/people-cloud.component.spec.ts +++ b/lib/process-services-cloud/src/lib/task/start-task/components/people-cloud/people-cloud.component.spec.ts @@ -31,6 +31,7 @@ describe('PeopleCloudComponent', () => { let identityService: IdentityUserService; let findUsersSpy: jasmine.Spy; let checkUserHasAccessSpy: jasmine.Spy; + let loadClientsByApplicationNameSpy: jasmine.Spy; setupTestBed({ imports: [ProcessServiceCloudTestingModule, StartTaskCloudTestingModule], @@ -44,7 +45,7 @@ describe('PeopleCloudComponent', () => { identityService = TestBed.get(IdentityUserService); findUsersSpy = spyOn(identityService, 'findUsersByName').and.returnValue(of(mockUsers)); checkUserHasAccessSpy = spyOn(identityService, 'checkUserHasClientApp').and.returnValue(of(true)); - spyOn(identityService, 'getClientIdByApplicationName').and.returnValue(of('mock-client-id')); + loadClientsByApplicationNameSpy = spyOn(identityService, 'getClientIdByApplicationName').and.returnValue(of('mock-client-id')); }); it('should create PeopleCloudComponent', () => { @@ -294,4 +295,24 @@ describe('PeopleCloudComponent', () => { expect(checkUserHasRoleSpy).not.toHaveBeenCalled(); }); })); + + it('should load the clients if appName change', async( () => { + component.appName = 'ADF'; + fixture.detectChanges(); + fixture.whenStable().then( () => { + fixture.detectChanges(); + expect(loadClientsByApplicationNameSpy).toHaveBeenCalled(); + }); + })); + + it('should filter users if appName change', async(() => { + component.appName = ''; + fixture.detectChanges(); + component.appName = 'ADF'; + fixture.detectChanges(); + fixture.whenStable().then( () => { + fixture.detectChanges(); + expect(checkUserHasAccessSpy).toHaveBeenCalled(); + }); + })); }); diff --git a/lib/process-services-cloud/src/lib/task/start-task/components/people-cloud/people-cloud.component.ts b/lib/process-services-cloud/src/lib/task/start-task/components/people-cloud/people-cloud.component.ts index 3ba152a1f9..4fef317370 100644 --- a/lib/process-services-cloud/src/lib/task/start-task/components/people-cloud/people-cloud.component.ts +++ b/lib/process-services-cloud/src/lib/task/start-task/components/people-cloud/people-cloud.component.ts @@ -102,17 +102,23 @@ export class PeopleCloudComponent implements OnInit, OnChanges { this.selectedUsersSubject = new BehaviorSubject(this.preSelectUsers); this.selectedUsers$ = this.selectedUsersSubject.asObservable(); this.initSearch(); - - if (this.appName) { - this.disableSearch(); - this.loadClientId(); - } } ngOnChanges(changes: SimpleChanges) { if (changes.preSelectUsers && this.hasPreSelectUsers()) { this.loadPreSelectUsers(); } + + if (changes.appName && this.isAppNameChanged(changes.appName)) { + this.disableSearch(); + this.loadClientId(); + } else { + this.enableSearch(); + } + } + + private isAppNameChanged(change) { + return change.previousValue !== change.currentValue && this.appName && this.appName.length > 0; } private initSearch() { @@ -202,6 +208,7 @@ export class PeopleCloudComponent implements OnInit, OnChanges { } private async loadClientId() { + this.clientId = await this.identityUserService.getClientIdByApplicationName(this.appName).toPromise(); if (this.clientId) {