feat: add labels

app/javascript/dashboard/components/widgets/conversation/conversationCardComponents/CardLabels.vue

@@ -45,6 +45,11 @@ export default {
       type: Number,
       required: true,
     },
+    conversationLabels: {
+      type: String,
+      required: false,
+      default: '',
+    },
   },
   data() {
     return {

app/javascript/dashboard/mixins/conversation/labelMixin.js

@@ -4,6 +4,10 @@ export default {
   computed: {
     ...mapGetters({ accountLabels: 'labels/getLabels' }),
     savedLabels() {
+      // If conversationLabels is passed as prop, use it
+      if (this.conversationLabels)
+        return this.conversationLabels.split(',').map(item => item.trim());
+      // Otherwise, get labels from store
       return this.$store.getters['conversationLabels/getConversationLabels'](
         this.conversationId
       );

app/javascript/dashboard/routes/dashboard/settings/reports/SLAReports.vue

@@ -8,7 +8,6 @@
       :sla-reports="slaReports"
       :current-page="Number(slaMeta.currentPage)"
       :total-count="Number(slaMeta.count)"
-      :page-size="3"
       @page-change="onPageChange"
     />
   </div>

app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAReportItem.vue

@@ -9,6 +9,10 @@ defineProps({
     type: Number,
     required: true,
   },
+  conversation: {
+    type: Object,
+    required: true,
+  },
 });
 </script>
 
@@ -24,8 +28,11 @@ defineProps({
     <div
       class="flex items-center col-span-6 px-0 py-2 text-sm tracking-[0.5] text-slate-700 dark:text-slate-100 rtl:text-right"
     >
-      #{{ conversationId }} with John Doe
-      <card-labels :conversation-id="148" />
+      #{{ conversationId }} with {{ conversation.contact.name }}
+      <card-labels
+        :conversation-id="conversationId"
+        :conversation-labels="conversation.labels"
+      />
     </div>
     <div
       class="flex items-center col-span-2 px-0 py-2 text-sm tracking-[0.5] text-slate-700 dark:text-slate-100 rtl:text-right"

app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLATable.vue

@@ -30,7 +30,8 @@
         v-for="sla in slaReports"
         :key="sla.id"
         :sla-name="sla.sla_policy.name"
-        :conversation-id="sla.conversation.id"
+        :conversation="sla.conversation"
+        :conversation-id="sla.conversation_id"
       />
     </div>
     <table-footer