From 491a664c8cba75a50b168b91f55ed5d10887a400 Mon Sep 17 00:00:00 2001
From: Sabu Siyad <hello@ssiyad.com>
Date: Thu, 29 Jun 2023 01:24:34 +0530
Subject: [PATCH] chore: ticket list: move empty message to table component

---
 desk/src/components/HelpdeskTable.vue          |  2 +-
 desk/src/pages/desk/ticket-list/MainTable.vue  |  5 ++++-
 desk/src/pages/desk/ticket-list/TicketList.vue | 10 +---------
 3 files changed, 6 insertions(+), 11 deletions(-)

diff --git a/desk/src/components/HelpdeskTable.vue b/desk/src/components/HelpdeskTable.vue
index b6412cf1e..38a77cf6b 100644
--- a/desk/src/components/HelpdeskTable.vue
+++ b/desk/src/components/HelpdeskTable.vue
@@ -2,7 +2,7 @@
   <div class="w-full overflow-hidden overflow-x-auto">
     <div
       v-if="isEmpty(data)"
-      class="flex h-full w-full items-center justify-center text-base text-gray-900"
+      class="flex h-full w-full items-center justify-center text-base text-gray-700"
     >
       {{ emptyMessage }}
     </div>
diff --git a/desk/src/pages/desk/ticket-list/MainTable.vue b/desk/src/pages/desk/ticket-list/MainTable.vue
index a5e57b235..3f596627a 100644
--- a/desk/src/pages/desk/ticket-list/MainTable.vue
+++ b/desk/src/pages/desk/ticket-list/MainTable.vue
@@ -1,9 +1,10 @@
 <template>
   <HelpdeskTable
     v-model:selection="selection"
+    row-key="name"
     :columns="columns"
     :data="tickets.list.data"
-    row-key="name"
+    :empty-message="emptyMessage"
   >
     <template #subject="{ data }">
       <TicketSummary
@@ -101,6 +102,8 @@ const ticketPriorityStore = useTicketPriorityStore();
 const ticketStatusStore = useTicketStatusStore();
 const { selection, tickets } = useTicketListStore();
 
+const emptyMessage =
+  "🎉 Great news! There are currently no tickets to display. Keep up the good work!";
 const dateFormat = "D/M/YYYY h:mm A";
 const columns = [
   {
diff --git a/desk/src/pages/desk/ticket-list/TicketList.vue b/desk/src/pages/desk/ticket-list/TicketList.vue
index 0f0c9e1a9..78aae6a42 100644
--- a/desk/src/pages/desk/ticket-list/TicketList.vue
+++ b/desk/src/pages/desk/ticket-list/TicketList.vue
@@ -17,13 +17,7 @@
         <TopSection class="mt-4" />
       </template>
     </PageTitle>
-    <MainTable v-if="tickets.totalCount" class="grow" />
-    <div
-      v-else
-      class="flex grow items-center justify-center text-sm text-gray-800"
-    >
-      {{ isEmptyMessage }}
-    </div>
+    <MainTable class="grow" />
     <ListNavigation v-bind="tickets" class="p-2" />
     <NewTicketDialog
       v-model="isDialogVisible"
@@ -45,8 +39,6 @@ import IconPlus from "~icons/lucide/plus";
 
 const { init, deinit, tickets } = useTicketListStore();
 const isDialogVisible = ref(false);
-const isEmptyMessage =
-  "🎉 Great news! There are currently no tickets to display. Keep up the good work!";
 
 onMounted(init);
 onUnmounted(deinit);