fix: improve Dashboard error handling and add debug logging
All checks were successful
Deploy Development / deploy (push) Successful in 43s
Build Test / lint-backend (push) Successful in 0s
Build Test / build-frontend (push) Successful in 13s

- Add .catch() handler to load() Promise to prevent infinite loading state
- Add console.log statements for component lifecycle debugging
- Make EmailVerificationBanner/TrialBanner conditional on activeProfile
- Ensure greeting header always renders with fallback

This should fix the empty dashboard issue for new users.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Lars 2026-03-21 11:56:09 +01:00
parent e62b05c224
commit 2e68b29d9c

View File

@ -247,6 +247,12 @@ export default function Dashboard() {
setNutrition(n); setActivities(a) setNutrition(n); setActivities(a)
setInsights(Array.isArray(ins)?ins:[]) setInsights(Array.isArray(ins)?ins:[])
setLoading(false) setLoading(false)
}).catch(err => {
console.error('Dashboard load failed:', err)
// Set empty data on error so UI can still render
setStats(null); setWeights([]); setCalipers([]); setCircs([])
setNutrition([]); setActivities([]); setInsights([])
setLoading(false)
}) })
const runPipeline = async () => { const runPipeline = async () => {
@ -260,7 +266,12 @@ export default function Dashboard() {
} finally { setPipelineLoading(false) } } finally { setPipelineLoading(false) }
} }
useEffect(()=>{ load() },[]) useEffect(()=>{
console.log('[Dashboard] Component mounted, loading data...')
load()
},[])
console.log('[Dashboard] Rendering, loading=', loading, 'activeProfile=', activeProfile?.name)
if (loading) return <div className="empty-state"><div className="spinner"/></div> if (loading) return <div className="empty-state"><div className="spinner"/></div>
@ -304,6 +315,8 @@ export default function Dashboard() {
const hasAnyData = latestW||latestCal||nutrition.length>0 const hasAnyData = latestW||latestCal||nutrition.length>0
console.log('[Dashboard] hasAnyData=', hasAnyData, 'latestW=', !!latestW, 'latestCal=', !!latestCal, 'nutrition.length=', nutrition.length)
return ( return (
<div> <div>
{/* Header greeting */} {/* Header greeting */}
@ -318,10 +331,10 @@ export default function Dashboard() {
</div> </div>
{/* Email Verification Banner */} {/* Email Verification Banner */}
<EmailVerificationBanner profile={activeProfile}/> {activeProfile && <EmailVerificationBanner profile={activeProfile}/>}
{/* Trial Banner */} {/* Trial Banner */}
<TrialBanner profile={activeProfile}/> {activeProfile && <TrialBanner profile={activeProfile}/>}
{!hasAnyData && ( {!hasAnyData && (
<div className="empty-state"> <div className="empty-state">