From ea92af6244984c9bcd271411624228b6e9ba7ef1 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Mon, 29 Apr 2024 22:56:22 +0530
Subject: [PATCH 1/5] fix: truncate field label

---
 frontend/src/components/SectionFields.vue | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/SectionFields.vue b/frontend/src/components/SectionFields.vue
index 914d4c73..fb335158 100644
--- a/frontend/src/components/SectionFields.vue
+++ b/frontend/src/components/SectionFields.vue
@@ -6,10 +6,12 @@
       :class="[field.hidden && 'hidden']"
       class="flex items-center gap-2 px-3 leading-5 first:mt-3"
     >
-      <div class="w-[106px] shrink-0 text-sm text-gray-600">
-        {{ __(field.label) }}
-        <span class="text-red-500">{{ field.reqd ? ' *' : '' }}</span>
-      </div>
+      <Tooltip :text="__(field.label)" hoverDelay="1">
+        <div class="w-[106px] shrink-0 truncate text-sm text-gray-600">
+          <span>{{ __(field.label) }}</span>
+          <span class="text-red-500">{{ field.reqd ? ' *' : '' }}</span>
+        </div>
+      </Tooltip>
       <div
         class="grid min-h-[28px] flex-1 items-center overflow-hidden text-base"
       >

From 31d535d7c9c00581156e3e5d930896238d15dd51 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Mon, 29 Apr 2024 23:04:23 +0530
Subject: [PATCH 2/5] fix: truncate sidebar item label & transalation refactor

---
 .../src/components/Layouts/AppSidebar.vue     |  8 +++---
 frontend/src/components/SidebarLink.vue       | 26 ++++++++++---------
 2 files changed, 18 insertions(+), 16 deletions(-)

diff --git a/frontend/src/components/Layouts/AppSidebar.vue b/frontend/src/components/Layouts/AppSidebar.vue
index cf5a240a..94059457 100644
--- a/frontend/src/components/Layouts/AppSidebar.vue
+++ b/frontend/src/components/Layouts/AppSidebar.vue
@@ -10,7 +10,7 @@
       <div class="mb-3 flex flex-col">
         <SidebarLink
           id="notifications-btn"
-          :label="__('Notifications')"
+          label="Notifications"
           :icon="NotificationsIcon"
           :isCollapsed="isSidebarCollapsed"
           @click="() => toggleNotificationPanel()"
@@ -67,7 +67,7 @@
             <SidebarLink
               v-for="link in view.views"
               :icon="link.icon"
-              :label="__(link.label)"
+              :label="link.label"
               :to="link.to"
               :isCollapsed="isSidebarCollapsed"
               class="mx-2 my-0.5"
@@ -78,13 +78,13 @@
     </div>
     <div class="m-2 flex flex-col gap-1">
       <SidebarLink
-        :label="__('Docs')"
+        label="Docs"
         :isCollapsed="isSidebarCollapsed"
         icon="book-open"
         @click="() => openDocs()"
       />
       <SidebarLink
-        :label="isSidebarCollapsed ? __('Expand') : __('Collapse')"
+        :label="isSidebarCollapsed ? 'Expand' : 'Collapse'"
         :isCollapsed="isSidebarCollapsed"
         @click="isSidebarCollapsed = !isSidebarCollapsed"
         class=""
diff --git a/frontend/src/components/SidebarLink.vue b/frontend/src/components/SidebarLink.vue
index 391cd232..7bd5c48d 100644
--- a/frontend/src/components/SidebarLink.vue
+++ b/frontend/src/components/SidebarLink.vue
@@ -8,8 +8,8 @@
       class="flex w-full items-center justify-between duration-300 ease-in-out"
       :class="isCollapsed ? 'ml-[3px] p-1' : 'px-2 py-1'"
     >
-      <div class="flex items-center">
-        <Tooltip :text="label" placement="right" :disabled="!isCollapsed">
+      <div class="flex items-center truncate">
+        <Tooltip :text="__(label)" placement="right" :disabled="!isCollapsed">
           <slot name="icon">
             <span class="grid h-4.5 w-4.5 flex-shrink-0 place-items-center">
               <FeatherIcon
@@ -21,16 +21,18 @@
             </span>
           </slot>
         </Tooltip>
