From 7bb230b59c290a09d6564b52e5af4d94c4a4116e Mon Sep 17 00:00:00 2001
From: "Rodrigo Rodriguez (Pragmatismo)" <me@rodrigorodriguez.com>
Date: Sat, 10 Jan 2026 14:19:22 -0300
Subject: [PATCH] fix(htmx): register auth header listener on document
 immediately

The listener was being registered on document.body inside initHTMX(),
but HTMX requests could start before body was ready.

Now register on document at script load time (immediately) to ensure
all HTMX requests get the Authorization header.
---
 ui/suite/js/htmx-app.js | 52 ++++++++++++++++++++++-------------------
 1 file changed, 28 insertions(+), 24 deletions(-)

diff --git a/ui/suite/js/htmx-app.js b/ui/suite/js/htmx-app.js
index e805fc2..dfe58d8 100644
--- a/ui/suite/js/htmx-app.js
+++ b/ui/suite/js/htmx-app.js
@@ -2,6 +2,34 @@
 (function () {
   "use strict";
 
+  // =========================================================================
+  // CRITICAL: Register auth header listener IMMEDIATELY on document
+  // This MUST run before any HTMX requests are made
+  // =========================================================================
+  document.addEventListener("htmx:configRequest", (event) => {
+    // Add Authorization header with access token
+    const accessToken =
+      localStorage.getItem("gb-access-token") ||
+      sessionStorage.getItem("gb-access-token");
+    if (accessToken) {
+      event.detail.headers["Authorization"] = `Bearer ${accessToken}`;
+    }
+
+    // Add CSRF token if available
+    const csrfToken = localStorage.getItem("csrf_token");
+    if (csrfToken) {
+      event.detail.headers["X-CSRF-Token"] = csrfToken;
+    }
+
+    // Add session ID if available
+    const sessionId =
+      localStorage.getItem("gb-session-id") ||
+      sessionStorage.getItem("gb-session-id");
+    if (sessionId) {
+      event.detail.headers["X-Session-ID"] = sessionId;
+    }
+  });
+
   // Configuration
   const config = {
     wsUrl: "/ws",
@@ -21,30 +49,6 @@
     htmx.config.defaultSettleDelay = 100;
     htmx.config.timeout = 10000;
 
-    // Add CSRF token and Authorization header to all requests
-    document.body.addEventListener("htmx:configRequest", (event) => {
-      const csrfToken = localStorage.getItem("csrf_token");
-      if (csrfToken) {
-        event.detail.headers["X-CSRF-Token"] = csrfToken;
-      }
-
-      // Add Authorization header with access token
-      const accessToken =
-        localStorage.getItem("gb-access-token") ||
-        sessionStorage.getItem("gb-access-token");
-      if (accessToken) {
-        event.detail.headers["Authorization"] = `Bearer ${accessToken}`;
-      }
-
-      // Add session ID if available
-      const sessionId =
-        localStorage.getItem("gb-session-id") ||
-        sessionStorage.getItem("gb-session-id");
-      if (sessionId) {
-        event.detail.headers["X-Session-ID"] = sessionId;
-      }
-    });
-
     // Handle errors globally
     document.body.addEventListener("htmx:responseError", (event) => {
       console.error("HTMX Error:", event.detail);