From 9da7693d3425835bf8227b4e1b098adc47bb090e Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Wed, 26 Jun 2024 22:51:50 +0530
Subject: [PATCH] fix: render assigned_to in kanban

---
 frontend/src/components/MultipleAvatar.vue |  2 +-
 frontend/src/pages/Deals.vue               |  9 ++++++++-
 frontend/src/pages/Leads.vue               | 13 ++++++-------
 3 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/frontend/src/components/MultipleAvatar.vue b/frontend/src/components/MultipleAvatar.vue
index 4db97f39..d25670e3 100644
--- a/frontend/src/components/MultipleAvatar.vue
+++ b/frontend/src/components/MultipleAvatar.vue
@@ -12,7 +12,7 @@
           shape="circle"
           :image="avatars[0].image"
           :label="avatars[0].label"
-          size="sm"
+          :size="size"
         />
         <div class="truncate">{{ avatars[0].label }}</div>
       </div>
diff --git a/frontend/src/pages/Deals.vue b/frontend/src/pages/Deals.vue
index a399c558..1d15a994 100644
--- a/frontend/src/pages/Deals.vue
+++ b/frontend/src/pages/Deals.vue
@@ -153,6 +153,12 @@
             :label="getRow(itemName, fieldName).value"
           />
         </div>
+        <div v-else-if="fieldName === '_assign'" class="flex items-center">
+          <MultipleAvatar
+            :avatars="getRow(itemName, fieldName).label"
+            size="xs"
+          />
+        </div>
         <div v-else class="truncate text-base">
           {{ getRow(itemName, fieldName).label }}
         </div>
@@ -244,6 +250,7 @@
 </template>
 
 <script setup>
+import MultipleAvatar from '@/components/MultipleAvatar.vue'
 import CustomActions from '@/components/CustomActions.vue'
 import EmailAtIcon from '@/components/Icons/EmailAtIcon.vue'
 import PhoneIcon from '@/components/Icons/PhoneIcon.vue'
@@ -298,7 +305,7 @@ const viewControls = ref(null)
 
 function getRow(name, field) {
   function getValue(value) {
-    if (value && typeof value === 'object') {
+    if (value && typeof value === 'object' && !Array.isArray(value)) {
       return value
     }
     return { label: value }
diff --git a/frontend/src/pages/Leads.vue b/frontend/src/pages/Leads.vue
index 9207a252..add493fe 100644
--- a/frontend/src/pages/Leads.vue
+++ b/frontend/src/pages/Leads.vue
@@ -180,12 +180,10 @@
             :label="getRow(itemName, fieldName).value"
           />
         </div>
-        <div v-else-if="fieldName === 'Check'">
-          <FormControl
-            type="checkbox"
-            :modelValue="getRow(itemName, fieldName)"
-            :disabled="true"
-            class="text-gray-900"
+        <div v-else-if="fieldName === '_assign'" class="flex items-center">
+          <MultipleAvatar
+            :avatars="getRow(itemName, fieldName).label"
+            size="xs"
           />
         </div>
         <div v-else class="truncate text-base">
@@ -278,6 +276,7 @@
 </template>
 
 <script setup>
+import MultipleAvatar from '@/components/MultipleAvatar.vue'
 import CustomActions from '@/components/CustomActions.vue'
 import EmailAtIcon from '@/components/Icons/EmailAtIcon.vue'
 import PhoneIcon from '@/components/Icons/PhoneIcon.vue'
@@ -326,7 +325,7 @@ const viewControls = ref(null)
 
 function getRow(name, field) {
   function getValue(value) {
-    if (value && typeof value === 'object') {
+    if (value && typeof value === 'object' && !Array.isArray(value)) {
       return value
     }
     return { label: value }