-        <span
-          class="flex-1 flex-shrink-0 text-base duration-300 ease-in-out"
-          :class="
-            isCollapsed
-              ? 'ml-0 w-0 overflow-hidden opacity-0'
-              : 'ml-2 w-auto opacity-100'
-          "
-        >
-          {{ label }}
-        </span>
+        <Tooltip :text="__(label)" placement="right" :disabled="isCollapsed" hoverDelay="1.5">
+          <span
+            class="flex-1 flex-shrink-0 truncate text-base duration-300 ease-in-out"
+            :class="
+              isCollapsed
+                ? 'ml-0 w-0 overflow-hidden opacity-0'
+                : 'ml-2 w-auto opacity-100'
+            "
+          >
+            {{ __(label) }}
+          </span>
+        </Tooltip>
       </div>
       <slot name="right" />
     </div>

From 88cc4f47214f3cb1e68b28b9187dac620544e536 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Mon, 29 Apr 2024 23:35:02 +0530
Subject: [PATCH 3/5] chore: added open in portal link in lead/deal desk page

---
 crm/fcrm/doctype/crm_deal/crm_deal.js        | 10 +++++-----
 crm/fcrm/doctype/crm_lead/crm_lead.js        | 10 +++++-----
 frontend/src/components/Modals/DealModal.vue |  2 +-
 3 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/crm/fcrm/doctype/crm_deal/crm_deal.js b/crm/fcrm/doctype/crm_deal/crm_deal.js
index 1b305ae0..944ac6d4 100644
--- a/crm/fcrm/doctype/crm_deal/crm_deal.js
+++ b/crm/fcrm/doctype/crm_deal/crm_deal.js
@@ -1,8 +1,8 @@
 // Copyright (c) 2023, Frappe Technologies Pvt. Ltd. and contributors
 // For license information, please see license.txt
 
-// frappe.ui.form.on("CRM Deal", {
-// 	refresh(frm) {
-
-// 	},
-// });
+frappe.ui.form.on("CRM Deal", {
+	refresh(frm) {
+		frm.add_web_link(`/crm/deals/${frm.doc.name}`, __("Open in Portal"));
+	},
+});
diff --git a/crm/fcrm/doctype/crm_lead/crm_lead.js b/crm/fcrm/doctype/crm_lead/crm_lead.js
index 0b354d77..0a9d57e1 100644
--- a/crm/fcrm/doctype/crm_lead/crm_lead.js
+++ b/crm/fcrm/doctype/crm_lead/crm_lead.js
@@ -1,8 +1,8 @@
 // Copyright (c) 2023, Frappe Technologies Pvt. Ltd. and contributors
 // For license information, please see license.txt
 
-// frappe.ui.form.on("CRM Lead", {
-// 	refresh(frm) {
-
-// 	},
-// });
+frappe.ui.form.on("CRM Lead", {
+	refresh(frm) {
+		frm.add_web_link(`/crm/leads/${frm.doc.name}`, __("Open in Portal"));
+	},
+});
diff --git a/frontend/src/components/Modals/DealModal.vue b/frontend/src/components/Modals/DealModal.vue
index fbfcf1b1..d82a4b95 100644
--- a/frontend/src/components/Modals/DealModal.vue
+++ b/frontend/src/components/Modals/DealModal.vue
@@ -17,7 +17,7 @@
           <Switch v-model="chooseExistingContact" />
         </div>
       </div>
-      <Fields class="border-t" :sections="sections" :data="deal" />
+      <Fields class="border-t pt-4" :sections="sections" :data="deal" />
       <ErrorMessage class="mt-4" v-if="error" :message="__(error)" />
     </template>
     <template #actions>

From b8cdb5e86823c41e20da8ac4a5350e1901d6872c Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Tue, 30 Apr 2024 12:49:55 +0530
Subject: [PATCH 4/5] fix: onlick of text only apply filter

---
 .../components/ListViews/CallLogsListView.vue |  70 ++++++-----
 .../components/ListViews/ContactsListView.vue |  51 ++++----
 .../components/ListViews/DealsListView.vue    | 109 +++++++++--------
 .../ListViews/EmailTemplatesListView.vue      |  70 ++++++-----
 .../components/ListViews/LeadsListView.vue    | 113 ++++++++++--------
 .../ListViews/OrganizationsListView.vue       |  51 ++++----
 .../components/ListViews/TasksListView.vue    |  52 ++++----
 7 files changed, 304 insertions(+), 212 deletions(-)

diff --git a/frontend/src/components/ListViews/CallLogsListView.vue b/frontend/src/components/ListViews/CallLogsListView.vue
index a9fd0bd9..7ccd86a6 100644
--- a/frontend/src/components/ListViews/CallLogsListView.vue
+++ b/frontend/src/components/ListViews/CallLogsListView.vue
@@ -22,10 +22,7 @@
         v-slot="{ idx, column, item }"
         :row="row"
       >
