HXIDP-6471 Provide start process variables to custom screen (#11712)

* HXIDP-6471 Provide start process variables to custom screen

* Apply recommendations

* Apply more recommendations

* Add appName property

* Fix input types and defaults

lib/process-services-cloud/src/lib/process/start-process/components/start-process-cloud.component.html

@@ -113,6 +113,9 @@
                     } @else if (hasScreen) {
                         <adf-cloud-start-process-screen-cloud
                             [screenId]="processDefinitionCurrent.formKey"
+                            [appName]="appName"
+                            [processDefinitionId]="processDefinitionCurrent?.id ?? ''"
+                            [resolvedValues]="resolvedValues"
                             (screenStartProcessPayloadChange)="onScreenStartProcessPayloadChange($event)"
                             (disableStartProcessButton)="onDisableStartProcessButtonForScreen($event)"
                         >

lib/process-services-cloud/src/lib/process/start-process/components/start-process-cloud.component.spec.ts

@@ -310,6 +310,14 @@ describe('StartProcessCloudComponent', () => {
             expect(contentElement.textContent).toBe('Mock Screen Component');
         });
 
+        it('should inject screen input', () => {
+            formDefinitionSpy.and.returnValue(of(fakeStartForm));
+            const processDefinition = fakeProcessDefinitions[2];
+            component.processDefinitionCurrent = processDefinition;
+            fixture.detectChanges();
+            expect(screenComponent.processDefinitionId()).toEqual(processDefinition.id);
+        });
+
         it('should toggle default process buttons', () => {
             screenComponent.defaultStartProcessButtonsConfigurationChange.emit({ show: false, disable: false });
             fixture.detectChanges();

lib/process-services-cloud/src/lib/screen/components/screen-cloud/base-screen/base-screen-cloud.component.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { Component, ComponentRef, inject, Input, OnInit, ViewChild, ViewContainerRef } from '@angular/core';
+import { Component, ComponentRef, inject, Input, OnInit, signal, ViewChild, ViewContainerRef } from '@angular/core';
 import { ScreenRenderingService } from '../../../services/screen-rendering.service';
 
 @Component({
@@ -29,6 +29,8 @@ export abstract class BaseScreenCloudComponent<TScreenComponent = unknown> imple
     container: ViewContainerRef;
 
     protected componentRef: ComponentRef<TScreenComponent>;
+    private readonly _componentRefChanged = signal<ComponentRef<TScreenComponent> | undefined>(undefined);
+    protected readonly componentRefChanged = this._componentRefChanged.asReadonly();
     protected readonly screenRenderingService = inject(ScreenRenderingService);
 
     ngOnInit() {
@@ -39,12 +41,13 @@ export abstract class BaseScreenCloudComponent<TScreenComponent = unknown> imple
         if (this.screenId) {
             const componentType = this.screenRenderingService.resolveComponentType({ type: this.screenId });
             this.componentRef = this.container.createComponent(componentType);
+            this._componentRefChanged.set(this.componentRef);
             this.setInputsForDynamicComponent();
             this.subscribeToOutputs();
         }
     }
 
-    protected abstract setInputsForDynamicComponent(): void;
+    protected setInputsForDynamicComponent(): void {}
 
     protected abstract subscribeToOutputs(): void;
 }

lib/process-services-cloud/src/lib/screen/components/screen-cloud/start-process-event-screen/start-process-screen-cloud.component.spec.ts

@@ -21,6 +21,7 @@ import { MockedTaskScreenCloudComponent } from '../../../../testing/start-proces
 import { provideScreen } from '../../../services/provide-screen';
 import { By } from '@angular/platform-browser';
 import { StartProcessScreenCloud, StartProcessScreenDefaultButtons } from './start-process-screen.model';
+import { TaskVariableCloud } from '../../../../form/models/task-variable-cloud.model';
 
 describe('StartProcessScreenCloudComponent', () => {
     let component: StartProcessScreenCloudComponent;
@@ -63,8 +64,30 @@ describe('StartProcessScreenCloudComponent', () => {
         expect(component.showStartProcessButtons()).toBe(startProcessScreenDefaultButtons.show);
     });
 
+    it('should set appName', () => {
+        const screenInstance: StartProcessScreenCloud = fixture.debugElement.query(By.directive(MockedTaskScreenCloudComponent)).componentInstance;
+        expect(screenInstance.appName()).toEqual('');
+        const newValue = 'new-app-name';
+        fixture.componentRef.setInput('appName', newValue);
+        fixture.detectChanges();
+        expect(screenInstance.appName()).toEqual(newValue);
+    });
+
     it('should set process definition id', () => {
         const screenInstance: StartProcessScreenCloud = fixture.debugElement.query(By.directive(MockedTaskScreenCloudComponent)).componentInstance;
         expect(screenInstance.processDefinitionId()).toBe(processDefinitionId);
+        const newId = 'new-id';
+        fixture.componentRef.setInput('processDefinitionId', newId);
+        fixture.detectChanges();
+        expect(screenInstance.processDefinitionId()).toEqual(newId);
+    });
+
+    it('should set resolvedValues', () => {
+        const screenInstance: StartProcessScreenCloud = fixture.debugElement.query(By.directive(MockedTaskScreenCloudComponent)).componentInstance;
+        expect(screenInstance.resolvedValues()).toBeUndefined();
+        const newValues = [new TaskVariableCloud({ id: 'new-id', name: 'new-name' })];
+        fixture.componentRef.setInput('resolvedValues', newValues);
+        fixture.detectChanges();
+        expect(screenInstance.resolvedValues()).toEqual(newValues);
     });
 });

lib/process-services-cloud/src/lib/screen/components/screen-cloud/start-process-event-screen/start-process-screen-cloud.component.ts

@@ -15,11 +15,12 @@
  * limitations under the License.
  */
 
-import { ChangeDetectionStrategy, Component, input, output, signal } from '@angular/core';
+import { ChangeDetectionStrategy, Component, effect, input, output, signal } from '@angular/core';
 import { BaseScreenCloudComponent } from '../base-screen/base-screen-cloud.component';
 import { MatCardModule } from '@angular/material/card';
 import { CommonModule } from '@angular/common';
 import { StartProcessScreenCloud } from './start-process-screen.model';
+import { TaskVariableCloud } from '../../../../form/models/task-variable-cloud.model';
 
 @Component({
     selector: 'adf-cloud-start-process-screen-cloud',
@@ -30,16 +31,29 @@ import { StartProcessScreenCloud } from './start-process-screen.model';
     changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class StartProcessScreenCloudComponent extends BaseScreenCloudComponent<StartProcessScreenCloud> {
+    readonly appName = input('');
     processDefinitionId = input('');
+    readonly resolvedValues = input<TaskVariableCloud[]>();
     screenStartProcessPayloadChange = output<unknown>();
     disableStartProcessButton = output<boolean>();
 
     showStartProcessButtons = signal(false);
 
-    protected setInputsForDynamicComponent(): void {
-        if (this.processDefinitionId()) {
-            this.componentRef.setInput('processDefinitionId', this.processDefinitionId());
-        }
+    constructor() {
+        super();
+        effect(() => {
+            const componentRef = this.componentRefChanged();
+            if (componentRef.instance && 'appName' in componentRef.instance) {
+                componentRef.setInput('appName', this.appName());
+            }
+        });
+        effect(() => this.componentRefChanged()?.setInput('processDefinitionId', this.processDefinitionId()));
+        effect(() => {
+            const componentRef = this.componentRefChanged();
+            if (componentRef?.instance && 'resolvedValues' in componentRef.instance) {
+                componentRef.setInput('resolvedValues', this.resolvedValues());
+            }
+        });
     }
 
     protected subscribeToOutputs(): void {

lib/process-services-cloud/src/lib/screen/components/screen-cloud/start-process-event-screen/start-process-screen.model.ts

@@ -16,13 +16,16 @@
  */
 
 import { InputSignal, OutputEmitterRef } from '@angular/core';
+import { TaskVariableCloud } from '../../../../form/models/task-variable-cloud.model';
 
 export interface StartProcessScreenDefaultButtons {
     show: boolean;
     disable: boolean;
 }
 export interface StartProcessScreenCloud {
+    readonly appName?: InputSignal<string>;
     processDefinitionId: InputSignal<string>;
+    readonly resolvedValues?: InputSignal<TaskVariableCloud[] | undefined>;
     defaultStartProcessButtonsConfigurationChange: OutputEmitterRef<StartProcessScreenDefaultButtons>;
     startProcessPayloadChanged: OutputEmitterRef<unknown>;
 }

lib/process-services-cloud/src/lib/testing/start-process-screen-mock.component.ts

@@ -20,13 +20,16 @@ import {
     StartProcessScreenCloud,
     StartProcessScreenDefaultButtons
 } from '../screen/components/screen-cloud/start-process-event-screen/start-process-screen.model';
+import { TaskVariableCloud } from '../form/models/task-variable-cloud.model';
 
 @Component({
     selector: 'adf-cloud-mock-screen-component',
     template: `<div>Mock Screen Component</div>`
 })
 export class MockedTaskScreenCloudComponent implements StartProcessScreenCloud {
+    readonly appName = input('');
     processDefinitionId = input('');
+    readonly resolvedValues = input<TaskVariableCloud[] | undefined>();
     defaultStartProcessButtonsConfigurationChange = output<StartProcessScreenDefaultButtons>();
     startProcessPayloadChanged = output<unknown>();
 }