From b2ceb197f2860815d56604afdcffd96172d9feed Mon Sep 17 00:00:00 2001
From: thePR0M3TH3AN <53631862+PR0M3TH3AN@users.noreply.github.com>
Date: Wed, 1 Oct 2025 14:25:37 -0400
Subject: [PATCH] Fix sidebar loading spinners for videos and history

---
 components/profile-modal.html | 29 ++++++++++++++++++-----------
 js/app.js                     |  8 +++++---
 2 files changed, 23 insertions(+), 14 deletions(-)

diff --git a/components/profile-modal.html b/components/profile-modal.html
index 86b844ba..21d520cf 100644
--- a/components/profile-modal.html
+++ b/components/profile-modal.html
@@ -291,17 +291,24 @@
                 Your recently watched videos appear here so you can jump back into favorites.
               </p>
               <div class="space-y-4">
-                <div
-                  id="profileHistoryLoading"
-                  class="flex items-center justify-center gap-3 py-6"
-                >
-                  <div class="h-8 w-8 border-4 border-blue-500 border-t-transparent rounded-full animate-spin"></div>
-                  <p
-                    id="profileHistoryStatus"
-                    class="text-sm text-gray-300 hidden"
-                    aria-live="polite"
-                    role="status"
-                  ></p>
+                <div id="profileHistoryLoading" class="py-6">
+                  <div id="profileHistoryStatus">
+                    <div
+                      class="sidebar-loading-wrapper"
+                      role="status"
+                      aria-live="polite"
+                    >
+                      <div class="sidebar-loading-indicator">
+                        <span
+                          class="status-spinner status-spinner--inline"
+                          aria-hidden="true"
+                        ></span>
+                        <span class="sidebar-loading-text"
+                          >Fetching watch history from relays…</span
+                        >
+                      </div>
+                    </div>
+                  </div>
                 </div>
                 <div
                   id="profileHistoryEmpty"
diff --git a/js/app.js b/js/app.js
index 31b3e0f0..2143055e 100644
--- a/js/app.js
+++ b/js/app.js
@@ -7720,9 +7720,11 @@ class bitvidApp {
     }
 
     if (this.videoList) {
-      if (this._lastRenderedVideoListElement !== this.videoList) {
-        this.lastRenderedVideoSignature = null;
-      }
+      // Always reset the cached signature before showing the loading state so the
+      // next render isn't skipped when the incoming payload matches the last
+      // successful render. Without this, the spinner could remain visible for
+      // returning users who already have the latest list cached.
+      this.lastRenderedVideoSignature = null;
       this.videoList.innerHTML = getSidebarLoadingMarkup(
         "Fetching recent videos…"
       );