-        <ListRowItem
-          :item="item"
-          @click="(event) => emit('applyFilter', { event, idx, column, item })"
-        >
+        <ListRowItem :item="item">
           <template #prefix>
             <div v-if="['caller', 'receiver'].includes(column.key)">
               <Avatar
@@ -40,30 +37,47 @@
               <FeatherIcon :name="item.icon" class="h-3 w-3" />
             </div>
           </template>
-          <div
-            v-if="['modified', 'creation'].includes(column.key)"
-            class="truncate text-base"
-          >
-            <Tooltip :text="item.label">
-              <div>{{ item.timeAgo }}</div>
-            </Tooltip>
-          </div>
-          <div v-else-if="column.key === 'status'" class="truncate text-base">
-            <Badge
-              :variant="'subtle'"
-              :theme="item.color"
-              size="md"
-              :label="__(item.label)"
-            />
-          </div>
-          <div v-else-if="column.type === 'Check'">
-            <FormControl
-              type="checkbox"
-              :modelValue="item"
-              :disabled="true"
-              class="text-gray-900"
-            />
-          </div>
+          <template #default="{ label }">
+            <div
+              v-if="['modified', 'creation'].includes(column.key)"
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              <Tooltip :text="item.label">
+                <div>{{ item.timeAgo }}</div>
+              </Tooltip>
+            </div>
+            <div v-else-if="column.key === 'status'" class="truncate text-base">
+              <Badge
+                :variant="'subtle'"
+                :theme="item.color"
+                size="md"
+                :label="__(item.label)"
+                @click="
+                  (event) => emit('applyFilter', { event, idx, column, item })
+                "
+              />
+            </div>
+            <div v-else-if="column.type === 'Check'">
+              <FormControl
+                type="checkbox"
+                :modelValue="item"
+                :disabled="true"
+                class="text-gray-900"
+              />
+            </div>
+            <div
+              v-else
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              {{ label }}
+            </div>
+          </template>
         </ListRowItem>
       </ListRow>
     </ListRows>
diff --git a/frontend/src/components/ListViews/ContactsListView.vue b/frontend/src/components/ListViews/ContactsListView.vue
index 82cd2a47..4e5d33f5 100644
--- a/frontend/src/components/ListViews/ContactsListView.vue
+++ b/frontend/src/components/ListViews/ContactsListView.vue
@@ -23,10 +23,7 @@
         v-slot="{ idx, column, item }"
         :row="row"
       >
-        <ListRowItem
-          :item="item"
-          @click="(event) => emit('applyFilter', { event, idx, column, item })"
-        >
+        <ListRowItem :item="item">
           <template #prefix>
             <div v-if="column.key === 'full_name'">
               <Avatar
@@ -50,22 +47,36 @@
               <PhoneIcon class="h-4 w-4" />
             </div>
           </template>
-          <div
-            v-if="['modified', 'creation'].includes(column.key)"
-            class="truncate text-base"
-          >
-            <Tooltip :text="item.label">
-              <div>{{ item.timeAgo }}</div>
-            </Tooltip>
-          </div>
-          <div v-else-if="column.type === 'Check'">
-            <FormControl
-              type="checkbox"
-              :modelValue="item"
-              :disabled="true"
-              class="text-gray-900"
-            />
-          </div>
+          <template #default="{ label }">
+            <div
+              v-if="['modified', 'creation'].includes(column.key)"
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              <Tooltip :text="item.label">
+                <div>{{ item.timeAgo }}</div>
+              </Tooltip>
+            </div>
+            <div v-else-if="column.type === 'Check'">
+              <FormControl
+                type="checkbox"
+                :modelValue="item"
+                :disabled="true"
+                class="text-gray-900"
+              />
+            </div>
+            <div
+              v-else
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              {{ label }}
+            </div>
+          </template>
         </ListRowItem>
       </ListRow>
     </ListRows>
diff --git a/frontend/src/components/ListViews/DealsListView.vue b/frontend/src/components/ListViews/DealsListView.vue
index 7660a29e..73d421ec 100644
--- a/frontend/src/components/ListViews/DealsListView.vue
+++ b/frontend/src/components/ListViews/DealsListView.vue
@@ -20,18 +20,16 @@
         v-slot="{ idx, column, item }"
         :row="row"
       >
