From 469d49559cbac75be380518af922548160c1a186 Mon Sep 17 00:00:00 2001
From: stefan <stefan.mo.co@gmail.com>
Date: Sat, 14 Mar 2026 19:40:28 +0100
Subject: [PATCH] Switch runtime config handling to JSON-based Caddy templates
 in frontend.

---
 .../src/jsMain/resources/index.html           | 29 ++++++++++++++-----
 1 file changed, 21 insertions(+), 8 deletions(-)

diff --git a/frontend/shells/meldestelle-portal/src/jsMain/resources/index.html b/frontend/shells/meldestelle-portal/src/jsMain/resources/index.html
index 92156e46..86bbe375 100644
--- a/frontend/shells/meldestelle-portal/src/jsMain/resources/index.html
+++ b/frontend/shells/meldestelle-portal/src/jsMain/resources/index.html
@@ -12,16 +12,28 @@
 <div id="ComposeTarget">
   <div class="loading">Loading...</div>
 </div>
-  <script>
-  // Laufzeit-Konfiguration — kein Rebuild nötig (SSoT: .env via Caddy-Templates oder query params)
-  // Caddy verarbeitet index.html als text/html-Template (Standard) und ersetzt .Env-Variablen.
-  // Lokal (webpack-dev-server): Template-Tags bleiben Literal-Strings → startsWith('{{') Prüfung greift.
+
+<!--
+  Schritt 1: Caddy füllt dieses JSON-Template aus.
+  Der Inhalt ist reines JSON, was Syntaxkonflikte mit JS vermeidet.
+-->
+<script id="app-config" type="application/json">
+  {
+    "apiBaseUrl": "{{.Env.API_BASE_URL}}",
+    "keycloakUrl": "{{.Env.KEYCLOAK_URL}}"
+  }
+</script>
+
+<script>
+  // Schritt 2: Das Haupt-Skript liest die Konfiguration aus dem JSON-Block.
   (function () {
     try {
+      const configElement = document.getElementById('app-config');
+      const configJson = configElement.textContent || '{}';
+      const config = JSON.parse(configJson);
       const params = new URLSearchParams(window.location.search);
 
-      // Caddy injiziert: {{.Env.API_BASE_URL}} → z.B. "https://app.mo-code.at"
-      const apiFromCaddy = `{{.Env.API_BASE_URL}}`;
+      const apiFromCaddy = config.apiBaseUrl;
       const apiOverride  = params.get('apiBaseUrl');
       globalThis.API_BASE_URL = apiOverride
         ? apiOverride.replace(/\/$/, '')
@@ -29,8 +41,7 @@
             ? apiFromCaddy.replace(/\/$/, '')
             : 'http://' + window.location.origin.replace(/\/$/, ''));
 
-      // Caddy injiziert: {{.Env.KEYCLOAK_URL}} → z.B. "https://auth.mo-code.at"
-      const kcFromCaddy = `{{.Env.KEYCLOAK_URL}}`;
+      const kcFromCaddy = config.keycloakUrl;
       const kcOverride  = params.get('keycloakUrl');
       globalThis.KEYCLOAK_URL = kcOverride
         ? kcOverride.replace(/\/$/, '')
@@ -39,12 +50,14 @@
             : 'http://' + window.location.hostname + ':8180');
 
     } catch (e) {
+      console.error('Error loading runtime configuration:', e);
       globalThis.API_BASE_URL = 'http://localhost:8081';
       globalThis.KEYCLOAK_URL = 'http://localhost:8180';
     }
   })();
   // KMP bundle liest globalThis.API_BASE_URL und globalThis.KEYCLOAK_URL in PlatformConfig.js
 </script>
+
 <script src="web-app.js"></script>
 <script>
   // Register Service Worker only in non-localhost environments