Merge pull request #2088 from frappe/develop

chore(release): dev to main

README.md

@@ -3,7 +3,7 @@
 <img src=".github/hd-logo.svg" alt="Frappe Helpdesk logo" width="100"/>
 <h1>Frappe Helpdesk</h1>
 
-**Open Source Business Intelligence Tool**
+**Customer Service, Made Simple and Effective**
 
 ![GitHub release (latest by date)](https://img.shields.io/github/v/release/frappe/helpdesk)
 [![codecov](https://codecov.io/github/frappe/helpdesk/branch/develop/graph/badge.svg?token=8ZXHCY4G9U)](https://codecov.io/github/frappe/helpdesk)
@@ -27,7 +27,7 @@ Frappe Helpdesk is an 100% open-source Ticket Management tool which helps you  s
 
 
 ## Motivation
-Managing issues from our customers was a big challenge for us. We were using the ERPNext support module which was not very good in UI and the UX was also not good. We wanted to have a tool that can be easily integrated with our existing system and can be customized as per our needs. So we decided to build a Helpdesk tool that can be easily integrated with our existing system and can be customized as per our needs.
+Managing issues from our customers was a big challenge for us. We were using the ERPNext support module which was not very good in UI and the UX was also not good. We wanted to have a tool that can be easily integrated with our existing system and can be customized as per our needs. So we decided to build Frappe Helpdesk.
 
 ## Key Features
 
@@ -45,15 +45,6 @@ Managing issues from our customers was a big challenge for us. We were using the
 
 
 
-<details>
-<summary>Screenshots</summary>
-
-![Helpdesk SS1](.github/query-builder.png)
-![Helpdesk SS1](.github/join-editor.png)
-![Helpdesk SS1](.github/chart-builder.png)
-</details>
-
-
 ## Under the Hood
 
 - [**Frappe Framework**](https://github.com/frappe/frappe): A full-stack web application framework written in Python and Javascript. The framework provides a robust foundation for building web applications, including a database abstraction layer, user authentication, and a REST API.
@@ -148,9 +139,9 @@ To setup the repository locally follow the steps mentioned below:
 - [Telegram Public Group](https://t.me/frappedesk)
 - [Discuss Forum](https://discuss.frappe.io/c/frappehelpdesk/69)
 - [Documentation](https://docs.frappe.io/helpdesk)
-- [YouTube]([https://frappe.io](https://www.youtube.com/@frappetech))
 
 <h2></h2>
+<br>
 <div align="center" style="padding-top: 0.75rem;">
 	<a href="https://frappe.io" target="_blank">
 		<picture>

desk/src/App.vue

@@ -1,5 +1,5 @@
 <template>
-  <RouterView class="antialiased" />
+  <RouterView class="antialiased" :key="$route.fullPath" />
   <Toasts />
   <KeymapDialog />
   <Dialogs />
@@ -11,7 +11,7 @@ import { Toasts } from "frappe-ui";
 import { createToast } from "@/utils";
 import { useConfigStore } from "@/stores/config";
 import KeymapDialog from "@/pages/KeymapDialog.vue";
-import { init as initTelemetry, stopSession } from "@/telemetry";
+import { stopSession } from "@/telemetry";
 import { Dialogs } from "frappe-ui";
 useConfigStore();
 

desk/src/components/EmptyState.vue

@@ -0,0 +1,33 @@
+<template>
+  <div class="flex h-full items-center justify-center">
+    <div
+      class="flex flex-col items-center gap-3 text-xl font-medium text-ink-gray-4"
+    >
+      <!-- Icon -->
+      <component v-if="icon" :is="icon" class="h-10 w-10" />
+      <!-- title -->
+      <span>{{ title }}</span>
+      <!-- Button which emits Empty State Action -->
+      <Button label="Create" @click="emit('emptyStateAction')" variant="subtle">
+        <template #prefix><FeatherIcon name="plus" class="h-4" /></template>
+      </Button>
+    </div>
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  title: {
+    type: String,
+    default: "No Data Found",
+  },
+  icon: {
+    type: String || HTMLElement,
+    default: "",
+  },
+});
+
+const emit = defineEmits(["emptyStateAction"]);
+</script>
+
+<style lang="scss" scoped></style>

desk/src/components/ListViewBuilder.vue

@@ -91,20 +91,11 @@
     />
   </div>
   <!-- Empty State -->
-  <div v-else class="flex h-full items-center justify-center">
-    <div
-      class="flex flex-col items-center gap-3 text-xl font-medium text-ink-gray-4"
-    >
-      <!-- Icon -->
-      <component :is="emptyState.icon" class="h-10 w-10" />
-      <!-- title -->
-      <span>{{ emptyState.title || "No Data Found" }}</span>
-      <!-- Button which emits Empty State Action -->
-      <Button label="Create" @click="emit('emptyStateAction')" variant="subtle">
-        <template #prefix><FeatherIcon name="plus" class="h-4" /></template>
-      </Button>
-    </div>
-  </div>
+  <EmptyState
+    v-else
+    :title="emptyState.title"
+    @emptyStateAction="emit('emptyStateAction')"
+  />
 </template>
 
 <script setup lang="ts">
@@ -124,6 +115,7 @@ import { dayjs } from "@/dayjs";
 import FadedScrollableDiv from "./FadedScrollableDiv.vue";
 import Reload from "./view-controls/Reload.vue";
 import { useScreenSize } from "@/composables/screen";
+import EmptyState from "./EmptyState.vue";
 
 interface P {
   options: {

desk/src/components/desk/global/AddNewAgentsDialog.vue

@@ -66,7 +66,7 @@
         <Button appearance="secondary" class="mr-2" @click="close()"
           >Cancel</Button
         >
-        <div class="grow">
+        <div class="grow mt-2">
           <Button
             @click="removeAllEmailFromQueue()"
             v-if="inviteQueue.length > 1"

desk/src/components/layouts/Sidebar.vue

@@ -138,6 +138,7 @@ const agentPortalDropdown = computed(() => [
     label: "Settings",
     icon: "settings",
     onClick: () => (showSettingsModal.value = true),
+    condition: () => authStore.isAdmin,
   },
   {
     label: "Log out",

desk/src/components/ticket/TicketCustomerSidebar.vue

@@ -35,7 +35,7 @@
         v-for="field in ticketBasicInfo"
       >
         <span class="w-[126px] text-sm text-gray-600">{{ field.label }}</span>
-        <span class="text-base text-gray-800">
+        <span class="text-base text-gray-800 flex-1">
           {{ field.value }}
         </span>
       </div>
@@ -67,7 +67,7 @@
         v-for="field in ticketAdditionalInfo"
       >
         <span class="w-[126px] text-sm text-gray-600">{{ field.label }}</span>
-        <span class="text-base text-gray-800">
+        <span class="text-base text-gray-800 flex-1">
           {{ field.value }}
         </span>
       </div>

desk/src/components/ticket/TicketsListView.vue

@@ -71,7 +71,7 @@
               {{ dayjs.tz(item).fromNow() }}
             </Tooltip>
           </div>
-          <div v-else-if="column.key === 'agent_group'">
+          <div v-else-if="column.key === 'agent_group'" class="truncate">
             {{ item || "-" }}
           </div>
           <div v-else-if="column.key === 'resolution_by'">

desk/src/pages/CannedResponses.vue

@@ -25,7 +25,7 @@
     </LayoutHeader>
     <div class="flex-1 overflow-y-auto p-2">
       <div
-        v-if="!cannedResponses.loading"
+        v-if="cannedResponses.data?.length > 0"
         class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-4 px-5 pb-3"
       >
         <div
@@ -79,6 +79,11 @@
           </div>
         </div>
       </div>
+      <EmptyState
+        v-else
+        title="No Canned Responses Found"
+        @emptyStateAction="showNewDialog = true"
+      />
     </div>
     <CannedResponseModal
       v-model="showNewDialog"
@@ -122,6 +127,7 @@ import { LayoutHeader } from "@/components";
 import { useUserStore } from "@/stores/user";
 import { dateFormat, dateTooltipFormat } from "@/utils";
 import { dayjs } from "@/dayjs";
+import EmptyState from "../components/EmptyState.vue";
 
 const { getUser } = useUserStore();
 

desk/src/pages/KnowledgeBaseArticle.vue

@@ -347,6 +347,10 @@ const insertRes = createResource({
       params: {
         articleId: data.name,
       },
+      query: {
+        category: categoryId.value,
+        subCategory: subCategoryId.value,
+      },
     });
   },
   onError: useError({ title: "Error creating article" }),

desk/src/pages/desk/AgentRoot.vue

@@ -9,7 +9,7 @@ import { computed, defineAsyncComponent, onBeforeMount } from "vue";
 import { useRouter } from "vue-router";
 import { useAuthStore } from "@/stores/auth";
 import { useConfigStore } from "@/stores/config";
-import { CUSTOMER_PORTAL_LANDING, ONBOARDING_PAGE } from "@/router";
+import { CUSTOMER_PORTAL_LANDING } from "@/router";
 
 import { useScreenSize } from "@/composables/screen";
 const router = useRouter();
@@ -37,9 +37,5 @@ onBeforeMount(() => {
   if (!authStore.hasDeskAccess) {
     router.replace({ name: CUSTOMER_PORTAL_LANDING });
   }
-
-  if (!configStore.isSetupComplete) {
-    router.replace({ name: ONBOARDING_PAGE });
-  }
 });
 </script>