From 9064dc64aa57ac0b218e1de5873b6fb99ccbad08 Mon Sep 17 00:00:00 2001
From: liamcottle <liam@liamcottle.com>
Date: Sun, 28 Jul 2024 15:36:37 +1200
Subject: [PATCH] add settings ui

---
 meshchat.py       | 10 ++++++++
 public/index.html | 60 +++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 70 insertions(+)

diff --git a/meshchat.py b/meshchat.py
index 1f5c8e9..e39be59 100644
--- a/meshchat.py
+++ b/meshchat.py
@@ -1136,6 +1136,14 @@ class ReticulumMeshChat:
                 else:
                     self.config.auto_announce_enabled.set(False)
 
+            if "auto_resend_failed_messages_when_announce_received" in config:
+                value = bool(config["auto_resend_failed_messages_when_announce_received"])
+                self.config.auto_resend_failed_messages_when_announce_received.set(value)
+
+            if "allow_auto_resending_failed_messages_with_attachments" in config:
+                value = bool(config["allow_auto_resending_failed_messages_with_attachments"])
+                self.config.allow_auto_resending_failed_messages_with_attachments.set(value)
+
             # send config to websocket clients
             await self.send_config_to_websocket_clients()
 
@@ -1280,6 +1288,8 @@ class ReticulumMeshChat:
             "auto_announce_enabled": self.config.auto_announce_enabled.get(),
             "auto_announce_interval_seconds": self.config.auto_announce_interval_seconds.get(),
             "last_announced_at": self.config.last_announced_at.get(),
+            "auto_resend_failed_messages_when_announce_received": self.config.auto_resend_failed_messages_when_announce_received.get(),
+            "allow_auto_resending_failed_messages_with_attachments": self.config.allow_auto_resending_failed_messages_with_attachments.get(),
         }
 
     # convert audio call to dict
diff --git a/public/index.html b/public/index.html
index c1ec99c..1515df7 100644
--- a/public/index.html
+++ b/public/index.html
@@ -127,6 +127,19 @@
                             </a>
                         </li>
 
+                        <!-- settings -->
+                        <li>
+                            <button @click="showSettingsTab" type="button" :class="[ tab === 'settings' ? 'bg-blue-100 text-blue-800 group:text-blue-800 hover:bg-blue-100' : '']" class="w-full text-gray-800 hover:bg-gray-100 group flex gap-x-3 rounded-r-full p-2 mr-2 text-sm leading-6 font-semibold focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600">
+                                <span class="my-auto">
+                                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
+                                        <path stroke-linecap="round" stroke-linejoin="round" d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z" />
+                                        <path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
+                                    </svg>
+                                </span>
+                                <span class="my-auto">Settings</span>
+                            </button>
+                        </li>
+
                         <!-- info -->
                         <li>
                             <button @click="showAboutTab" type="button" :class="[ tab === 'about' ? 'bg-blue-100 text-blue-800 group:text-blue-800 hover:bg-blue-100' : '']" class="w-full text-gray-800 hover:bg-gray-100 group flex gap-x-3 rounded-r-full p-2 mr-2 text-sm leading-6 font-semibold focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600">
@@ -1175,6 +1188,39 @@
 
             </div>
 
+            <!-- settings tab -->
+            <div v-if="tab === 'settings'" class="overflow-y-auto space-y-2 p-2">
+
+                <!-- messages -->
+                <div class="bg-white rounded shadow">
+                    <div class="flex border-b border-gray-300 text-gray-700 p-2 font-semibold">Messages</div>
+                    <div class="divide-y text-gray-900">
+
+                        <div class="p-2">
+                            <div class="flex items-start">
+                                <div class="flex items-center h-5">
+                                    <input v-model="config.auto_resend_failed_messages_when_announce_received" @change="onAutoResendFailedMessagesWhenAnnounceReceivedChange" type="checkbox" class="w-4 h-4 border border-gray-300 rounded bg-gray-50 focus:ring-3 focus:ring-blue-300">
+                                </div>
+                                <label class="ml-2 text-sm font-medium text-gray-900">Auto resend failed messages when announce received</label>
+                            </div>
+                            <div class="text-sm text-gray-700">When enabled, failed messages will auto resend when an announce is received from the intended destination.</div>
+                        </div>
+
+                        <div class="p-2">
+                            <div class="flex items-start">
+                                <div class="flex items-center h-5">
+                                    <input v-model="config.allow_auto_resending_failed_messages_with_attachments" @change="onAllowAutoResendingFailedMessagesWithAttachmentsChange" type="checkbox" class="w-4 h-4 border border-gray-300 rounded bg-gray-50 focus:ring-3 focus:ring-blue-300">
+                                </div>
+                                <label class="ml-2 text-sm font-medium text-gray-900">Allow resending failed messages with attachments</label>
+                            </div>
+                            <div class="text-sm text-gray-700">When enabled, failed messages that have attachments are allowed to auto resend.</div>
+                        </div>
+
+                    </div>
+                </div>
+
+            </div>
+
             <!-- about tab -->
             <div v-if="tab === 'about'" class="overflow-y-auto space-y-2 p-2">
 
@@ -1795,6 +1841,16 @@
                     "auto_announce_interval_seconds": this.config.auto_announce_interval_seconds,
                 });
             },
+            async onAutoResendFailedMessagesWhenAnnounceReceivedChange() {
+                await this.updateConfig({
+                    "auto_resend_failed_messages_when_announce_received": this.config.auto_resend_failed_messages_when_announce_received,
+                });
+            },
+            async onAllowAutoResendingFailedMessagesWithAttachmentsChange() {
+                await this.updateConfig({
+                    "allow_auto_resending_failed_messages_with_attachments": this.config.allow_auto_resending_failed_messages_with_attachments,
+                });
+            },
             async startNewLXMFConversation() {
 
                 // ask for destination address
@@ -2730,6 +2786,10 @@
                 await this.getConversations();
 
             },
+            showSettingsTab() {
+                this.tab = "settings";
+                this.getConfig();
+            },
             showAboutTab() {
                 this.tab = "about";
                 this.getAppInfo();