fix(#53): show error banner with retry when loadData() rejects

This commit is contained in:
Zac Gaetano 2026-05-25 17:42:39 -04:00
parent 33c82cab1a
commit fba671ad40

View file

@ -8,6 +8,7 @@ function App() {
const [openProject, setOpenProject] = React.useState(null);
const [showNewRecorder, setShowNewRecorder] = React.useState(false);
const [dataReady, setDataReady] = React.useState(false);
const [loadError, setLoadError] = React.useState(null);
React.useEffect(() => {
document.documentElement.style.setProperty('--accent', ACCENT);
@ -20,7 +21,7 @@ function App() {
React.useEffect(() => {
window.ZAMPP_API.loadData()
.then(() => setDataReady(true))
.catch(err => { console.error('[Dragonflight] load failed:', err); setDataReady(true); });
.catch(err => { console.error('[Dragonflight] load failed:', err); setLoadError(err.message || 'Failed to load'); setDataReady(true); });
}, []);
const navigate = (id) => { setOpenAsset(null); setRoute(id); };
@ -63,6 +64,16 @@ function App() {
);
}
if (loadError) {
return (
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100vh', flexDirection: 'column', gap: 12, background: 'var(--bg-0)' }}>
<div style={{ fontSize: 14, fontWeight: 600, color: 'var(--danger)' }}>Failed to load</div>
<div style={{ fontSize: 12, color: 'var(--text-3)', maxWidth: 360, textAlign: 'center' }}>{loadError}</div>
<button className="btn primary sm" onClick={() => window.location.reload()}>Retry</button>
</div>
);
}
let content;
if (openAsset) {
content = <AssetDetail asset={openAsset} onClose={() => setOpenAsset(null)} />;