From e135a74a9b4956d9b8265d1e43b77d6de00ceb23 Mon Sep 17 00:00:00 2001
From: jude <jude@jellywx.com>
Date: Tue, 8 Aug 2023 17:44:40 +0100
Subject: [PATCH] Fix avatars not loading correctly

---
 web/static/js/main.js                         | 34 +++++++++----------
 .../guild_reminder.html.tera                  |  2 +-
 2 files changed, 17 insertions(+), 19 deletions(-)

diff --git a/web/static/js/main.js b/web/static/js/main.js
index 16091d5..720eb89 100644
--- a/web/static/js/main.js
+++ b/web/static/js/main.js
@@ -66,30 +66,26 @@ function update_select(sel) {
         return;
     }
 
-    let isCreating = sel.closest("div.reminderContent").classList.contains("creator");
+    const avatarInput = sel.closest("div.reminderContent").querySelector("img.avatar");
 
-    if (!isCreating) {
-        return;
-    }
-
-    const avatarInput = sel
-        .closest("div.reminderContent")
-        .querySelector("img.discord-avatar");
-
-    if (sel.selectedOptions[0].dataset["webhookAvatar"]) {
-        avatarInput.src = sel.selectedOptions[0].dataset["webhookAvatar"];
-    } else {
-        avatarInput.src = "/static/img/icon.png";
+    if (!avatarInput.dataset["set"]) {
+        if (sel.selectedOptions[0].dataset["webhookAvatar"]) {
+            avatarInput.src = sel.selectedOptions[0].dataset["webhookAvatar"];
+        } else {
+            avatarInput.src = "/static/img/icon.png";
+        }
     }
 
     const usernameInput = sel
         .closest("div.reminderContent")
         .querySelector("input.discord-username");
 
-    if (sel.selectedOptions[0].dataset["webhookName"]) {
-        usernameInput.value = sel.selectedOptions[0].dataset["webhookName"];
-    } else {
-        usernameInput.value = "Reminder";
+    if (usernameInput.value.length === 0) {
+        if (sel.selectedOptions[0].dataset["webhookName"]) {
+            usernameInput.value = sel.selectedOptions[0].dataset["webhookName"];
+        } else {
+            usernameInput.value = "Reminder";
+        }
     }
 }
 
@@ -342,7 +338,7 @@ async function serialize_reminder(node, mode) {
         restartable: false,
         attachment: attachment,
         attachment_name: attachment_name,
-        avatar: has_source(node.querySelector("img.discord-avatar").src),
+        avatar: has_source(node.querySelector("img.avatar").src),
         channel: node.querySelector("select.channel-selector").value,
         content: content,
         embed_author_url: embed_author_url,
@@ -387,7 +383,9 @@ function deserialize_reminder(reminder, frame, mode) {
                 if ($input !== null) {
                     $input.value = reminder[prop];
                 } else if ($image !== null) {
+                    console.log(`loading img ${prop}`);
                     $image.src = reminder[prop];
+                    $image.dataset["set"] = "1";
                 }
             }
         }
diff --git a/web/templates/reminder_dashboard/guild_reminder.html.tera b/web/templates/reminder_dashboard/guild_reminder.html.tera
index b5e9b35..739d270 100644
--- a/web/templates/reminder_dashboard/guild_reminder.html.tera
+++ b/web/templates/reminder_dashboard/guild_reminder.html.tera
@@ -25,7 +25,7 @@
                 <figure class="media-left">
                     <p class="image is-32x32 customizable">
                         <a>
-                            <img class="is-rounded discord-avatar" src="/static/img/bg.webp" alt="Image for discord avatar">
+                            <img class="is-rounded avatar" src="/static/img/bg.webp" alt="Image for discord avatar">
                         </a>
                     </p>
                 </figure>