From 4e2c2e58a836dce92d47ac367b67ce11d518b253 Mon Sep 17 00:00:00 2001
From: N-Pex <npexdev@gmail.com>
Date: Mon, 8 Feb 2021 15:31:09 +0100
Subject: [PATCH] Add redation to three dot menu

Issues #51 and #52.
---
 src/components/Chat.vue                       | 11 +++++++++++
 src/components/messages/MessageOperations.vue | 14 ++++++++++++++
 2 files changed, 25 insertions(+)

diff --git a/src/components/Chat.vue b/src/components/Chat.vue
index 6035293..6c15f57 100644
--- a/src/components/Chat.vue
+++ b/src/components/Chat.vue
@@ -16,6 +16,7 @@
               v-on:addreaction="addReaction"
               v-on:addreply="addReply(selectedEvent)"
               v-on:edit="edit(selectedEvent)"
+              v-on:redact="redact(selectedEvent)"
               v-on:download="download(selectedEvent)"
               :event="selectedEvent"
               :incoming="selectedEvent.getSender() != $matrix.currentUserId"
@@ -823,6 +824,16 @@ export default {
       this.$refs.messageInput.focus();
     },
 
+    redact(event) {
+      this.$matrix.matrixClient.redactEvent(event.getRoomId(), event.getId())
+      .then(() => {
+        console.log("Message redacted");
+      })
+      .catch(err => {
+        console.log("Redaction failed: ", err);
+      })
+    },
+
     download(event) {
       util
         .getAttachment(this.$matrix.matrixClient, event)
diff --git a/src/components/messages/MessageOperations.vue b/src/components/messages/MessageOperations.vue
index d16477d..0727887 100644
--- a/src/components/messages/MessageOperations.vue
+++ b/src/components/messages/MessageOperations.vue
@@ -9,6 +9,9 @@
     <v-btn v-if="isEditable" icon @click.stop="edit" class="ma-0 pa-0">
       <v-icon>edit</v-icon>
     </v-btn>
+    <v-btn v-if="isRedactable" icon @click.stop="redact" class="ma-0 pa-0">
+      <v-icon>delete</v-icon>
+    </v-btn>
     <v-btn v-if="isDownloadable" icon @click.stop="download" class="ma-0 pa-0">
       <v-icon>get_app</v-icon>
     </v-btn>
@@ -43,6 +46,13 @@ export default {
     isDownloadable() {
       const msgtype = this.event.getContent().msgtype;
       return ['m.video','m.audio','m.image','m.file'].includes(msgtype);
+    },
+    isRedactable() {
+      const room = this.$matrix.matrixClient.getRoom(this.event.getRoomId());
+      if (room && room.currentState && room.currentState.maySendRedactionForEvent(this.event, this.$matrix.currentUserId)) {
+        return true;
+      }
+      return false;
     }
   },
 
@@ -59,6 +69,10 @@ export default {
       this.$emit("close");
       this.$emit("edit", {event:this.event});
     },
+    redact() {
+      this.$emit("close");
+      this.$emit("redact", {event:this.event});
+    },
     download() {
       this.$emit("close");
       this.$emit("download", {event:this.event});