fix(ui): Steuerungszustand sichtbar auch bei Lade-/API-Fehler
Some checks failed
Deploy Development / deploy (push) Successful in 46s
Test Suite / pytest-backend (push) Failing after 1m12s
Test Suite / k6 /api/health Baseline (push) Has been skipped
Test Suite / playwright-smoke (push) Has been skipped
Test Suite / lint-backend (push) Successful in 2s
Test Suite / compose-smoke (push) Has been skipped

Vorher wurde das Panel bei fehlendem Snapshot komplett ausgeblendet.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Lars 2026-07-05 15:36:15 +02:00
parent e25ff86420
commit 1b19deb728
2 changed files with 40 additions and 6 deletions

View File

@ -1,7 +1,26 @@
import { PHASE_LABELS } from '../constants/operating.js' import { PHASE_LABELS } from '../constants/operating.js'
export function SteeringSnapshotPanel({ snapshot }) { export function SteeringSnapshotPanel({ snapshot, loading, error }) {
if (!snapshot) return null if (loading) {
return (
<section className="card steering-snapshot">
<p className="muted">Steuerungszustand wird geladen </p>
</section>
)
}
if (error || !snapshot) {
return (
<section className="card steering-snapshot steering-snapshot--unavailable">
<div className="section-header">
<h2>Steuerungszustand</h2>
</div>
<p className="muted">
{error || 'Snapshot nicht verfügbar — bitte Seite neu laden (Strg+F5).'}
</p>
</section>
)
}
const { operating_phase, phase_signals, counts } = snapshot const { operating_phase, phase_signals, counts } = snapshot
const phaseLabel = PHASE_LABELS[operating_phase] || operating_phase const phaseLabel = PHASE_LABELS[operating_phase] || operating_phase

View File

@ -91,6 +91,8 @@ export function InitiativeDetailPage() {
const [reviews, setReviews] = useState([]) const [reviews, setReviews] = useState([])
const [recurringItems, setRecurringItems] = useState([]) const [recurringItems, setRecurringItems] = useState([])
const [steeringSnapshot, setSteeringSnapshot] = useState(null) const [steeringSnapshot, setSteeringSnapshot] = useState(null)
const [steeringSnapshotLoading, setSteeringSnapshotLoading] = useState(false)
const [steeringSnapshotError, setSteeringSnapshotError] = useState(null)
const [loading, setLoading] = useState(true) const [loading, setLoading] = useState(true)
const [error, setError] = useState(null) const [error, setError] = useState(null)
const [showActionForm, setShowActionForm] = useState(false) const [showActionForm, setShowActionForm] = useState(false)
@ -123,9 +125,18 @@ export function InitiativeDetailPage() {
loads.push(listInitiativeReviews(id).then(setReviews).catch(() => setReviews([]))) loads.push(listInitiativeReviews(id).then(setReviews).catch(() => setReviews([])))
loads.push(listInitiativeRecurring(id).then(setRecurringItems).catch(() => setRecurringItems([]))) loads.push(listInitiativeRecurring(id).then(setRecurringItems).catch(() => setRecurringItems([])))
loads.push( loads.push(
getInitiativeSteeringSnapshot(id) (async () => {
.then(setSteeringSnapshot) setSteeringSnapshotLoading(true)
.catch(() => setSteeringSnapshot(null)) setSteeringSnapshotError(null)
try {
setSteeringSnapshot(await getInitiativeSteeringSnapshot(id))
} catch (err) {
setSteeringSnapshot(null)
setSteeringSnapshotError(err.message || 'Snapshot fehlgeschlagen')
} finally {
setSteeringSnapshotLoading(false)
}
})()
) )
} }
await Promise.all(loads) await Promise.all(loads)
@ -483,7 +494,11 @@ export function InitiativeDetailPage() {
{error && <p className="error">{error}</p>} {error && <p className="error">{error}</p>}
{capabilities.has('kairo.initiative.read') && ( {capabilities.has('kairo.initiative.read') && (
<SteeringSnapshotPanel snapshot={steeringSnapshot} /> <SteeringSnapshotPanel
snapshot={steeringSnapshot}
loading={steeringSnapshotLoading}
error={steeringSnapshotError}
/>
)} )}
<section className="card"> <section className="card">