diff --git a/frontend/src/pages/History.jsx b/frontend/src/pages/History.jsx index f7e4447..22c966a 100644 --- a/frontend/src/pages/History.jsx +++ b/frontend/src/pages/History.jsx @@ -588,16 +588,22 @@ function NutritionSection({ nutrition, weights, profile, insights, onRequest, lo // ── Activity Section ────────────────────────────────────────────────────────── function ActivitySection({ activities, insights, onRequest, loadingSlug, filterActiveSlugs }) { const [period, setPeriod] = useState(30) - const [qualityFilter, setQualityFilter] = useState(false) // Issue #24: Quality-Filter Toggle + const [qualityLevel, setQualityLevel] = useState('all') // Issue #24: Quality-Filter (all, quality, very_good, excellent) if (!activities?.length) return ( ) const cutoff = dayjs().subtract(period,'day').format('YYYY-MM-DD') - // Issue #24: Filter nach Datum UND Quality-Label - const filtA = activities.filter(d => - (period===9999 || d.date>=cutoff) && - (!qualityFilter || ['excellent', 'good', 'acceptable'].includes(d.quality_label)) - ) + + // Issue #24: Mehrstufiger Quality-Filter + const filtA = activities.filter(d => { + if (period !== 9999 && d.date < cutoff) return false + + if (qualityLevel === 'all') return true + if (qualityLevel === 'quality') return ['excellent', 'good', 'acceptable'].includes(d.quality_label) + if (qualityLevel === 'very_good') return ['excellent', 'good'].includes(d.quality_label) + if (qualityLevel === 'excellent') return d.quality_label === 'excellent' + return true + }) const byDate={} filtA.forEach(a=>{ byDate[a.date]=(byDate[a.date]||0)+(a.kcal_active||0) }) @@ -626,20 +632,34 @@ function ActivitySection({ activities, insights, onRequest, loadingSlug, filterA - {/* Issue #24: Quality-Filter Toggle */} -
- - {qualityFilter && ( - - ({filtA.length} von {activities.filter(d=>period===9999||d.date>=cutoff).length}) - + {/* Issue #24: Mehrstufiger Quality-Filter */} +
+
QUALITÄTSFILTER
+
+ {[ + {v:'all', l:'Alle', icon:'📊'}, + {v:'quality', l:'Hochwertig', icon:'✓'}, + {v:'very_good', l:'Sehr gut', icon:'✓✓'}, + {v:'excellent', l:'Exzellent', icon:'⭐'} + ].map(o => ( + + ))} +
+ {qualityLevel !== 'all' && ( +
+ {filtA.length} von {activities.filter(d=>period===9999||d.date>=cutoff).length} Aktivitäten + {qualityLevel === 'quality' && ' (excellent, good, acceptable)'} + {qualityLevel === 'very_good' && ' (excellent, good)'} + {qualityLevel === 'excellent' && ' (nur excellent)'} +
)}