From f04c21004ac5c1e6c3a5e79b9ef14a97adadd2b1 Mon Sep 17 00:00:00 2001
From: thePR0M3TH3AN <53631862+PR0M3TH3AN@users.noreply.github.com>
Date: Mon, 6 Oct 2025 16:27:13 -0400
Subject: [PATCH] Bust cached sidebar assets

---
 AGENTS.md                                     |  1 +
 .../iframe_forms/iframe-application-form.html |  2 +-
 .../iframe_forms/iframe-bug-fix-form.html     |  2 +-
 .../iframe-content-appeals-form.html          |  2 +-
 .../iframe_forms/iframe-feedback-form.html    |  2 +-
 .../iframe_forms/iframe-request-form.html     |  2 +-
 config/asset-version.js                       |  1 +
 index.html                                    | 33 +++++++++--------
 js/index.js                                   | 36 +++++++++++--------
 9 files changed, 47 insertions(+), 34 deletions(-)
 create mode 100644 config/asset-version.js

diff --git a/AGENTS.md b/AGENTS.md
index 67df8071..92e24e2c 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -70,6 +70,7 @@ Document the run in PR descriptions so QA can cross-reference results.
 * **Probing:** Lightweight `HEAD`/`GET` requests should back `probeUrl()` so dead URLs can be hidden or flagged without blocking the UI.
 * **Extensibility:** Future work (live streams, NIP-96 uploads, analytics) should preserve the URL-first strategy and magnet safety rules above.
 * **Sidebar layering:** Keep the fixed sidebar below every modal and overlay. Respect the `--z-sidebar*` tokens so dialogs always render on top of the navigation.
+* **Static asset cache busting:** The CDN aggressively caches `components/sidebar.html` and CSS/JS bundles. Update `config/asset-version.js` and keep the `?v=` query strings in `index.html` (and iframe form shells) in sync whenever you change sidebar markup, scripts, or styles. The fetch helpers in `js/index.js` already append `cache: "no-store"`; reuse them for new partials so desktop collapses ship immediately without waiting on manual cache clears.
 
 ---
 
diff --git a/components/iframe_forms/iframe-application-form.html b/components/iframe_forms/iframe-application-form.html
index cfe91fa9..0e966844 100644
--- a/components/iframe_forms/iframe-application-form.html
+++ b/components/iframe_forms/iframe-application-form.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <title>bitvid Whitelist Application Form</title>
     <!-- Link to your main stylesheet -->
-    <link rel="stylesheet" href="../../css/style.css" />
+    <link rel="stylesheet" href="../../css/style.css?v=2024.10.11" />
     <style>
       /* Override for form page to match modal field styling */
 
diff --git a/components/iframe_forms/iframe-bug-fix-form.html b/components/iframe_forms/iframe-bug-fix-form.html
index 017d7b84..a34fcaec 100644
--- a/components/iframe_forms/iframe-bug-fix-form.html
+++ b/components/iframe_forms/iframe-bug-fix-form.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <title>bitvid Bug Report Form</title>
     <!-- Link to your main stylesheet -->
-    <link rel="stylesheet" href="../../css/style.css" />
+    <link rel="stylesheet" href="../../css/style.css?v=2024.10.11" />
     <style>
       /* Override for form page to match modal field styling */
 
diff --git a/components/iframe_forms/iframe-content-appeals-form.html b/components/iframe_forms/iframe-content-appeals-form.html
index c7f94194..f3e1eea9 100644
--- a/components/iframe_forms/iframe-content-appeals-form.html
+++ b/components/iframe_forms/iframe-content-appeals-form.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <title>bitvid Content Appeals Form</title>
     <!-- Link to your main stylesheet -->
-    <link rel="stylesheet" href="../../css/style.css" />
+    <link rel="stylesheet" href="../../css/style.css?v=2024.10.11" />
     <style>
       /* Override for form page to match modal field styling */
 
diff --git a/components/iframe_forms/iframe-feedback-form.html b/components/iframe_forms/iframe-feedback-form.html
index 8bc564c9..8503fb23 100644
--- a/components/iframe_forms/iframe-feedback-form.html
+++ b/components/iframe_forms/iframe-feedback-form.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <title>bitvid General Feedback Form</title>
     <!-- Link to your main stylesheet -->
-    <link rel="stylesheet" href="../../css/style.css" />
+    <link rel="stylesheet" href="../../css/style.css?v=2024.10.11" />
     <style>
       /* Override for form page to match modal field styling */
 
diff --git a/components/iframe_forms/iframe-request-form.html b/components/iframe_forms/iframe-request-form.html
index 23ce8ff4..18902d20 100644
--- a/components/iframe_forms/iframe-request-form.html
+++ b/components/iframe_forms/iframe-request-form.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <title>bitvid Feature Request Form</title>
     <!-- Link to your main stylesheet -->
-    <link rel="stylesheet" href="../../css/style.css" />
+    <link rel="stylesheet" href="../../css/style.css?v=2024.10.11" />
     <style>
       /* Override for form page to match modal field styling */
 
diff --git a/config/asset-version.js b/config/asset-version.js
new file mode 100644
index 00000000..e9303f13
--- /dev/null
+++ b/config/asset-version.js
@@ -0,0 +1 @@
+export const ASSET_VERSION = "2024.10.11";
diff --git a/index.html b/index.html
index 0b1e633c..4ec73677 100644
--- a/index.html
+++ b/index.html
@@ -45,10 +45,15 @@
     <meta name="theme-color" content="#0f172a" />
 
     <!-- Styles -->
