From b225ad7e458f6cef8fc2b21538b3c2844bdb44d0 Mon Sep 17 00:00:00 2001
From: jude <jude@jellywx.com>
Date: Sun, 3 Sep 2023 16:00:49 +0100
Subject: [PATCH] Render log rows

---
 web/static/css/style.css                      | 24 ++++++++--
 web/static/js/reminder_errors.js              | 17 +++++--
 .../reminder_errors.html.tera                 | 48 +------------------
 .../templates/reminder_error.html.tera        | 26 +++++-----
 4 files changed, 50 insertions(+), 65 deletions(-)

diff --git a/web/static/css/style.css b/web/static/css/style.css
index e254b9c..90cd5bf 100644
--- a/web/static/css/style.css
+++ b/web/static/css/style.css
@@ -706,16 +706,32 @@ div.reminderError .errorIcon {
     margin-right: 12px;
 }
 
-div.reminderError .errorIcon.deleted {
+div.reminderError .errorIcon .fas {
+    display: none
+}
+
+div.reminderError[data-case="deleted"] .errorIcon {
     background-color: #e7e5e4;
 }
 
-div.reminderError .errorIcon.success {
+div.reminderError[data-case="failed"] .errorIcon {
+    background-color: #fecaca;
+}
+
+div.reminderError[data-case="sent"] .errorIcon {
     background-color: #d9f99d;
 }
 
-div.reminderError .errorIcon.errored {
-    background-color: #fecaca;
+div.reminderError[data-case="deleted"] .errorIcon .fas.fa-trash {
+    display: block;
+}
+
+div.reminderError[data-case="failed"] .errorIcon .fas.fa-exclamation-triangle {
+    display: block;
+}
+
+div.reminderError[data-case="sent"] .errorIcon .fas.fa-check {
+    display: block;
 }
 
 div.reminderError .errorHead .reminderName {
diff --git a/web/static/js/reminder_errors.js b/web/static/js/reminder_errors.js
index 4affb99..373f1e4 100644
--- a/web/static/js/reminder_errors.js
+++ b/web/static/js/reminder_errors.js
@@ -1,6 +1,6 @@
 function loadErrors() {
     return fetch(
-        `/dashboard/api/guild/${guildId()}/reminders?status=deleted,sent,error`
+        `/dashboard/api/guild/${guildId()}/reminders?status=deleted,sent,failed`
     ).then((response) => response.json());
 }
 
@@ -9,9 +9,20 @@ document.addEventListener("paneLoad", (ev) => {
         return;
     }
 
-    // Load errors
+    document.querySelectorAll(".reminderError").forEach((el) => el.remove());
+
+    const template = document.getElementById("reminderError");
+    const container = document.getElementById("reminderLog");
+
     loadErrors().then((res) => {
-        console.log(res);
+        for (const reminder of res) {
+            const newRow = template.content.cloneNode(true);
+
+            newRow.querySelector(".reminderName").textContent = reminder.name;
+            newRow.querySelector(".reminderError").dataset["case"] = reminder.status;
+
+            container.appendChild(newRow);
+        }
     });
 
     $loader.classList.add("is-hidden");
diff --git a/web/templates/reminder_dashboard/reminder_errors.html.tera b/web/templates/reminder_dashboard/reminder_errors.html.tera
index a869b41..53c7105 100644
--- a/web/templates/reminder_dashboard/reminder_errors.html.tera
+++ b/web/templates/reminder_dashboard/reminder_errors.html.tera
@@ -1,51 +1,5 @@
-<div>
-    <div class="reminderError">
-        <div class="errorHead">
-            <div class="errorIcon deleted">
-                <span class="icon">
-                    <i class="fas fa-trash"></i>
-                </span>
-            </div>
-            <div class="reminderName">
-                Reminder
-            </div>
-            <div class="reminderTime">
+<div id="reminderLog">
 
-            </div>
-        </div>
-    </div>
-
-    <div class="reminderError">
-        <div class="errorHead">
-            <div class="errorIcon errored">
-                <span class="icon">
-                    <i class="fas fa-exclamation-triangle"></i>
-                </span>
-            </div>
-            <div class="reminderName">
-                Reminder
-            </div>
-            <div class="reminderTime">
-
-            </div>
-        </div>
-    </div>
-
-    <div class="reminderError">
-        <div class="errorHead">
-            <div class="errorIcon success">
-                <span class="icon">
-                    <i class="fas fa-check"></i>
-                </span>
-            </div>
-            <div class="reminderName">
-                Reminder
-            </div>
-            <div class="reminderTime">
-
-            </div>
-        </div>
-    </div>
 </div>
 
 <script src="/static/js/reminder_errors.js"></script>
diff --git a/web/templates/reminder_dashboard/templates/reminder_error.html.tera b/web/templates/reminder_dashboard/templates/reminder_error.html.tera
index 74ac5ee..8f57a86 100644
--- a/web/templates/reminder_dashboard/templates/reminder_error.html.tera
+++ b/web/templates/reminder_dashboard/templates/reminder_error.html.tera
@@ -1,13 +1,17 @@
-<div class="reminderError">
-    <div class="errorIcon">
-        <span>
-            <i class="fas fa-trash"></i>
-        </span>
-    </div>
-    <div>
-        <span class="reminderName"></span>
-    </div>
-    <div>
-        <span></span>
+<div class="reminderError" data-case="success">
+    <div class="errorHead">
+        <div class="errorIcon">
+            <span class="icon">
+                <i class="fas fa-trash"></i>
+                <i class="fas fa-check"></i>
+                <i class="fas fa-exclamation-triangle"></i>
+            </span>
+        </div>
+        <div class="reminderName">
+            Reminder
+        </div>
+        <div class="reminderTime">
+
+        </div>
     </div>
 </div>