-        <div
-          v-if="column.key === '_assign'"
-          class="flex items-center"
-          @click="(event) => emit('applyFilter', { event, idx, column, item })"
-        >
-          <MultipleAvatar :avatars="item" size="sm" />
+        <div v-if="column.key === '_assign'" class="flex items-center">
+          <MultipleAvatar
+            :avatars="item"
+            size="sm"
+            @click="
+              (event) => emit('applyFilter', { event, idx, column, item })
+            "
+          />
         </div>
-        <ListRowItem
-          v-else
-          :item="item"
-          @click="(event) => emit('applyFilter', { event, idx, column, item })"
-        >
+        <ListRowItem v-else :item="item">
           <template #prefix>
             <div v-if="column.key === 'status'">
               <IndicatorIcon :class="item.color" />
@@ -58,42 +56,59 @@
               <PhoneIcon class="h-4 w-4" />
             </div>
           </template>
-          <div
-            v-if="
-              [
-                'modified',
-                'creation',
-                'first_response_time',
-                'first_responded_on',
-                'response_by',
-              ].includes(column.key)
-            "
-            class="truncate text-base"
-          >
-            <Tooltip :text="item.label">
-              <div>{{ item.timeAgo }}</div>
-            </Tooltip>
-          </div>
-          <div
-            v-else-if="column.key === 'sla_status'"
-            class="truncate text-base"
-          >
-            <Badge
-              v-if="item.value"
-              :variant="'subtle'"
-              :theme="item.color"
-              size="md"
-              :label="item.value"
-            />
-          </div>
-          <div v-else-if="column.type === 'Check'">
-            <FormControl
-              type="checkbox"
-              :modelValue="item"
-              :disabled="true"
-              class="text-gray-900"
-            />
-          </div>
+          <template #default="{ label }">
+            <div
+              v-if="
+                [
+                  'modified',
+                  'creation',
+                  'first_response_time',
+                  'first_responded_on',
+                  'response_by',
+                ].includes(column.key)
+              "
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              <Tooltip :text="item.label">
+                <div>{{ item.timeAgo }}</div>
+              </Tooltip>
+            </div>
+            <div
+              v-else-if="column.key === 'sla_status'"
+              class="truncate text-base"
+            >
+              <Badge
+                v-if="item.value"
+                :variant="'subtle'"
+                :theme="item.color"
+                size="md"
+                :label="item.value"
+                @click="
+                  (event) => emit('applyFilter', { event, idx, column, item })
+                "
+              />
+            </div>
+            <div v-else-if="column.type === 'Check'">
+              <FormControl
+                type="checkbox"
+                :modelValue="item"
+                :disabled="true"
+                class="text-gray-900"
+              />
+            </div>
+            <div
+              v-else
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              {{ label }}
+            </div>
+          </template>
         </ListRowItem>
       </ListRow>
     </ListRows>
diff --git a/frontend/src/components/ListViews/EmailTemplatesListView.vue b/frontend/src/components/ListViews/EmailTemplatesListView.vue
index 4a5c4f10..c965d37b 100644
--- a/frontend/src/components/ListViews/EmailTemplatesListView.vue
+++ b/frontend/src/components/ListViews/EmailTemplatesListView.vue
@@ -19,37 +19,51 @@
         v-slot="{ idx, column, item }"
         :row="row"
       >
-        <ListRowItem
-          :item="item"
-          @click="(event) => emit('applyFilter', { event, idx, column, item })"
-        >
+        <ListRowItem :item="item">
           <!-- <template #prefix>
 
           </template> -->
-          <div
-            v-if="['modified', 'creation'].includes(column.key)"
-            class="truncate text-base"
-          >
-            <Tooltip :text="item.label">
-              <div>{{ item.timeAgo }}</div>
-            </Tooltip>
-          </div>
-          <div v-else-if="column.key === 'status'" class="truncate text-base">
-            <Badge
-              :variant="'subtle'"
-              :theme="item.color"
-              size="md"
-              :label="item.label"
-            />
-          </div>
-          <div v-else-if="column.type === 'Check'">
-            <FormControl
-              type="checkbox"
-              :modelValue="item"
-              :disabled="true"
-              class="text-gray-900"
-            />
-          </div>
+          <template #default="{ label }">
+            <div
+              v-if="['modified', 'creation'].includes(column.key)"
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              <Tooltip :text="item.label">
+                <div>{{ item.timeAgo }}</div>
+              </Tooltip>
+            </div>
+            <div v-else-if="column.key === 'status'" class="truncate text-base">
+              <Badge
+                :variant="'subtle'"
+                :theme="item.color"
+                size="md"
+                :label="item.label"
+                @click="
+                  (event) => emit('applyFilter', { event, idx, column, item })
+                "
+              />
+            </div>
+            <div v-else-if="column.type === 'Check'">
+              <FormControl
+                type="checkbox"
+                :modelValue="item"
+                :disabled="true"
+                class="text-gray-900"
+              />
+            </div>
+            <div
+              v-else
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              {{ label }}
+            </div>
+          </template>
         </ListRowItem>
       </ListRow>
     </ListRows>
