diff --git a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.html b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.html index 94f8ea35f1..acd222e7a9 100644 --- a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.html +++ b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.html @@ -1 +1,8 @@ -<div #container></div> +<mat-card> + <mat-card-content> + <div #container></div> + </mat-card-content> + <mat-card-actions align="end"> + <ng-content select="[buttons]"></ng-content> + </mat-card-actions> +</mat-card> diff --git a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.spec.ts index 43fc628f48..214e5e57c8 100644 --- a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.spec.ts +++ b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.spec.ts @@ -16,12 +16,11 @@ */ import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { TaskScreenCloudComponent } from './screen-cloud.component'; -import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; -import { ScreenRenderingService } from '../../../services/public-api'; +import { Component } from '@angular/core'; import { By } from '@angular/platform-browser'; +import { ScreenRenderingService } from '../../../services/public-api'; +import { TaskScreenCloudComponent } from './screen-cloud.component'; @Component({ selector: 'adf-cloud-test-component', @@ -31,15 +30,27 @@ import { By } from '@angular/platform-browser'; }) class TestComponent {} +@Component({ + selector: 'adf-cloud-test-actions-component', + template: `<adf-cloud-task-screen [taskId]="'1'" [appName]="'app-name-test'" [screenId]="'test'"> + <div buttons class="adf-cloud-test-buttons"> + <button>Test</button> + </div> + </adf-cloud-task-screen> `, + imports: [CommonModule, TaskScreenCloudComponent], + standalone: true +}) +class TestWrapperComponent {} + describe('TaskScreenCloudComponent', () => { - let fixture: ComponentFixture<TaskScreenCloudComponent>; + let fixture: ComponentFixture<TestWrapperComponent>; let screenRenderingService: ScreenRenderingService; beforeEach(() => { TestBed.configureTestingModule({ - imports: [TaskScreenCloudComponent, TestComponent] + imports: [TaskScreenCloudComponent, TestComponent, TestWrapperComponent] }); - fixture = TestBed.createComponent(TaskScreenCloudComponent); + fixture = TestBed.createComponent(TestWrapperComponent); screenRenderingService = TestBed.inject(ScreenRenderingService); screenRenderingService.register({ ['test']: () => TestComponent }); fixture.componentRef.setInput('screenId', 'test'); @@ -50,4 +61,9 @@ describe('TaskScreenCloudComponent', () => { const dynamicComponent = fixture.debugElement.query(By.css('.adf-cloud-test-container')); expect(dynamicComponent).toBeTruthy(); }); + + it('should project content into component', async () => { + const projectedContent = fixture.debugElement.query(By.css('.adf-cloud-test-buttons')); + expect(projectedContent).toBeTruthy(); + }); }); diff --git a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.ts b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.ts index 3ea9c1a4bb..9868e53013 100644 --- a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.ts +++ b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.ts @@ -18,12 +18,13 @@ import { CommonModule } from '@angular/common'; import { Component, ComponentRef, inject, Input, OnInit, ViewChild, ViewContainerRef } from '@angular/core'; import { ScreenRenderingService } from '../../../services/public-api'; +import { MatCardModule } from '@angular/material/card'; @Component({ selector: 'adf-cloud-task-screen', standalone: true, - imports: [CommonModule], - template: '<div #container></div>' + imports: [CommonModule, MatCardModule], + templateUrl: './screen-cloud.component.html' }) export class TaskScreenCloudComponent implements OnInit { /** Task id to fetch corresponding form and values. */ diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud/user-task-cloud.component.html b/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud/user-task-cloud.component.html index 536db5439e..94b4d1e4ff 100644 --- a/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud/user-task-cloud.component.html +++ b/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud/user-task-cloud.component.html @@ -26,10 +26,13 @@ <ng-container *ngSwitchCase="taskTypeEnum.Screen"> <adf-cloud-task-screen - [taskId]="taskId" [appName]="appName" [screenId]="screenId" - /> + [taskId]="taskId" + > + <ng-template [ngTemplateOutlet]="taskFormCloudButtons" buttons> + </ng-template> + </adf-cloud-task-screen> </ng-container> <ng-container *ngSwitchCase="taskTypeEnum.None">