From 21a75abfc65dc5af911ef757b62991e28ee99f5c Mon Sep 17 00:00:00 2001
From: Diogo Bastos <50139916+DiogoABastos@users.noreply.github.com>
Date: Wed, 24 Apr 2024 16:37:10 +0100
Subject: [PATCH] AAE-21392 Fix dropdown form widget style (#9605)

---
 .../widgets/dropdown/dropdown-cloud.widget.html      | 12 ++++--------
 .../widgets/dropdown/dropdown-cloud.widget.spec.ts   |  7 +------
 2 files changed, 5 insertions(+), 14 deletions(-)

diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
index 0bf385425ec..fb9dbe25b25 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
@@ -1,15 +1,10 @@
 <div class="adf-dropdown-widget {{field.className}}"
      [class.adf-invalid]="(!field.isValid && isTouched()) || isRestApiFailed" [class.adf-readonly]="field.readOnly" [class.adf-left-label-input-container]="field.leftLabels">
-    <div class="adf-dropdown-widget-top-labels">
-        <label class="adf-label" [attr.for]="field.id" [class.adf-left-label]="field.leftLabels">{{field.name | translate }}<span class="adf-asterisk"
-            *ngIf="isRequired()">*</span>
-        </label>
-    </div>
     <div>
         <mat-form-field>
-            <mat-label *ngIf="getDefaultOption(list$ | async) as defaultOption">
-                {{ defaultOption.name }}
-            </mat-label>
+            <label class="adf-label" [attr.for]="field.id" [class.adf-left-label]="field.leftLabels">{{field.name | translate }}<span class="adf-asterisk"
+                *ngIf="isRequired()">*</span>
+            </label>
             <mat-select class="adf-select"
                         [id]="field.id"
                         [(ngModel)]="field.value"
@@ -22,6 +17,7 @@
                         (blur)="markAsTouched()"
                         matTooltipPosition="above"
                         matTooltipShowDelay="1000"
+                        [placeholder]="getDefaultOption(list$ | async)?.name"
                         [multiple]="field.hasMultipleValues">
                 <adf-select-filter-input *ngIf="showInputFilter" (change)="filter$.next($event)"></adf-select-filter-input>
 
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.spec.ts b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.spec.ts
index 079752593b1..224d03948b4 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.spec.ts
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.spec.ts
@@ -36,7 +36,6 @@ import { TaskVariableCloud } from '../../../models/task-variable-cloud.model';
 import { HarnessLoader } from '@angular/cdk/testing';
 import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
 import { MatSelectHarness } from '@angular/material/select/testing';
-import { MatFormFieldHarness } from '@angular/material/form-field/testing';
 import { MatTooltipHarness } from '@angular/material/tooltip/testing';
 
 describe('DropdownCloudWidgetComponent', () => {
@@ -239,12 +238,8 @@ describe('DropdownCloudWidgetComponent', () => {
             await dropdown.open();
             await dropdown.clickOptions({ selector: '[id="empty"]' });
 
-            const formField = await loader.getHarness(MatFormFieldHarness);
-            const dropdownLabel = await formField.getLabel();
-
-            expect(dropdownLabel).toEqual('This is a mock none option');
+            expect(await dropdown.getValueText()).toEqual('This is a mock none option');
             expect(widget.fieldValue).toEqual(undefined);
-            expect(await dropdown.getValueText()).toEqual('');
         });
     });