feat: add category breakdown to reading progress debug output

Shows counts of articles in each reading progress category:
- Unopened (0%)
- Started (0% < progress ≤ 10%)
- Reading (10% < progress ≤ 94%) - highlighted in green
- Completed (≥ 95%)

This helps understand why /me/reads/reading shows fewer articles than
the total reading progress events - most articles fall into other categories.
This commit is contained in:
Gigi
2025-10-19 23:11:38 +02:00
parent 2639c78957
commit b900666eb8

View File

@@ -1573,6 +1573,43 @@ const Debug: React.FC<DebugProps> = ({
{deduplicatedProgressMap.size > 0 && (
<div className="mb-3">
<div className="text-sm opacity-70 mb-2">Deduplicated Reading Progress ({deduplicatedProgressMap.size} articles):</div>
{/* Category breakdown */}
<div className="mb-3 p-2 bg-purple-50 dark:bg-purple-900/20 rounded border border-purple-200 dark:border-purple-700">
<div className="text-sm font-semibold mb-2">Breakdown by Category:</div>
<div className="space-y-1">
{(() => {
let unopened = 0, started = 0, reading = 0, completed = 0
for (const progress of deduplicatedProgressMap.values()) {
if (progress === 0) unopened++
else if (progress > 0 && progress <= 0.10) started++
else if (progress > 0.10 && progress <= 0.94) reading++
else if (progress >= 0.95) completed++
}
return (
<>
<div className="flex justify-between text-xs">
<span>Unopened (0%):</span>
<span className="font-semibold">{unopened}</span>
</div>
<div className="flex justify-between text-xs">
<span>Started (0% &lt; progress 10%):</span>
<span className="font-semibold">{started}</span>
</div>
<div className="flex justify-between text-xs bg-green-100 dark:bg-green-900/30 px-1 py-0.5 rounded">
<span>Reading (10% &lt; progress 94%) :</span>
<span className="font-semibold text-green-700 dark:text-green-400">{reading}</span>
</div>
<div className="flex justify-between text-xs">
<span>Completed ( 95%):</span>
<span className="font-semibold">{completed}</span>
</div>
</>
)
})()}
</div>
</div>
<div className="space-y-2 max-h-96 overflow-y-auto">
{Array.from(deduplicatedProgressMap.entries()).map(([articleId, progress], idx) => {
return (