add button to delete entire conversation

public/index.html

@@ -163,8 +163,21 @@
                         <div class="text-sm">@<{{ selectedPeer.destination_hash }}></div>
                     </div>
 
-                    <!-- close button -->
+                    <!-- delete button -->
                     <div class="ml-auto my-auto mr-2">
+                        <div @click="deleteConversation" href="javascript:void(0)" class="cursor-pointer">
+                            <div class="flex text-gray-700 bg-gray-100 hover:bg-gray-200 p-2 rounded-full">
+                                <div>
+                                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-5 h-5">
+                                        <path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
+                                    </svg>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- close button -->
+                    <div class="my-auto mr-2">
                         <div @click="selectedPeer = null" href="javascript:void(0)" class="cursor-pointer">
                             <div class="flex text-gray-700 bg-gray-100 hover:bg-gray-200 p-2 rounded-full">
                                 <div>
@@ -962,7 +975,31 @@
                     binary += String.fromCharCode(bytes[i]);
                 }
                 return window.btoa(binary);
-            }
+            },
+            async deleteConversation() {
+
+                // do nothing if no peer selected
+                if(!this.selectedPeer){
+                    return;
+                }
+
+                // ask user to confirm deleting conversation history
+                if(!confirm("Are you sure you want to delete all messages from this conversation? This can not be undone!")){
+                    return;
+                }
+
+                // delete all lxmf messages from "us to destination" and from "destination to us"
+                try {
+                    await window.axios.delete(`/api/v1/lxmf-messages/conversation/${this.selectedPeer.destination_hash}`);
+                } catch(e) {
+                    alert("failed to delete conversation");
+                    console.log(e);
+                }
+
+                // reload conversation
+                await this.loadLxmfMessages(this.selectedPeer.destination_hash);
+
+            },
         },
         computed: {
             isMobile() {

web.py

@@ -208,6 +208,32 @@ class ReticulumWebChat:
                 "message": "ok",
             })
 
+        # delete lxmf messages for conversation
+        @routes.delete("/api/v1/lxmf-messages/conversation/{destination_hash}")
+        async def index(request):
+
+            # get path params
+            destination_hash = request.match_info.get("destination_hash", None)
+
+            # get source hash from local lxmf destination
+            source_hash = self.local_lxmf_destination.hash.hex()
+
+            # source_hash is required
+            if destination_hash is None:
+                return web.json_response({
+                    "message": "destination_hash is required",
+                }, status=422)
+
+            # delete lxmf messages from db where "source to destination" or "destination to source"
+            (database.LxmfMessage.delete()
+             .where((database.LxmfMessage.source_hash == source_hash) & (database.LxmfMessage.destination_hash == destination_hash))
+             .orwhere((database.LxmfMessage.destination_hash == source_hash) & (database.LxmfMessage.source_hash == destination_hash))
+             .execute())
+
+            return web.json_response({
+                "message": "ok",
+            })
+
         asyncio.get_event_loop().add_signal_handler(signal.SIGINT, lambda: exit(-1))
         asyncio.get_event_loop().add_signal_handler(signal.SIGTERM, lambda: exit(-1))