AAE-47527 Populate people and group widgets from process response (#12082)

lib/process-services-cloud/src/lib/form/components/widgets/group/group-cloud.widget.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { Component, DestroyRef, inject, OnInit, ViewEncapsulation } from '@angular/core';
+import { Component, DestroyRef, inject, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
 import { ErrorWidgetComponent, WidgetComponent } from '@alfresco/adf-core';
 import { UntypedFormControl } from '@angular/forms';
 import { filter } from 'rxjs/operators';
@@ -50,6 +50,9 @@ import { GroupCloudComponent } from '../../../../group/components/group-cloud.co
 export class GroupCloudWidgetComponent extends WidgetComponent implements OnInit {
     private readonly reactivePreselection: ReactivePreselectionService<IdentityGroupModel> = inject(ReactivePreselectionService);
 
+    @ViewChild(GroupCloudComponent)
+    private readonly groupCloud: GroupCloudComponent;
+
     typeId = 'GroupCloudWidgetComponent';
     roles: string[];
     mode: ComponentSelectionMode;
@@ -65,7 +68,7 @@ export class GroupCloudWidgetComponent extends WidgetComponent implements OnInit
             getFieldId: () => this.field?.id,
             getFormId: () => this.field?.form?.id,
             getFieldValue: () => this.field?.value,
-            getPreselection: () => this.preSelectGroup,
+            getSelection: () => this.groupCloud?.selectedGroups ?? [],
             setPreselection: (value) => (this.preSelectGroup = value),
             identityOf: (group) => group?.id ?? group?.name
         });

lib/process-services-cloud/src/lib/form/components/widgets/people/people-cloud.widget.spec.ts

@@ -25,7 +25,9 @@ import {
     NoopAuthModule
 } from '@alfresco/adf-core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
 import { PeopleCloudWidgetComponent } from './people-cloud.widget';
+import { PeopleCloudComponent } from '../../../../people/components/people-cloud.component';
 import { IdentityUserService } from '../../../../people/services/identity-user.service';
 import { mockShepherdsPie, mockYorkshirePudding } from '../../../../people/mock/people-cloud.mock';
 import { HarnessLoader } from '@angular/cdk/testing';
@@ -358,5 +360,37 @@ describe('PeopleCloudWidgetComponent', () => {
                 expect(widget.preSelectUsers).toBe(initial);
             });
         });
+
+        describe('single-event population (two-click repro)', () => {
+            let formService: FormService;
+
+            beforeEach(() => {
+                TestBed.resetTestingModule();
+                TestBed.configureTestingModule({
+                    imports: [NoopAuthModule, PeopleCloudWidgetComponent],
+                    providers: [{ provide: ADF_TYPED_VALUE_FORMATTING_ENABLED, useValue: true }]
+                });
+                formService = TestBed.inject(FormService);
+                fixture = TestBed.createComponent(PeopleCloudWidgetComponent);
+                widget = fixture.componentInstance;
+                element = fixture.nativeElement;
+            });
+
+            it('should populate the rendered people component after a SINGLE rule event', async () => {
+                const users = [{ id: 'a', username: 'alpha' }];
+                widget.field = new FormFieldModel(new FormModel(), { id: 'target', type: FormFieldTypes.PEOPLE, value: null });
+                fixture.detectChanges();
+                await fixture.whenStable();
+
+                widget.field.value = users;
+                formService.formRulesEvent.next({ type: 'fieldValueChanged', field: { id: 'target' } } as any);
+
+                fixture.detectChanges();
+                await fixture.whenStable();
+
+                const peopleComponent = fixture.debugElement.query(By.directive(PeopleCloudComponent)).componentInstance as PeopleCloudComponent;
+                expect(peopleComponent.getSelectedUsers()).toEqual(users);
+            });
+        });
     });
 });

