From e3b4e25429ac07fd698277fc6f6e7e6647f7e626 Mon Sep 17 00:00:00 2001
From: claude-dev <info@aegis-sight.de>
Date: Thu, 23 Jul 2026 20:55:46 +0000
Subject: [PATCH] =?UTF-8?q?fix(ui):=20Header=20w=C3=A4hrend=20der=20ersten?=
 =?UTF-8?q?=20Recherche=20bedienbar=20halten?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Das blockierende Fortschritts-Overlay (.progress-overlay.blocking) liegt
position:fixed über dem gesamten Viewport und schluckt damit auch die
Klicks auf den globalen Header. Beim ersten Durchlauf eines Falls waren so
Barrierefreiheit, Theme-Wechsel, Konto-Menü inkl. Org-Switcher und
Abmelden nicht erreichbar.

Neue Body-Klasse first-refresh-blocking hebt den Header per z-index über
das Overlay, solange dieses blockierend sichtbar ist. UI._syncHeaderAccess()
spiegelt den Overlay-Zustand an allen Stellen, die das Overlay ein- oder
ausblenden.

Die fallbezogenen Aktionen (Aktualisieren, Bearbeiten, ...) bleiben
unverändert gesperrt: dafür sorgen weiterhin #incident-view.refresh-blurred
und .incident-header-actions.first-refresh-locked.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 src/static/css/style.css    |  8 ++++++++
 src/static/dashboard.html   |  6 +++---
 src/static/js/app.js        |  4 ++++
 src/static/js/components.js | 18 ++++++++++++++++++
 4 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/src/static/css/style.css b/src/static/css/style.css
index 236d9de..45eaf7e 100644
--- a/src/static/css/style.css
+++ b/src/static/css/style.css
@@ -2144,6 +2144,14 @@ a.dev-source-pill:hover {
     pointer-events: auto;
     background: rgba(0,0,0,0.15);
 }
