refactor phase 7-8

frontend/src/pages/Linker/ContentList.tsx

@@ -2,12 +2,14 @@ import { useState, useEffect, useCallback } from 'react';
 import { useNavigate } from 'react-router';
 import PageMeta from '../../components/common/PageMeta';
 import PageHeader from '../../components/common/PageHeader';
+import ModuleNavigationTabs from '../../components/navigation/ModuleNavigationTabs';
+import ModuleMetricsFooter, { MetricItem, ProgressMetric } from '../../components/dashboard/ModuleMetricsFooter';
 import { linkerApi } from '../../api/linker.api';
 import { fetchContent, Content as ContentType } from '../../services/api';
 import { useToast } from '../../components/ui/toast/ToastContainer';
 import { SourceBadge, ContentSource } from '../../components/content/SourceBadge';
 import { LinkResults } from '../../components/linker/LinkResults';
-import { PlugInIcon } from '../../icons';
+import { PlugInIcon, CheckCircleIcon, FileIcon } from '../../icons';
 import { useSectorStore } from '../../store/sectorStore';
 import { usePageSizeStore } from '../../store/pageSizeStore';
 
@@ -103,6 +105,9 @@ export default function LinkerContentList() {
           title="Link Content"
           description="Add internal links to your content"
         />
+        <ModuleNavigationTabs tabs={[
+          { label: 'Content', path: '/linker/content', icon: <FileIcon /> },
+        ]} />
 
         {loading ? (
           <div className="text-center py-12">
@@ -240,6 +245,41 @@ export default function LinkerContentList() {
             )}
           </div>
         )}
+
+        {/* Module Metrics Footer */}
+        <ModuleMetricsFooter
+          metrics={[
+            {
+              title: 'Total Content',
+              value: totalCount.toLocaleString(),
+              subtitle: `${content.filter(c => (c.internal_links?.length || 0) > 0).length} with links`,
+              icon: <FileIcon className="w-5 h-5" />,
+              accentColor: 'blue',
+              href: '/linker/content',
+            },
+            {
+              title: 'Links Added',
+              value: content.reduce((sum, c) => sum + (c.internal_links?.length || 0), 0).toLocaleString(),
+              subtitle: `${Object.keys(linkResults).length} processed`,
+              icon: <PlugInIcon className="w-5 h-5" />,
+              accentColor: 'purple',
+            },
+            {
+              title: 'Avg Links/Content',
+              value: content.length > 0 
+                ? (content.reduce((sum, c) => sum + (c.internal_links?.length || 0), 0) / content.length).toFixed(1)
+                : '0',
+              subtitle: `${content.filter(c => c.linker_version && c.linker_version > 0).length} optimized`,
+              icon: <CheckCircleIcon className="w-5 h-5" />,
+              accentColor: 'green',
+            },
+          ]}
+          progress={{
+            label: 'Content Linking Progress',
+            value: totalCount > 0 ? Math.round((content.filter(c => (c.internal_links?.length || 0) > 0).length / totalCount) * 100) : 0,
+            color: 'primary',
+          }}
+        />
       </div>
     </>
   );