From 4b254c16860183b0b190b9012e08b3d877f21128 Mon Sep 17 00:00:00 2001
From: Lera24 <bedulinavalera21@gmail.com>
Date: Mon, 25 Mar 2024 13:40:34 +0200
Subject: [PATCH] feature: add deletion messagings[WTEL-3529]

---
 .../modules/messaging/api/MessagingAPI.js     | 13 ++++++++
 .../messaging/components/the-messaging.vue    | 32 +++++++++++++++++++
 2 files changed, 45 insertions(+)

diff --git a/src/modules/contacts/modules/messaging/api/MessagingAPI.js b/src/modules/contacts/modules/messaging/api/MessagingAPI.js
index b0894785..733860f6 100644
--- a/src/modules/contacts/modules/messaging/api/MessagingAPI.js
+++ b/src/modules/contacts/modules/messaging/api/MessagingAPI.js
@@ -49,6 +49,19 @@ const getList = async (params) => {
   }
 };
 
+const deleteItem = async ({ id, parentId }) => {
+  try {
+    const response = await service.deleteIMClient(parentId, id);
+    return applyTransform(response.data, [
+    ]);
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
 export default {
   getList,
+  delete: deleteItem,
 };
diff --git a/src/modules/contacts/modules/messaging/components/the-messaging.vue b/src/modules/contacts/modules/messaging/components/the-messaging.vue
index f1bad0fc..d826022e 100644
--- a/src/modules/contacts/modules/messaging/components/the-messaging.vue
+++ b/src/modules/contacts/modules/messaging/components/the-messaging.vue
@@ -1,6 +1,13 @@
 <template>
   <div class="contact-communication-tab">
 
+    <delete-confirmation-popup
+      v-if="isConfirmationPopup"
+      :callback="deleteCallback"
+      :delete-count="deleteCount"
+      @close="closeDelete"
+    />
+
     <wt-loader v-show="isLoading" />
 
     <wt-dummy
@@ -31,6 +38,16 @@
         <template #app="{ item }">
           {{ item.app.name }}
         </template>
+        <template #actions="{ item }">
+          <wt-icon-action
+            :disabled="!access.hasRbacEditAccess"
+            action="delete"
+            @click="askDeleteConfirmation({
+              deleted: item,
+              callback: () => deleteData(item),
+            })"
+          />
+        </template>
       </wt-table>
     </div>
   </div>
@@ -42,6 +59,11 @@ import { useI18n } from 'vue-i18n';
 import { useStore } from 'vuex';
 import { useTableFilters } from '@webitel/ui-sdk/src/modules/Filters/composables/useTableFilters';
 import { useTableStore } from '@webitel/ui-sdk/src/modules/TableStoreModule/composables/useTableStore';
+import DeleteConfirmationPopup
+  from '@webitel/ui-sdk/src/modules/DeleteConfirmationPopup/components/delete-confirmation-popup.vue';
+import {
+  useDeleteConfirmationPopup
+} from '@webitel/ui-sdk/src/modules/DeleteConfirmationPopup/composables/useDeleteConfirmationPopup';
 import ChatGatewayProvider
   from '@webitel/ui-sdk/src/enums/ChatGatewayProvider/ChatGatewayProvider.enum';
 import dummyLight from '../assets/messaging-dummy-light.svg';
@@ -67,11 +89,21 @@ const {
   headers,
   error,
 
+  deleteData,
   sort,
 } = useTableStore(props.namespace);
 
 const { filtersNamespace } = useTableFilters(namespace);
 
+const {
+  isVisible: isConfirmationPopup,
+  deleteCount,
+  deleteCallback,
+
+  askDeleteConfirmation,
+  closeDelete,
+} = useDeleteConfirmationPopup();
+
 const showDummy = computed(() => !dataList.value.length);
 const darkMode = computed(() => store.getters['appearance/DARK_MODE']);