header footer metrics update and credits by site fixes

frontend/src/config/pages/approved.config.tsx

@@ -296,24 +296,45 @@ export function createApprovedPageConfig(params: {
 
   const headerMetrics: HeaderMetricConfig[] = [
     {
-      label: 'Approved',
-      accentColor: 'green',
-      calculate: (data: { totalCount: number }) => data.totalCount,
-      tooltip: 'Total approved content ready for publishing.',
-    },
-    {
-      label: 'On Site',
+      label: 'Content',
       accentColor: 'blue',
-      calculate: (data: { content: Content[] }) => 
-        data.content.filter(c => c.external_id).length,
-      tooltip: 'Content published to your website.',
+      calculate: (data: { totalCount: number }) => data.totalCount,
+      tooltip: 'Total content items tracked. Overall volume across all stages.',
     },
     {
-      label: 'Pending',
+      label: 'Draft',
       accentColor: 'amber',
       calculate: (data: { content: Content[] }) => 
-        data.content.filter(c => !c.external_id).length,
-      tooltip: 'Approved content not yet published to site.',
+        data.content.filter(c => c.status === 'draft').length,
+      tooltip: 'Content written, images not generated. Generate images to move to review.',
+    },
+    {
+      label: 'In Review',
+      accentColor: 'purple',
+      calculate: (data: { content: Content[] }) => 
+        data.content.filter(c => c.status === 'review').length,
+      tooltip: 'Images generated, awaiting approval. Review and approve to publish.',
+    },
+    {
+      label: 'Approved',
+      accentColor: 'green',
+      calculate: (data: { content: Content[] }) => 
+        data.content.filter(c => c.status === 'approved').length,
+        tooltip: 'Approved content awaiting publishing. Publish to site when ready.',
+    },
+    {
+      label: 'Published',
+      accentColor: 'green',
+      calculate: (data: { content: Content[] }) => 
+        data.content.filter(c => c.status === 'published').length,
+      tooltip: 'Live content on your website. Successfully published and accessible.',
+    },
+    {
+      label: 'Total Images',
+      accentColor: 'blue',
+      calculate: (data: { content: Content[] }) => 
+        data.content.filter(c => c.has_generated_images).length,
+      tooltip: 'Total images generated across all content. Tracks visual asset coverage.',
     },
   ];