From 025334f6385e83b0f1f0f4bf6c41474b63dab365 Mon Sep 17 00:00:00 2001
From: ChuckBuilds <Charlesmynard@gmail.com>
Date: Fri, 27 Mar 2026 15:16:34 -0400
Subject: [PATCH] fix: resolve font upload "baseUrl is not defined" error
 (#235)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The baseUrl variable was declared inside an IIFE that skips re-execution
on HTMX reloads, so it became undefined when the fonts tab was reloaded.
Since baseUrl was just window.location.origin prepended to absolute paths
like /api/v3/fonts/upload, it was unnecessary — fetch() with a leading
slash already resolves against the current origin.

Remove baseUrl entirely and use relative URLs in all 7 fetch calls.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../templates/v3/partials/fonts.html          | 19 ++++++++-----------
 1 file changed, 8 insertions(+), 11 deletions(-)

diff --git a/web_interface/templates/v3/partials/fonts.html b/web_interface/templates/v3/partials/fonts.html
index 7d13908a8..43084e02e 100644
--- a/web_interface/templates/v3/partials/fonts.html
+++ b/web_interface/templates/v3/partials/fonts.html
@@ -215,9 +215,6 @@ <h3 class="text-md font-medium text-gray-900 mb-4">Font Preview</h3>
     var fontOverrides = window.fontOverrides;
     var selectedFontFiles = window.selectedFontFiles;
 
-    // Base URL for API calls (shared scope)
-    var baseUrl = window.location.origin;
-
     // Retry counter for initialization
     var initRetryCount = 0;
     var MAX_INIT_RETRIES = 50; // 5 seconds max (50 * 100ms)
@@ -384,9 +381,9 @@ <h3 class="text-md font-medium text-gray-900 mb-4">Font Preview</h3>
     try {
         // Use absolute URLs to ensure they work when loaded via HTMX
         const [catalogRes, tokensRes, overridesRes] = await Promise.all([
-            fetch(`${baseUrl}/api/v3/fonts/catalog`),
-            fetch(`${baseUrl}/api/v3/fonts/tokens`),
-            fetch(`${baseUrl}/api/v3/fonts/overrides`)
+            fetch(`/api/v3/fonts/catalog`),
+            fetch(`/api/v3/fonts/tokens`),
+            fetch(`/api/v3/fonts/overrides`)
         ]);
 
         // Check if all responses are successful
@@ -558,7 +555,7 @@ <h3 class="text-md font-medium text-gray-900 mb-4">Font Preview</h3>
     }
 
     try {
-        const response = await fetch(`${baseUrl}/api/v3/fonts/${encodeURIComponent(fontFamily)}`, {
+        const response = await fetch(`/api/v3/fonts/${encodeURIComponent(fontFamily)}`, {
             method: 'DELETE'
         });
 
@@ -667,7 +664,7 @@ <h3 class="text-md font-medium text-gray-900 mb-4">Font Preview</h3>
             if (sizePx) overrideData.size_px = sizePx;
         }
 
-        const response = await fetch(`${baseUrl}/api/v3/fonts/overrides`, {
+        const response = await fetch(`/api/v3/fonts/overrides`, {
             method: 'POST',
             headers: { 'Content-Type': 'application/json' },
             body: JSON.stringify({
@@ -712,7 +709,7 @@ <h3 class="text-md font-medium text-gray-900 mb-4">Font Preview</h3>
     }
 
     try {
-        const response = await fetch(`${baseUrl}/api/v3/fonts/overrides/${elementKey}`, {
+        const response = await fetch(`/api/v3/fonts/overrides/${elementKey}`, {
             method: 'DELETE'
         });
 
@@ -860,7 +857,7 @@ <h3 class="text-md font-medium text-gray-900 mb-4">Font Preview</h3>
             fg: 'ffffff'
         });
 
-        const response = await fetch(`${baseUrl}/api/v3/fonts/preview?${params}`);
+        const response = await fetch(`/api/v3/fonts/preview?${params}`);
 
         if (!response.ok) {
             const text = await response.text();
@@ -990,7 +987,7 @@ <h3 class="text-md font-medium text-gray-900 mb-4">Font Preview</h3>
             formData.append('font_file', file);
             formData.append('font_family', i === 0 ? fontFamily : `${fontFamily}_${i + 1}`);
 
-            const response = await fetch(`${baseUrl}/api/v3/fonts/upload`, {
+            const response = await fetch(`/api/v3/fonts/upload`, {
                 method: 'POST',
                 body: formData
             });