-    <script src="js/tracking.js" defer></script>
-    <link href="css/tailwind.generated.css" rel="stylesheet" />
-    <link href="css/style.css" rel="stylesheet" />
-    <link href="css/markdown.css" rel="stylesheet" />
+    <!--
+      Cache busting: keep these query strings in sync with config/asset-version.js
+      so browsers pick up the latest sidebar markup and styling without
+      hard-refreshing around CDN caches.
+    -->
+    <script src="js/tracking.js?v=2024.10.11" defer></script>
+    <link href="css/tailwind.generated.css?v=2024.10.11" rel="stylesheet" />
+    <link href="css/style.css?v=2024.10.11" rel="stylesheet" />
+    <link href="css/markdown.css?v=2024.10.11" rel="stylesheet" />
   </head>
   <body>
     <!--
@@ -206,16 +211,16 @@
 
     <!-- Additional Scripts -->
     <!-- Bootstraps nostr-tools before other modules rely on nostrToolsReady -->
-    <script type="module" src="js/nostrToolsBootstrap.js"></script>
-    <script type="module" src="js/config.js"></script>
-    <script type="module" src="js/lists.js"></script>
-    <script type="module" src="js/accessControl.js"></script>
-    <script type="module" src="js/webtorrent.js"></script>
-    <script type="module" src="js/nostr.js"></script>
-    <script type="module" src="js/viewManager.js"></script>
-    <script type="module" src="js/bootstrap.js"></script>
-    <script type="module" src="js/disclaimer.js"></script>
-    <script type="module" src="js/index.js"></script>
+      <script type="module" src="js/nostrToolsBootstrap.js?v=2024.10.11"></script>
+      <script type="module" src="js/config.js?v=2024.10.11"></script>
+      <script type="module" src="js/lists.js?v=2024.10.11"></script>
+      <script type="module" src="js/accessControl.js?v=2024.10.11"></script>
+      <script type="module" src="js/webtorrent.js?v=2024.10.11"></script>
+      <script type="module" src="js/nostr.js?v=2024.10.11"></script>
+    <script type="module" src="js/viewManager.js?v=2024.10.11"></script>
+    <script type="module" src="js/bootstrap.js?v=2024.10.11"></script>
+    <script type="module" src="js/disclaimer.js?v=2024.10.11"></script>
+    <script type="module" src="js/index.js?v=2024.10.11"></script>
     <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
   </body>
diff --git a/js/index.js b/js/index.js
index bcb9ab2e..1c1a7e92 100644
--- a/js/index.js
+++ b/js/index.js
@@ -1,6 +1,7 @@
 // js/index.js
 
 import { validateInstanceConfig } from "../config/validate-config.js";
+import { ASSET_VERSION } from "../config/asset-version.js";
 import "./bufferPolyfill.js";
 import Application from "./app.js";
 import { setApplication, setApplicationReady } from "./applicationContext.js";
@@ -102,13 +103,26 @@ document.addEventListener("animationend", handleFadeInAnimationComplete, true);
 document.addEventListener("animationcancel", handleFadeInAnimationComplete, true);
 
 // 1) Load modals (login, application, etc.)
+const withAssetVersion = (url) => {
+  if (typeof url !== "string" || url.length === 0) {
+    return url;
+  }
+
+  const separator = url.includes("?") ? "&" : "?";
+  return `${url}${separator}v=${encodeURIComponent(ASSET_VERSION)}`;
+};
+
+const fetchPartial = async (url) => {
+  const response = await fetch(withAssetVersion(url), { cache: "no-store" });
+  if (!response.ok) {
+    throw new Error("Failed to load " + url);
+  }
+  return response.text();
+};
+
 async function loadModal(url) {
   try {
-    const response = await fetch(url);
-    if (!response.ok) {
-      throw new Error("Failed to load " + url);
-    }
-    const html = await response.text();
+    const html = await fetchPartial(url);
     // Remove analytics loader tags from modal partials to avoid duplicate pageview events.
     const sanitizedHtml = html.replace(
       /<script\b[^>]*src=["'][^"']*tracking\.js[^"']*["'][^>]*>\s*<\/script>/gi,
@@ -126,11 +140,7 @@ async function loadModal(url) {
 // 2) Load sidebar
 async function loadSidebar(url, containerId) {
   try {
-    const response = await fetch(url);
-    if (!response.ok) {
-      throw new Error("Failed to load " + url);
-    }
-    const html = await response.text();
+    const html = await fetchPartial(url);
     document.getElementById(containerId).innerHTML = html;
     console.log(url, "loaded into", containerId);
   } catch (err) {
@@ -141,11 +151,7 @@ async function loadSidebar(url, containerId) {
 // 3) Load the disclaimer (now separate)
 async function loadDisclaimer(url, containerId) {
   try {
-    const response = await fetch(url);
-    if (!response.ok) {
-      throw new Error("Failed to load " + url);
-    }
-    const html = await response.text();
+    const html = await fetchPartial(url);
     document.getElementById(containerId).insertAdjacentHTML("beforeend", html);
     console.log(url, "disclaimer loaded into", containerId);
   } catch (err) {