From e1c88b291c563196208657f7d54bfc12cec990cc Mon Sep 17 00:00:00 2001
From: Iqbal <iqbaldev3@gmail.com>
Date: Fri, 30 Oct 2026 13:52:10 +0700
Subject: [PATCH] Count content the same way on the dashboard and Results

The dashboard's "All content made" counted everything not failed,
pieces still being made included, while Results' tab counted every
piece and its "Done" filter only finished ones, so the numbers never
matched. The dashboard now counts what Results calls Done, and each
status filter on Results shows how many pieces it holds, so the total
splits into the same numbers the dashboard shows.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 src/pages/Production.tsx | 3 ++-
 src/pages/Results.tsx    | 8 +++++---
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/pages/Production.tsx b/src/pages/Production.tsx
index 37b9b83..d86b896 100644
--- a/src/pages/Production.tsx
+++ b/src/pages/Production.tsx
@@ -125,7 +125,8 @@ export function ProductionPage() {
 
       <div className="metrics prod-metrics">
         <div className="metric"><span>{t('prod.metricMaterial')}</span>{num(docs.data?.length ?? 0, !!docs.data, docs.data?.length === 1 ? 'prod.unitMaterialOne' : 'prod.unitMaterial')}<small>{t('prod.metricMaterialSub')}</small></div>
-        <div className="metric"><span>{t('prod.metricMade')}</span>{num(materials.filter(m => m.status !== 'failed').length, !!results.data, 'prod.unitContent')}<small>{t('prod.metricMadeSub')}</small></div>
+        {/* Counted as Results counts "Done" (?status=done), so the two pages show the same number. */}
+        <div className="metric"><span>{t('prod.metricMade')}</span>{num(made.length, !!results.data, 'prod.unitContent')}<small>{t('prod.metricMadeSub')}</small></div>
         <div className="metric"><span>{t('prod.metricLms')}</span>{num(lms.length, !!results.data, 'prod.unitContent')}<small>{t('prod.metricLmsSub')}</small></div>
       </div>
 
diff --git a/src/pages/Results.tsx b/src/pages/Results.tsx
index f3be1f1..bc329ad 100644
--- a/src/pages/Results.tsx
+++ b/src/pages/Results.tsx
@@ -48,8 +48,10 @@ export function ResultsPage() {
   const sources = results.data?.sources ?? []
   const kinds = useMemo(() => [...new Set(materials.map(m => m.kind))], [materials])
   const needle = query.trim().toLowerCase()
-  const shownMaterials = materials.filter(m => (kind === 'all' || m.kind === kind) && matchesStatus(m, status)
-    && (!needle || titleOf(m).toLowerCase().includes(needle)))
+  const searched = materials.filter(m => (kind === 'all' || m.kind === kind) && (!needle || titleOf(m).toLowerCase().includes(needle)))
+  const shownMaterials = searched.filter(m => matchesStatus(m, status))
+  // Each status says how many it holds, so the tab's total and the dashboard's counts add up here.
+  const statusCount = (s: StatusFilter) => searched.filter(m => matchesStatus(m, s)).length
   const shownSources = sources.filter(s => !needle || s.title.toLowerCase().includes(needle) || s.url?.toLowerCase().includes(needle))
   const open = materials.find(m => materialKey(m) === openId) ?? null
   const pending = sources.filter(s => s.status === 'pending').length
@@ -79,7 +81,7 @@ export function ResultsPage() {
                   {kinds.map(k => <option key={k} value={k}>{kindLabel(k)}</option>)}
                 </select>
                 <select aria-label={t('res.filterStatus')} value={status} onChange={e => setStatus(e.target.value as StatusFilter)}>
-                  {STATUS_FILTERS.map(s => <option key={s} value={s}>{t(`res.status.${s}` as Key)}</option>)}
+                  {STATUS_FILTERS.map(s => <option key={s} value={s}>{t(`res.status.${s}` as Key)} ({statusCount(s)})</option>)}
                 </select>
               </>
             )}