From c121755f3550474c603dccabd3dd0840e794c0f8 Mon Sep 17 00:00:00 2001
From: Wanderley Teixeira <wanderley.teixeira@totvs.com.br>
Date: Thu, 21 Nov 2024 20:16:39 -0300
Subject: [PATCH] =?UTF-8?q?fix(dynamic-view):=20ajusta=20renderiza=C3=A7?=
 =?UTF-8?q?=C3=A3o=20do=20multiselect?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Ajusta renderização de campo com multiplas opções.

Fixes #2308
---
 .../po-dynamic-view.component.spec.ts         | 30 +++++++++++++++++++
 .../po-dynamic-view.component.ts              |  9 ++++--
 2 files changed, 37 insertions(+), 2 deletions(-)

diff --git a/projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view.component.spec.ts b/projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view.component.spec.ts
index efca9f17b..a383ec6d3 100644
--- a/projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view.component.spec.ts
+++ b/projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view.component.spec.ts
@@ -249,6 +249,36 @@ describe('PoDynamicViewComponent:', () => {
     });
 
     describe('setFieldValue:', () => {
+      it(`should return the labels of the selected options if options exist and a match is found`, () => {
+        const field = {
+          value: ['value1'],
+          optionsMulti: true,
+          options: [
+            { value: 'value1', label: 'label1' },
+            { value: 'value2', label: 'label2' },
+            { value: 'value3', label: 'label3' }
+          ]
+        };
+
+        field.value = ['value1', 'value2'];
+        expect(component.setFieldValue(field)).toEqual(['label1', 'label2']);
+      });
+
+      it(`should return the field values if options exist but no match is found'`, () => {
+        const field = {
+          value: ['value1'],
+          optionsMulti: true,
+          options: [
+            { value: 'value1', label: 'label1' },
+            { value: 'value2', label: 'label2' },
+            { value: 'value3', label: 'label3' }
+          ]
+        };
+
+        field.value = ['value4'];
+        expect(component.setFieldValue(field)).toEqual(['value4']);
+      });
+
       it(`should return the label of the selected option if options exist and a match is found`, () => {
         const field = {
           value: 'value1',
diff --git a/projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view.component.ts b/projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view.component.ts
index 9275dac36..81c428bbe 100644
--- a/projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view.component.ts
+++ b/projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view.component.ts
@@ -85,8 +85,13 @@ export class PoDynamicViewComponent extends PoDynamicViewBaseComponent implement
 
   setFieldValue(field) {
     if (field.options) {
-      const selectedOption = field.options.find(option => option.value === field.value);
-      return selectedOption ? selectedOption.label : field.value;
+      if (field.optionsMulti) {
+        const selectedOptions = field.options.filter(option => field.value.some(value => value === option.value));
+        return selectedOptions.length ? selectedOptions.map(option => option.label) : field.value;
+      } else {
+        const selectedOption = field.options.find(option => option.value === field.value);
+        return selectedOption ? selectedOption.label : field.value;
+      }
     } else if (field.type === 'boolean' && 'booleanTrue' in field && 'booleanFalse' in field) {
       return field.value ? field.booleanTrue : field.booleanFalse;
     } else {