more fixes ui

frontend/src/pages/Planner/Clusters.tsx

@@ -331,6 +331,7 @@ export default function Clusters() {
       volumeDropdownRef,
       setCurrentPage,
       loadClusters,
+      onGenerateIdeas: (clusterId: number) => handleRowAction('generate_ideas', { id: clusterId } as Cluster),
     });
   }, [
     activeSector,
@@ -344,6 +345,7 @@ export default function Clusters() {
     tempVolumeMin,
     tempVolumeMax,
     loadClusters,
+    handleRowAction,
   ]);
 
   // Calculate header metrics
@@ -405,12 +407,6 @@ export default function Clusters() {
           volumeMin: volumeMin,
           volumeMax: volumeMax,
         }}
-        primaryAction={{
-          label: 'Generate Ideas',
-          icon: <BoltIcon className="w-4 h-4" />,
-          onClick: () => handleBulkAction('auto_generate_ideas', selectedIds),
-          variant: 'success',
-        }}
         onFilterChange={(key, value) => {
           const stringValue = value === null || value === undefined ? '' : String(value);
           if (key === 'search') {

frontend/src/pages/Writer/Content.tsx

@@ -4,6 +4,7 @@
  */
 
 import { useState, useEffect, useMemo, useCallback, useRef } from 'react';
+import { Link, useNavigate } from 'react-router-dom';
 import TablePageTemplate from '../../templates/TablePageTemplate';
 import { 
   fetchContent,
@@ -14,9 +15,8 @@ import {
   bulkDeleteContent,
 } from '../../services/api';
 import { optimizerApi } from '../../api/optimizer.api';
-import { useNavigate } from 'react-router-dom';
 import { useToast } from '../../components/ui/toast/ToastContainer';
-import { FileIcon, TaskIcon, CheckCircleIcon } from '../../icons';
+import { FileIcon, TaskIcon, CheckCircleIcon, ArrowRightIcon } from '../../icons';
 import { createContentPageConfig } from '../../config/pages/content.config';
 import { useSectorStore } from '../../store/sectorStore';
 import { usePageSizeStore } from '../../store/pageSizeStore';
@@ -273,6 +273,28 @@ export default function Content() {
         onDelete={handleDelete}
         onBulkDelete={handleBulkDelete}
         getItemDisplayName={(row: ContentType) => row.title || `Content #${row.id}`}
+        statusExplainer={
+          <div className="text-xs text-gray-600 dark:text-gray-400 space-y-1">
+            <div className="font-medium text-gray-700 dark:text-gray-300">
+              Currently Generated (Draft): {content.filter(c => c.status === 'draft').length}
+            </div>
+            <div>
+              Image Prompts: {content.filter(c => c.has_image_prompts).length}/{content.length}
+            </div>
+            <div>
+              Images Generated: {content.filter(c => c.has_generated_images).length}/{content.length}
+            </div>
+            <div className="pt-2 border-t border-gray-200 dark:border-gray-700 mt-2">
+              <Link 
+                to="/writer/review" 
+                className="text-brand-500 hover:text-brand-600 flex items-center gap-1"
+              >
+                <span>Review ({content.filter(c => c.status === 'review').length})</span>
+                <ArrowRightIcon className="w-3 h-3" />
+              </Link>
+            </div>
+          </div>
+        }
       />
 
       {/* Module Metrics Footer - Pipeline Style with Cross-Module Links */}

frontend/src/pages/Writer/Images.tsx

@@ -4,6 +4,7 @@
  */
 
 import { useState, useEffect, useMemo, useCallback, useRef } from 'react';
+import { Link } from 'react-router-dom';
 import TablePageTemplate from '../../templates/TablePageTemplate';
 import {
   fetchContentImages,
@@ -18,7 +19,7 @@ import {
   bulkDeleteContent,
 } from '../../services/api';
 import { useToast } from '../../components/ui/toast/ToastContainer';
-import { FileIcon, DownloadIcon } from '../../icons';
+import { FileIcon, DownloadIcon, ArrowRightIcon } from '../../icons';
 import { PhotoIcon } from '@heroicons/react/24/outline';
 import { createImagesPageConfig } from '../../config/pages/images.config';
 import ImageQueueModal, { ImageQueueItem } from '../../components/common/ImageQueueModal';
@@ -514,6 +515,28 @@ export default function Images() {
         setCurrentPage(1);
       }}
       onRowAction={handleRowAction}
+      statusExplainer={
+        <div className="text-xs text-gray-600 dark:text-gray-400 space-y-1">
+          <div className="font-medium text-gray-700 dark:text-gray-300">
+            Content Images Status
+          </div>
+          <div>
+            Need Images: {images.filter(i => i.overall_status === 'pending').length}
+          </div>
+          <div>
+            Images Complete: {images.filter(i => i.overall_status === 'complete').length}
+          </div>
+          <div className="pt-2 border-t border-gray-200 dark:border-gray-700 mt-2">
+            <Link 
+              to="/writer/review" 
+              className="text-brand-500 hover:text-brand-600 flex items-center gap-1"
+            >
+              <span>Go to Review</span>
+              <ArrowRightIcon className="w-3 h-3" />
+            </Link>
+          </div>
+        </div>
+      }
     />
       <ImageQueueModal
         isOpen={isQueueModalOpen}

frontend/src/pages/Writer/Review.tsx

@@ -453,6 +453,13 @@ export default function Review() {
           setCurrentPage(1);
         }}
         onRowAction={handleRowAction}
+        statusExplainer={
+          <div className="text-xs text-gray-600 dark:text-gray-400 space-y-1">
+            <div className="font-medium text-gray-700 dark:text-gray-300">
+              Approve {totalCount} content pages/articles awaiting approval
+            </div>
+          </div>
+        }
       />
       <ModuleMetricsFooter
         metrics={[

frontend/src/pages/Writer/Tasks.tsx

@@ -3,7 +3,7 @@
  * Consistent with Keywords page layout, structure and design
  */
 
-import { useState, useEffect, useCallback, useRef } from 'react';
+import { useState, useEffect, useCallback, useRef, useMemo } from 'react';
 import TablePageTemplate from '../../templates/TablePageTemplate';
 import {
   fetchTasks,