metrics adn insihigts

frontend/src/pages/Writer/Content.tsx

@@ -25,6 +25,7 @@ import { useProgressModal } from '../../hooks/useProgressModal';
 import PageHeader from '../../components/common/PageHeader';
 import ModuleNavigationTabs from '../../components/navigation/ModuleNavigationTabs';
 import ModuleMetricsFooter, { MetricItem, ProgressMetric } from '../../components/dashboard/ModuleMetricsFooter';
+import { WorkflowInsight } from '../../components/common/WorkflowInsights';
 
 export default function Content() {
   const toast = useToast();
@@ -55,6 +56,59 @@ export default function Content() {
   const progressModal = useProgressModal();
   const hasReloadedRef = useRef(false);
 
+  // Calculate workflow insights
+  const workflowInsights: WorkflowInsight[] = useMemo(() => {
+    const insights: WorkflowInsight[] = [];
+    const draftCount = content.filter(c => c.status === 'draft').length;
+    const reviewCount = content.filter(c => c.status === 'review').length;
+    const publishedCount = content.filter(c => c.status === 'published').length;
+    const publishingRate = totalCount > 0 ? Math.round((publishedCount / totalCount) * 100) : 0;
+
+    if (totalCount === 0) {
+      insights.push({
+        type: 'info',
+        message: 'No content yet - Generate content from tasks to build your content library',
+      });
+      return insights;
+    }
+
+    // Draft vs Review status
+    if (draftCount > reviewCount * 3 && draftCount >= 5) {
+      insights.push({
+        type: 'warning',
+        message: `${draftCount} drafts waiting for review - Move content to review stage for quality assurance`,
+      });
+    } else if (draftCount > 0) {
+      insights.push({
+        type: 'info',
+        message: `${draftCount} drafts in progress - Review and refine before moving to publish stage`,
+      });
+    }
+
+    // Review queue status
+    if (reviewCount > 0) {
+      insights.push({
+        type: 'action',
+        message: `${reviewCount} pieces awaiting final review - Approve and publish when ready`,
+      });
+    }
+
+    // Publishing readiness
+    if (publishingRate >= 60 && publishedCount >= 10) {
+      insights.push({
+        type: 'success',
+        message: `Strong publishing rate (${publishingRate}%) - ${publishedCount} articles ready for WordPress sync`,
+      });
+    } else if (publishedCount > 0) {
+      insights.push({
+        type: 'success',
+        message: `${publishedCount} articles published (${publishingRate}%) - Continue moving content through the pipeline`,
+      });
+    }
+
+    return insights;
+  }, [content, totalCount]);
+
   // Load content - wrapped in useCallback
   const loadContent = useCallback(async () => {
     setLoading(true);
@@ -167,6 +221,7 @@ export default function Content() {
       label: metric.label,
       value: metric.calculate({ content, totalCount }),
       accentColor: metric.accentColor,
+      tooltip: (metric as any).tooltip,
     }));
   }, [pageConfig?.headerMetrics, content, totalCount]);
 
@@ -238,6 +293,7 @@ export default function Content() {
         title="Content Drafts" 
         badge={{ icon: <FileIcon />, color: 'purple' }}
         navigation={<ModuleNavigationTabs tabs={writerTabs} />}
+        workflowInsights={workflowInsights}
       />
       <TablePageTemplate
         columns={pageConfig.columns}
@@ -283,27 +339,43 @@ export default function Content() {
         getItemDisplayName={(row: ContentType) => row.title || `Content #${row.id}`}
       />
 
-      {/* Module Metrics Footer */}
+      {/* Module Metrics Footer - Pipeline Style with Cross-Module Links */}
       <ModuleMetricsFooter
         metrics={[
           {
-            title: 'Total Content',
-            value: totalCount.toLocaleString(),
-            subtitle: `${content.filter(c => c.status === 'published').length} published`,
-            icon: <FileIcon className="w-5 h-5" />,
-            accentColor: 'green',
-            href: '/writer/content',
+            title: 'Tasks',
+            value: content.length.toLocaleString(),
+            subtitle: 'generated from queue',
+            icon: <TaskIcon className="w-5 h-5" />,
+            accentColor: 'blue',
+            href: '/writer/tasks',
           },
           {
             title: 'Draft',
             value: content.filter(c => c.status === 'draft').length.toLocaleString(),
-            subtitle: `${content.filter(c => c.status === 'published').length} published`,
-            icon: <TaskIcon className="w-5 h-5" />,
+            subtitle: 'needs editing',
+            icon: <FileIcon className="w-5 h-5" />,
+            accentColor: 'amber',
+          },
+          {
+            title: 'In Review',
+            value: content.filter(c => c.status === 'review').length.toLocaleString(),
+            subtitle: 'awaiting approval',
+            icon: <CheckCircleIcon className="w-5 h-5" />,
             accentColor: 'blue',
+            href: '/writer/review',
+          },
+          {
+            title: 'Published',
+            value: content.filter(c => c.status === 'published').length.toLocaleString(),
+            subtitle: 'ready for sync',
+            icon: <CheckCircleIcon className="w-5 h-5" />,
+            accentColor: 'green',
+            href: '/writer/published',
           },
         ]}
         progress={{
-          label: 'Content Publishing Progress',
+          label: 'Content Publishing Pipeline: Content moved from draft through review to published (Draft \u2192 Review \u2192 Published)',
           value: totalCount > 0 ? Math.round((content.filter(c => c.status === 'published').length / totalCount) * 100) : 0,
           color: 'success',
         }}