[AAE-12260] - fixing form field mapping (#8243)

* [AAE-12260] - reverting form field mapping to fix wrong behaivour

* [AAE-12260] - fixed readonly radiobutton

* [AAE-12260] - fixed valid check for rest options when multiple choice is made

* [AAE-12260] - fixed name for array elements

* [ci skip]

* start ci

lib/core/src/lib/form/components/widgets/core/form-field.model.spec.ts

@@ -714,8 +714,8 @@ describe('FormFieldModel', () => {
             ]
         });
         field.updateForm();
-        expect(form.values['dropdown_field']['fake-id-property']).toEqual('opt1');
+        expect(form.values['dropdown_field'].id).toEqual('opt1');
-        expect(form.values['dropdown_field']['fake-label-property']).toEqual('Option 1');
+        expect(form.values['dropdown_field'].name).toEqual('Option 1');
     });
 
     it('dropdown field type should be formatted on id and name properties if rest properties are not set', () => {
@@ -760,8 +760,8 @@ describe('FormFieldModel', () => {
             ]
         });
         field.updateForm();
-        expect(form.values['radio_bananan_field']['banana']).toEqual('opt1');
+        expect(form.values['radio_bananan_field'].id).toEqual('opt1');
-        expect(form.values['radio_bananan_field']['banLabel']).toEqual('Option 1');
+        expect(form.values['radio_bananan_field'].name).toEqual('Option 1');
     });
 
     it('radio button field rest type should appear with id / name properties when rest properties are not configured', () => {

lib/core/src/lib/form/components/widgets/core/form-field.model.ts

@@ -384,14 +384,14 @@ export class FormFieldModel extends FormWidgetModel {
 
                     const entry: FormFieldOption[] = this.options.filter((opt) => opt.id === this.value);
                     if (entry.length > 0) {
-                        this.setFormFieldValueOption(entry[0]);
+                        this.form.values[this.id] = entry[0];
                     }
                 }
                 break;
             case FormFieldTypes.RADIO_BUTTONS:
                 const radioButton: FormFieldOption[] = this.options.filter((opt) => opt.id === this.value);
                 if (radioButton.length > 0) {
-                    this.setFormFieldValueOption(radioButton[0]);
+                    this.form.values[this.id] = radioButton[0];
                 }
                 break;
             case FormFieldTypes.UPLOAD:
@@ -500,17 +500,4 @@ export class FormFieldModel extends FormWidgetModel {
             json.type === FormFieldTypes.BOOLEAN;
     }
 
-    private setFormFieldValueOption(option: FormFieldOption ) {
-        if (this.optionType === 'rest' && !!this.restUrl) {
-            const restEntry = {};
-            const restIdProperty = this.restIdProperty || 'id';
-            const restLabelProperty = this.restLabelProperty || 'name';
-            restEntry[restIdProperty] = option.id;
-            restEntry[restLabelProperty] = option.name;
-            this.form.values[this.id] = restEntry;
-        } else {
-            this.form.values[this.id] = option;
-        }
-    }
-
 }

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

@@ -465,6 +465,96 @@ describe('DropdownCloudWidgetComponent', () => {
                 { id: 'opt_2', name: 'option_2' }
             ]);
         });
+
+        it('should show preselected option for rest options', async () => {
+            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
+                id: 'dropdown-id',
+                name: 'date-name',
+                type: 'dropdown',
+                readOnly: 'false',
+                restUrl: 'https://fake-rest-url',
+                optionType : 'rest',
+                selectionType: 'multiple',
+                value: [
+                    { id: 'opt_3', name: 'option_3' },
+                    { id: 'opt_4', name: 'option_4' }
+                ]
+            });
+            spyOn(formCloudService, 'getRestWidgetData').and.returnValue(of([
+                {
+                    id: 'opt_1',
+                    name: 'option_1'
+                },
+                {
+                    id: 'opt_2',
+                    name: 'option_2'
+                },
+                {
+                    id: 'opt_3',
+                    name: 'option_3'
+                },
+                {
+                    id: 'opt_4',
+                    name: 'option_4'
+                }
+            ] as any));
+
+            fixture.detectChanges();
+            await fixture.whenStable();
+            fixture.detectChanges();
+
+            const selectedPlaceHolder = fixture.debugElement.query(By.css('.mat-select-value-text span'));
+            expect(selectedPlaceHolder.nativeElement.getInnerHTML()).toEqual('option_3, option_4');
+
+            await openSelect('#dropdown-id');
+
+            const options = fixture.debugElement.queryAll(By.css('.mat-selected span'));
+            expect(Array.from(options).map(({ nativeElement }) => nativeElement.getInnerHTML().trim()))
+                .toEqual(['option_3', 'option_4']);
+        });
+
+        it('should support multiple options for rest options', async () => {
+            widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
+                id: 'dropdown-id',
+                name: 'date-name',
+                type: 'dropdown',
+                readOnly: 'false',
+                restUrl: 'https://fake-rest-url',
+                optionType : 'rest',
+                selectionType: 'multiple'
+            });
+
+            spyOn(formCloudService, 'getRestWidgetData').and.returnValue(of([
+                {
+                    id: 'opt_1',
+                    name: 'option_1'
+                },
+                {
+                    id: 'opt_2',
+                    name: 'option_2'
+                },
+                {
+                    id: 'opt_3',
+                    name: 'option_3'
+                },
+                {
+                    id: 'opt_4',
+                    name: 'option_4'
+                }
+            ] as any));
+
+            fixture.detectChanges();
+            await openSelect('#dropdown-id');
+
+            const optionOne = fixture.debugElement.query(By.css('[id="opt_2"]'));
+            const optionTwo = fixture.debugElement.query(By.css('[id="opt_4"]'));
+            optionOne.triggerEventHandler('click', null);
+            optionTwo.triggerEventHandler('click', null);
+            expect(widget.field.value).toEqual([
+                { id: 'opt_2', name: 'option_2' },
+                { id: 'opt_4', name: 'option_4' }
+            ]);
+        });
     });
 
     describe('Linked Dropdown', () => {

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

@@ -185,8 +185,14 @@ export class DropdownCloudWidgetComponent extends WidgetComponent implements OnI
     }
 
     private isSelectedValueInOptions(): boolean {
+        if (Array.isArray(this.fieldValue)) {
+            const optionIdList = [...this.field.options].map(option => option.id);
+            const fieldValueIds = this.fieldValue.map(valueOption => valueOption.id);
+            return fieldValueIds.every(valueOptionId => optionIdList.includes(valueOptionId));
+        } else {
             return [...this.field.options].map(option => option.id).includes(this.fieldValue);
         }
+    }
 
     get fieldValue(): string {
         return this.field.value;

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

@@ -85,13 +85,7 @@ export class RadioButtonsCloudWidgetComponent extends WidgetComponent implements
 
     isChecked(option: FormFieldOption): boolean {
         if (this.field.value && typeof this.field.value === 'object') {
-            let id = 'id';
+            return this.field.value['id'] === option.id || this.field.value['name'] === option.name;
-            let name = 'name';
-            if (this.field.restUrl) {
-                id = this.field.restIdProperty ?? 'id';
-                name = this.field.restLabelProperty ?? 'name';
-            }
-            return this.field.value[id] === option.id || this.field.value[name] === option.name;
         }
         return this.field.value === option.id;
     }