From 607d7bff75b2c95325e443f9c410facc8631179b Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Wed, 27 Dec 2023 17:19:07 +0530
Subject: [PATCH] fix: changed v-model to prop for avatars in MultipleAvatar
 component

---
 frontend/src/components/MultipleAvatar.vue | 24 ++++++++++++++++------
 frontend/src/pages/Deal.vue                |  2 +-
 frontend/src/pages/Lead.vue                |  2 +-
 3 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/frontend/src/components/MultipleAvatar.vue b/frontend/src/components/MultipleAvatar.vue
index 225e81ce..e84ddcd2 100644
--- a/frontend/src/components/MultipleAvatar.vue
+++ b/frontend/src/components/MultipleAvatar.vue
@@ -1,8 +1,15 @@
 <template>
-  <div v-if="avatars?.length" class="mr-1.5 flex flex-row-reverse items-center cursor-pointer">
-    <Tooltip :text="avatar.name" v-for="avatar in reverseAvatars" :key="avatar.name">
+  <div
+    v-if="avatars?.length"
+    class="mr-1.5 flex cursor-pointer flex-row-reverse items-center"
+  >
+    <Tooltip
+      :text="avatar.name"
+      v-for="avatar in reverseAvatars"
+      :key="avatar.name"
+    >
       <Avatar
-        class="-mr-1.5 transform border-2 border-white transition hover:z-10 hover:scale-125"
+        class="-mr-1.5 transform border-2 border-white transition hover:z-10 hover:scale-110"
         shape="circle"
         :image="avatar.image"
         :label="avatar.label"
@@ -13,8 +20,13 @@
 </template>
 <script setup>
 import { Avatar, Tooltip } from 'frappe-ui'
-import { computed, defineModel } from 'vue'
+import { computed } from 'vue'
 
-const avatars = defineModel()
-const reverseAvatars = computed(() => avatars.value.reverse())
+const props = defineProps({
+  avatars: {
+    type: Array,
+    default: [],
+  },
+})
+const reverseAvatars = computed(() => props.avatars.reverse())
 </script>
diff --git a/frontend/src/pages/Deal.vue b/frontend/src/pages/Deal.vue
index a689f594..aed48130 100644
--- a/frontend/src/pages/Deal.vue
+++ b/frontend/src/pages/Deal.vue
@@ -32,7 +32,7 @@
         <Button icon="more-horizontal" />
       </Dropdown>
       <MultipleAvatar
-        v-model="deal.data._assignedTo"
+        :avatars="deal.data._assignedTo"
         @click="showAssignmentModal = true"
       />
       <Dropdown :options="statusOptions('deal', updateField)">
diff --git a/frontend/src/pages/Lead.vue b/frontend/src/pages/Lead.vue
index 9cbcf17e..1bc5de2b 100644
--- a/frontend/src/pages/Lead.vue
+++ b/frontend/src/pages/Lead.vue
@@ -32,7 +32,7 @@
         <Button icon="more-horizontal" />
       </Dropdown>
       <MultipleAvatar
-        v-model="lead.data._assignedTo"
+        :avatars="lead.data._assignedTo"
         @click="showAssignmentModal = true"
       />
       <Dropdown :options="statusOptions('lead', updateField)">