implement manually retrying failed messages

README.md

@@ -4,7 +4,6 @@ A simple, mobile friendly, web based [MeshCore](https://github.com/ripplebiz/Mes
 
 ## TODO
 
-- auto retry sending failed messages up to x attempts
 - implement group chats
 
 ## License

src/components/messages/MessageViewer.vue

@@ -33,7 +33,10 @@
 
                                 <!-- state label -->
                                 <div class="my-auto">
-                                    <span v-if="isMessageFailed(message)">Failed: {{ message.error }}</span>
+                                    <span v-if="isMessageFailed(message)" class="flex space-x-1">
+                                        <span>Failed: {{ message.error }}</span>
+                                        <span @click="retrySendingMessage(message)" class="text-blue-500 underline cursor-pointer">Retry?</span>
+                                    </span>
                                     <span v-else-if="isMessageDelivered(message)">Delivered</span>
                                     <span v-else>Sending</span>
                                 </div>
@@ -132,7 +135,7 @@ export default {
         this.messagesSubscription?.unsubscribe();
     },
     methods: {
-        async sendMessage() {
+        async sendMessage(text) {
 
             // can't send if not connected
             if(!GlobalState.connection){
@@ -146,7 +149,7 @@ export default {
             }
 
             // do nothing if message is empty
-            const newMessageText = this.newMessageText;
+            const newMessageText = text ?? this.newMessageText;
             if(newMessageText == null || newMessageText === ""){
                 return;
             }
@@ -175,6 +178,20 @@ export default {
             // hide loading
             this.isSendingMessage = false;
 
+        },
+        async retrySendingMessage(message) {
+
+            // do nothing if already sending message
+            if(this.isSendingMessage){
+                return;
+            }
+
+            // delete original message
+            await Database.Message.deleteMessageById(message.id);
+
+            // resend message
+            await this.sendMessage(message.text);
+
         },
         isMessageInbound: (message) => MessageUtils.isMessageInbound(message),
         isMessageOutbound: (message) => MessageUtils.isMessageOutbound(message),

src/js/Database.js

@@ -114,14 +114,19 @@ class Message {
                     $eq: id,
                 },
             },
-            sort: [
-                {
-                    timestamp: "desc",
-                },
-            ],
         }).exec();
     }
 
+    static async deleteMessageById(id) {
+        return await database.messages.findOne({
+            selector: {
+                id: {
+                    $eq: id,
+                },
+            },
+        }).incrementalRemove();
+    }
+
     // mark a message as delivered by its ack code
     static async setMessageDeliveredByAckCode(ackCode) {