+/* Der globale Header bleibt auch während der ersten (blockierenden) Recherche
+   bedienbar. Das Overlay deckt sonst den gesamten Viewport ab und schluckt die
+   Klicks auf Barrierefreiheit, Theme-Wechsel, Konto-Menü und Abmelden.
+   Gesperrt bleiben ausschließlich die fallbezogenen Aktionen (Aktualisieren,
+   Bearbeiten, ...) über #incident-view.refresh-blurred. */
+body.first-refresh-blocking .header {
+    z-index: 9100;
+}
 .progress-popup {
     pointer-events: auto;
     background: var(--bg-primary);
diff --git a/src/static/dashboard.html b/src/static/dashboard.html
index ef7838e..a13a366 100644
--- a/src/static/dashboard.html
+++ b/src/static/dashboard.html
@@ -13,7 +13,7 @@
     <link rel="stylesheet" href="/static/vendor/leaflet.css">
     <link rel="stylesheet" href="/static/vendor/MarkerCluster.css">
     <link rel="stylesheet" href="/static/vendor/MarkerCluster.Default.css">
-    <link rel="stylesheet" href="/static/css/style.css?v=20260522c">
+    <link rel="stylesheet" href="/static/css/style.css?v=20260723a">
 <style>
 /* Export Modal Radio */
 .export-radio { display:flex; align-items:center; gap:10px; padding:8px 12px; cursor:pointer; border-radius:var(--radius-sm); transition:background 0.15s; border:1px solid transparent; margin-bottom:4px; }
@@ -808,10 +808,10 @@
     <script src="/static/js/i18n.js?v=20260513a"></script>
     <script src="/static/js/api.js?v=20260522f"></script>
     <script src="/static/js/ws.js?v=20260316b"></script>
-    <script src="/static/js/components.js?v=20260522d"></script>
+    <script src="/static/js/components.js?v=20260723a"></script>
     <script src="/static/js/layout.js?v=20260513f"></script>
     <script src="/static/js/pipeline.js?v=20260513d"></script>
-    <script src="/static/js/app.js?v=20260522f"></script>
+    <script src="/static/js/app.js?v=20260723a"></script>
     <script src="/static/js/cluster-data.js?v=20260322f"></script>
     <script src="/static/js/tutorial.js?v=20260316z"></script>
     <script src="/static/js/chat.js?v=20260514e"></script>
diff --git a/src/static/js/app.js b/src/static/js/app.js
index ed8ad9e..20fd75c 100644
--- a/src/static/js/app.js
+++ b/src/static/js/app.js
@@ -784,6 +784,7 @@ const App = {
         // Hide any popup/mini from previous incident
         const prevOverlay = document.getElementById('progress-overlay');
         if (prevOverlay) prevOverlay.style.display = 'none';
+        if (typeof UI !== 'undefined' && UI._syncHeaderAccess) UI._syncHeaderAccess();
         const prevMini = document.getElementById('progress-mini');
         if (prevMini) prevMini.style.display = 'none';
         const blurTarget = document.getElementById('incident-view');
@@ -2596,6 +2597,7 @@ async handleRefresh() {
         // Temporarily hide progress popup so confirm dialog is fully visible
         const progressOverlay = document.getElementById('progress-overlay');
         if (progressOverlay) progressOverlay.style.display = 'none';
+        UI._syncHeaderAccess();
 
         const ok = await confirmDialog((typeof T === 'function' ? T('confirm.cancel_running_research', 'Laufende Recherche abbrechen?') : 'Laufende Recherche abbrechen?'));
 
@@ -2603,11 +2605,13 @@ async handleRefresh() {
         if (!ok) {
             const state = UI._progressState[this.currentIncidentId];
             if (state && progressOverlay) progressOverlay.style.display = 'flex';
+            UI._syncHeaderAccess();
             return;
         }
 
         // Show cancelling state in popup
         if (progressOverlay) progressOverlay.style.display = 'flex';
+        UI._syncHeaderAccess();
         const btn = document.getElementById('progress-cancel-btn');
         if (btn) {
             btn.textContent = (typeof T === 'function' ? T('action.cancelling', 'Wird abgebrochen...') : 'Wird abgebrochen...');
diff --git a/src/static/js/components.js b/src/static/js/components.js
index e8b705d..3a57d3d 100644
--- a/src/static/js/components.js
+++ b/src/static/js/components.js
@@ -355,6 +355,20 @@ const UI = {
         this._showPopupProgress(status, extra, state);
     },
 
+    /**
+     * Hält den globalen Header bedienbar, solange das blockierende
+     * Fortschritts-Overlay sichtbar ist. Die Body-Klasse hebt den Header per
+     * z-index über das Overlay: Barrierefreiheit, Theme, Konto-Menü und
+     * Abmelden müssen jederzeit erreichbar sein.
+     */
+    _syncHeaderAccess() {
+        const overlay = document.getElementById('progress-overlay');
+        const blocking = !!overlay
+            && overlay.classList.contains('blocking')
+            && overlay.style.display !== 'none';
+        document.body.classList.toggle('first-refresh-blocking', blocking);
+    },
+
     _showPopupProgress(status, extra, state) {
         const overlay = document.getElementById('progress-overlay');
         const popup = document.getElementById('progress-popup');
@@ -381,6 +395,7 @@ const UI = {
         } else {
             overlay.classList.remove('blocking');
         }
+        this._syncHeaderAccess();
 
         // Minimize button: only for updates (not first)
         const minBtn = document.getElementById('progress-popup-minimize');
@@ -485,6 +500,7 @@ const UI = {
         // Hide popup
         const overlay = document.getElementById('progress-overlay');
         if (overlay) overlay.style.display = 'none';
+        this._syncHeaderAccess();
     },
 
     minimizeProgress(incidentId) {
@@ -528,6 +544,7 @@ const UI = {
                 overlay.style.display = 'flex';
                 overlay.classList.remove('blocking');
             }
+            this._syncHeaderAccess();
 
             // Mark all steps done
             document.querySelectorAll('.progress-check-item').forEach(item => {
@@ -620,6 +637,7 @@ const UI = {
         if (incidentId === App.currentIncidentId) {
             const overlay = document.getElementById('progress-overlay');
             if (overlay) { overlay.style.display = 'none'; overlay.classList.remove('blocking'); }
+            this._syncHeaderAccess();
             const mini = document.getElementById('progress-mini');
             if (mini) mini.style.display = 'none';
         }