fix: empty state of ticket list view

Author: RitvikSardana

desk/src/components/EmptyState.vue

@@ -15,16 +15,16 @@
   </div>
 </template>
 
-<script setup>
-defineProps({
-  title: {
-    type: String,
-    default: "No Data Found",
-  },
-  icon: {
-    type: String || HTMLElement,
-    default: "",
-  },
+<script setup lang="ts">
+import { VNode } from "vue";
+interface Props {
+  title: string;
+  icon?: VNode | string;
+}
+
+withDefaults(defineProps<Props>(), {
+  title: "No Data Found",
+  icon: "",
 });
 
 const emit = defineEmits(["emptyStateAction"]);

desk/src/components/ListViewBuilder.vue

@@ -90,12 +90,13 @@
   <EmptyState
     v-else
     :title="emptyState.title"
+    :icon="emptyState.icon"
     @emptyStateAction="emit('emptyStateAction')"
   />
 </template>
 
 <script setup lang="ts">
-import { reactive, provide, computed, h, ref } from "vue";
+import { reactive, provide, computed, h, ref, VNode } from "vue";
 import {
   createResource,
   ListView,
@@ -128,7 +129,8 @@ interface P {
     defaultFilters?: Record<string, any>;
     columnConfig?: Record<string, any>;
     emptyState?: {
-      icon?: HTMLElement | string;
+      // type of a h componnt
+      icon?: string | VNode;
       title: string;
     };
     hideViewControls?: boolean;

desk/src/pages/ticket/Tickets2.vue

@@ -19,6 +19,12 @@
     <ListViewBuilder
       ref="listViewRef"
       :options="options"
+      @empty-state-action="
+        () =>
+          $router.push({
+            name: isCustomerPortal ? 'TicketNew' : 'TicketAgentNew',
+          })
+      "
       @row-click="
         (row) =>
           $router.push({
@@ -29,7 +35,7 @@
     />
     <ExportModal
       v-model="showExportModal"
-      :rowCount="$refs.listViewRef?.list?.data?.total_count"
+      :rowCount="$refs.listViewRef?.list?.data?.total_count ?? 0"
       @update="
         ({ export_type, export_all }) => exportRows(export_type, export_all)
       "
@@ -47,6 +53,7 @@ import { useTicketStatusStore } from "@/stores/ticketStatus";
 import { dayjs } from "@/dayjs";
 import { createToast, isCustomerPortal } from "@/utils";
 import { capture } from "@/telemetry";
+import { TicketIcon } from "@/components/icons";
 
 const listViewRef = ref(null);
 const showExportModal = ref(false);
@@ -134,6 +141,12 @@ const options = {
   isCustomerPortal: isCustomerPortal.value,
   showSelectBanner: true,
   selectBannerActions,
+  emptyState: {
+    title: "No Tickets Found",
+    icon: h(TicketIcon, {
+      class: "h-10 w-10",
+    }),
+  },
 };
 
 function handle_response_by_field(row: any, item: string) {

helpdesk/helpdesk/doctype/hd_ticket/hd_ticket.json

@@ -94,7 +94,6 @@
    "fieldname": "status",
    "fieldtype": "Select",
    "in_list_view": 1,
-   "in_standard_filter": 1,
    "label": "Status",
    "no_copy": 1,
    "oldfieldname": "status",
@@ -409,7 +408,7 @@
  "icon": "fa fa-issue",
  "idx": 61,
  "links": [],
- "modified": "2025-01-30 18:07:29.036648",
+ "modified": "2025-02-06 14:52:46.410772",
  "modified_by": "Administrator",
  "module": "Helpdesk",
  "name": "HD Ticket",