From 72fa3e3eaa518ef86311ac0f0e81a3647413a4fb Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Wed, 22 May 2024 20:53:40 +0530
Subject: [PATCH] fix: show active heart icon if list filter is applied & if
 doc is liked

---
 .../components/ListViews/LeadsListView.vue    | 21 ++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/ListViews/LeadsListView.vue b/frontend/src/components/ListViews/LeadsListView.vue
index 8336a364..57b8cd55 100644
--- a/frontend/src/components/ListViews/LeadsListView.vue
+++ b/frontend/src/components/ListViews/LeadsListView.vue
@@ -21,7 +21,8 @@
         <Button
           v-if="column.key == '_liked_by'"
           variant="ghosted"
-          class="!h-4 fill-white"
+          class="!h-4"
+          :class="isLikeFilterApplied ? 'fill-red-500' : 'fill-white'"
         >
           <HeartIcon class="h-4 w-4" />
         </Button>
@@ -104,7 +105,7 @@
               <Button
                 v-if="column.key == '_liked_by'"
                 variant="ghosted"
-                class="fill-white"
+                :class="isLiked(item) ? 'fill-red-500' : 'fill-white'"
               >
                 <HeartIcon class="h-4 w-4" />
               </Button>
@@ -187,7 +188,8 @@ import {
   Dropdown,
   Tooltip,
 } from 'frappe-ui'
-import { ref, watch } from 'vue'
+import { sessionStore } from '@/stores/session'
+import { ref, computed, watch } from 'vue'
 
 const props = defineProps({
   rows: {
@@ -220,6 +222,19 @@ const emit = defineEmits([
 const pageLengthCount = defineModel()
 const list = defineModel('list')
 
+const isLikeFilterApplied = computed(() => {
+  return list.value.params?.filters?._liked_by ? true : false
+})
+
+const { user } = sessionStore()
+
+function isLiked(item) {
+  if (item) {
+    let likedByMe = JSON.parse(item)
+    return likedByMe.includes(user)
+  }
+}
+
 watch(pageLengthCount, (val, old_value) => {
   if (val === old_value) return
   emit('updatePageCount', val)