diff --git a/frontend/src/components/ListViews/LeadsListView.vue b/frontend/src/components/ListViews/LeadsListView.vue
index bf7c83ad..229e50ae 100644
--- a/frontend/src/components/ListViews/LeadsListView.vue
+++ b/frontend/src/components/ListViews/LeadsListView.vue
@@ -20,18 +20,16 @@
         v-slot="{ idx, column, item }"
         :row="row"
       >
-        <div
-          v-if="column.key === '_assign'"
-          class="flex items-center"
-          @click="(event) => emit('applyFilter', { event, idx, column, item })"
-        >
-          <MultipleAvatar :avatars="item" size="sm" />
+        <div v-if="column.key === '_assign'" class="flex items-center">
+          <MultipleAvatar
+            :avatars="item"
+            size="sm"
+            @click="
+              (event) => emit('applyFilter', { event, idx, column, item })
+            "
+          />
         </div>
-        <ListRowItem
-          v-else
-          :item="item"
-          @click="(event) => emit('applyFilter', { event, idx, column, item })"
-        >
+        <ListRowItem v-else :item="item">
           <template #prefix>
             <div v-if="column.key === 'status'">
               <IndicatorIcon :class="item.color" />
@@ -67,42 +65,59 @@
               <PhoneIcon class="h-4 w-4" />
             </div>
           </template>
-          <div
-            v-if="
-              [
-                'modified',
-                'creation',
-                'first_response_time',
-                'first_responded_on',
-                'response_by',
-              ].includes(column.key)
-            "
-            class="truncate text-base"
-          >
-            <Tooltip :text="item.label">
-              <div>{{ item.timeAgo }}</div>
-            </Tooltip>
-          </div>
-          <div
-            v-else-if="column.key === 'sla_status'"
-            class="truncate text-base"
-          >
-            <Badge
-              v-if="item.value"
-              :variant="'subtle'"
-              :theme="item.color"
-              size="md"
-              :label="item.value"
-            />
-          </div>
-          <div v-else-if="column.type === 'Check'">
-            <FormControl
-              type="checkbox"
-              :modelValue="item"
-              :disabled="true"
-              class="text-gray-900"
-            />
-          </div>
+          <template #default="{ label }">
+            <div
+              v-if="
+                [
+                  'modified',
+                  'creation',
+                  'first_response_time',
+                  'first_responded_on',
+                  'response_by',
+                ].includes(column.key)
+              "
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              <Tooltip :text="item.label">
+                <div>{{ item.timeAgo }}</div>
+              </Tooltip>
+            </div>
+            <div
+              v-else-if="column.key === 'sla_status'"
+              class="truncate text-base"
+            >
+              <Badge
+                v-if="item.value"
+                :variant="'subtle'"
+                :theme="item.color"
+                size="md"
+                :label="item.value"
+                @click="
+                  (event) => emit('applyFilter', { event, idx, column, item })
+                "
+              />
+            </div>
+            <div v-else-if="column.type === 'Check'">
+              <FormControl
+                type="checkbox"
+                :modelValue="item"
+                :disabled="true"
+                class="text-gray-900"
+              />
+            </div>
+            <div
+              v-else
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              {{ label }}
+            </div>
+          </template>
         </ListRowItem>
       </ListRow>
     </ListRows>