lib/process-services-cloud/src/lib/form/components/widgets/people/people-cloud.widget.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { Component, DestroyRef, inject, OnInit, ViewEncapsulation } from '@angular/core';
+import { Component, DestroyRef, inject, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
 import { ErrorWidgetComponent, WidgetComponent } from '@alfresco/adf-core';
 import { UntypedFormControl } from '@angular/forms';
 import { filter } from 'rxjs/operators';
@@ -53,6 +53,9 @@ export class PeopleCloudWidgetComponent extends WidgetComponent implements OnIni
     private readonly identityUserService = inject(IdentityUserService);
     private readonly reactivePreselection: ReactivePreselectionService<IdentityUserModel> = inject(ReactivePreselectionService);
 
+    @ViewChild(PeopleCloudComponent)
+    private readonly peopleCloud: PeopleCloudComponent;
+
     typeId = 'PeopleCloudWidgetComponent';
     appName: string;
     roles: string[];
@@ -70,7 +73,7 @@ export class PeopleCloudWidgetComponent extends WidgetComponent implements OnIni
             getFieldId: () => this.field?.id,
             getFormId: () => this.field?.form?.id,
             getFieldValue: () => this.field?.value,
-            getPreselection: () => this.preSelectUsers,
+            getSelection: () => this.peopleCloud?.getSelectedUsers() ?? [],
             setPreselection: (value) => (this.preSelectUsers = value),
             identityOf: (user) => user?.id ?? user?.username ?? user?.email
         });

lib/process-services-cloud/src/lib/form/components/widgets/reactive-preselection.service.spec.ts

@@ -56,7 +56,7 @@ describe('ReactivePreselectionService', () => {
             getFieldId: () => HOST_FIELD_ID,
             getFormId: () => HOST_FORM_ID,
             getFieldValue: () => fieldValue,
-            getPreselection: () => preselection,
+            getSelection: () => preselection,
             setPreselection: (value) => (preselection = value),
             identityOf: (item) => item?.id ?? item?.name
         };
@@ -111,11 +111,20 @@ describe('ReactivePreselectionService', () => {
             expect(preselection).toBe(initial);
         });
 
-        it('should ignore changes originating from the host field itself', () => {
+        it('should react to changes originating from the host field itself', () => {
+            fieldValue = [{ id: 'a' }];
+
+            formRulesEvent.next({ type: 'fieldValueChanged', field: { id: HOST_FIELD_ID }, form: { id: HOST_FORM_ID } });
+
+            expect(preselection).toEqual([{ id: 'a' }]);
+        });
+
+        it('should not reassign when the value already matches the current selection', () => {
+            preselection = [{ id: 'a' }];
             const initial = preselection;
             fieldValue = [{ id: 'a' }];
 
-            formRulesEvent.next({ type: 'fieldValueChanged', field: { id: HOST_FIELD_ID } });
+            formRulesEvent.next({ type: 'fieldValueChanged', field: { id: HOST_FIELD_ID }, form: { id: HOST_FORM_ID } });
 
             expect(preselection).toBe(initial);
         });

lib/process-services-cloud/src/lib/form/components/widgets/reactive-preselection.service.ts

@@ -25,7 +25,7 @@ export interface ReactivePreselectionHost<T> {
     getFieldId(): string;
     getFormId(): string;
     getFieldValue(): unknown;
-    getPreselection(): T[];
+    getSelection(): T[];
     setPreselection(value: T[]): void;
     identityOf(item: T): string;
 }
@@ -63,17 +63,13 @@ export class ReactivePreselectionService<T = unknown> {
         this.subscribed = true;
         this.formService.formRulesEvent
             .pipe(
-                filter((event) => event?.type === 'fieldValueChanged' && this.isExternalChange(event)),
+                filter((event) => event?.type === 'fieldValueChanged' && this.isSameForm(event)),
                 takeUntilDestroyed(this.destroyRef)
             )
             .subscribe(() => this.sync());
     }
 
-    private isExternalChange(event: FormRulesEvent): boolean {
-        const eventFieldId = event?.field?.id;
-        if (eventFieldId && eventFieldId === this.host.getFieldId()) {
-            return false;
-        }
+    private isSameForm(event: FormRulesEvent): boolean {
         const eventFormId = event?.form?.id;
         return !eventFormId || eventFormId === this.host.getFormId();
     }
@@ -83,7 +79,7 @@ export class ReactivePreselectionService<T = unknown> {
             return;
         }
         const next = this.toPreselection(this.host.getFieldValue());
-        if (this.isSamePreselection(this.host.getPreselection(), next)) {
+        if (this.isSamePreselection(this.host.getSelection(), next)) {
             return;
         }
         this.host.setPreselection(next);