@@ -213,7 +228,9 @@ function editValues(selections, unselectAll) {
 function deleteValues(selections, unselectAll) {
   $dialog({
     title: __('Delete'),
-    message: __('Are you sure you want to delete {0} item(s)?', [selections.size]),
+    message: __('Are you sure you want to delete {0} item(s)?', [
+      selections.size,
+    ]),
     variant: 'danger',
     actions: [
       {
diff --git a/frontend/src/components/ListViews/OrganizationsListView.vue b/frontend/src/components/ListViews/OrganizationsListView.vue
index cfc3c704..2e23e05e 100644
--- a/frontend/src/components/ListViews/OrganizationsListView.vue
+++ b/frontend/src/components/ListViews/OrganizationsListView.vue
@@ -22,10 +22,7 @@
         v-slot="{ idx, column, item }"
         :row="row"
       >
-        <ListRowItem
-          :item="item"
-          @click="(event) => emit('applyFilter', { event, idx, column, item })"
-        >
+        <ListRowItem :item="item">
           <template #prefix>
             <div v-if="column.key === 'organization_name'">
               <Avatar
@@ -37,22 +34,36 @@
               />
             </div>
           </template>
-          <div
-            v-if="['modified', 'creation'].includes(column.key)"
-            class="truncate text-base"
-          >
-            <Tooltip :text="item.label">
-              <div>{{ item.timeAgo }}</div>
-            </Tooltip>
-          </div>
-          <div v-else-if="column.type === 'Check'">
-            <FormControl
-              type="checkbox"
-              :modelValue="item"
-              :disabled="true"
-              class="text-gray-900"
-            />
-          </div>
+          <template #default="{ label }">
+            <div
+              v-if="['modified', 'creation'].includes(column.key)"
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              <Tooltip :text="item.label">
+                <div>{{ item.timeAgo }}</div>
+              </Tooltip>
+            </div>
+            <div v-else-if="column.type === 'Check'">
+              <FormControl
+                type="checkbox"
+                :modelValue="item"
+                :disabled="true"
+                class="text-gray-900"
+              />
+            </div>
+            <div
+              v-else
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              {{ label }}
+            </div>
+          </template>
         </ListRowItem>
       </ListRow>
     </ListRows>
diff --git a/frontend/src/components/ListViews/TasksListView.vue b/frontend/src/components/ListViews/TasksListView.vue
index b6e1d80c..33e2332e 100644
--- a/frontend/src/components/ListViews/TasksListView.vue
+++ b/frontend/src/components/ListViews/TasksListView.vue
@@ -29,11 +29,7 @@
             </div>
           </Tooltip>
         </div>
-        <ListRowItem
-          v-else
-          :item="item"
-          @click="(event) => emit('applyFilter', { event, idx, column, item })"
-        >
+        <ListRowItem v-else :item="item">
           <template #prefix>
             <div v-if="column.key === 'status'">
               <TaskStatusIcon :status="item" />
@@ -51,22 +47,36 @@
               />
             </div>
           </template>
-          <div
-            v-if="['modified', 'creation'].includes(column.key)"
-            class="truncate text-base"
-          >
-            <Tooltip :text="item.label">
-              <div>{{ item.timeAgo }}</div>
-            </Tooltip>
-          </div>
-          <div v-else-if="column.type === 'Check'">
-            <FormControl
-              type="checkbox"
-              :modelValue="item"
-              :disabled="true"
-              class="text-gray-900"
-            />
-          </div>
+          <template #default="{ label }">
+            <div
+              v-if="['modified', 'creation'].includes(column.key)"
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              <Tooltip :text="item.label">
+                <div>{{ item.timeAgo }}</div>
+              </Tooltip>
+            </div>
+            <div v-else-if="column.type === 'Check'">
+              <FormControl
+                type="checkbox"
+                :modelValue="item"
+                :disabled="true"
+                class="text-gray-900"
+              />
+            </div>
+            <div
+              v-else
+              class="truncate text-base"
+              @click="
+                (event) => emit('applyFilter', { event, idx, column, item })
+              "
+            >
+              {{ label }}
+            </div>
+          </template>
         </ListRowItem>
       </ListRow>
     </ListRows>

From ba5526823702aefd979b920e8c249acf5590e343 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Tue, 30 Apr 2024 13:55:15 +0530
Subject: [PATCH 5/5] fix: cannot delete task

---
 frontend/src/components/ListViews/TasksListView.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/ListViews/TasksListView.vue b/frontend/src/components/ListViews/TasksListView.vue
index b6e1d80c..a3103170 100644
--- a/frontend/src/components/ListViews/TasksListView.vue
+++ b/frontend/src/components/ListViews/TasksListView.vue
@@ -177,7 +177,9 @@ function editValues(selections, unselectAll) {
 function deleteValues(selections, unselectAll) {
   $dialog({
     title: __('Delete'),
-    message: __('Are you sure you want to delete {0} item(s)?'),
+    message: __('Are you sure you want to delete {0} item(s)?', [
+      selections.size,
+    ]),
     variant: 'danger',
     actions: [
       {