## 5. Dashboard Redesign Plan

### Current Issues
- Too much whitespace and large headings
- Repeating same counts/metrics without different dimensions
- Missing actionable insights
- No AI operations analytics
- Missing "needs attention" items

### New Dashboard Design: Multi-Dimension Compact Widgets

Based on Django admin reports analysis, the dashboard should show **different data dimensions** instead of repeating counts:

### Dashboard Layout (Compact, Information-Dense)

```
┌─────────────────────────────────────────────────────────────────────────────────────┐
│ ⚠ NEEDS ATTENTION (collapsible, only shows if items exist)                          │
│ ┌────────────────────┐ ┌────────────────────┐ ┌────────────────────┐                │
│ │ 3 pending review   │ │ WP sync failed     │ │ Setup incomplete   │                │
│ │ [Review →]         │ │ [Retry] [Fix →]    │ │ [Complete →]       │                │
│ └────────────────────┘ └────────────────────┘ └────────────────────┘                │
├─────────────────────────────────────────────────────────────────────────────────────┤
│                                                                                      │
│  ┌─────────────────────────────────┐  ┌─────────────────────────────────────────┐   │
│  │ WORKFLOW PIPELINE               │  │ QUICK ACTIONS                           │   │
│  │                                 │  │                                         │   │
│  │ Sites → KWs → Clusters → Ideas  │  │ [+ Keywords] [⚡ Cluster] [📝 Content]  │   │
│  │   2     156      23       67    │  │ [🖼 Images]  [✓ Review]  [🚀 Publish]   │   │
│  │         ↓                       │  │                                         │   │
│  │ Tasks → Drafts → Published      │  │ WORKFLOW GUIDE                          │   │
│  │   45     28        45           │  │ 1. Add Keywords  5. Generate Content    │   │
│  │                                 │  │ 2. Auto Cluster  6. Generate Images     │   │
│  │ ████████████░░░ 72% Complete    │  │ 3. Generate Ideas 7. Review & Approve   │   │
│  │                                 │  │ 4. Create Tasks  8. Publish to WP       │   │
│  └─────────────────────────────────┘  │ [Full Help →]                           │   │
│                                        └─────────────────────────────────────────┘   │
│                                                                                      │
├─────────────────────────────────────────────────────────────────────────────────────┤
│                                                                                      │
│  ┌─────────────────────────────────┐  ┌─────────────────────────────────────────┐   │
│  │ AI OPERATIONS (7d)    [▼ 30d]   │  │ RECENT ACTIVITY                         │   │
│  │                                 │  │                                         │   │
│  │ Operation       Count   Credits │  │ • Clustered 45 keywords → 8 clusters    │   │
│  │ ───────────────────────────────│  │   2 hours ago                           │   │
│  │ Clustering         8      80   │  │ • Generated 5 articles (4.2K words)     │   │
│  │ Ideas             12      24   │  │   4 hours ago                           │   │
│  │ Content           28    1,400  │  │ • Created 15 image prompts              │   │
│  │ Images            45     225   │  │   Yesterday                             │   │
│  │ ───────────────────────────────│  │ • Published "Best Running Shoes" to WP  │   │
│  │ Total             93    1,729  │  │   Yesterday                             │   │
│  │                                 │  │ • Added 23 keywords from seed DB        │   │
│  │ Success Rate: 98.5%            │  │   2 days ago                            │   │
│  │ Avg Credits/Op: 18.6           │  │                                         │   │
│  └─────────────────────────────────┘  │ [View All Activity →]                   │   │
│                                        └─────────────────────────────────────────┘   │
│                                                                                      │
├─────────────────────────────────────────────────────────────────────────────────────┤
│                                                                                      │
│  ┌─────────────────────────────────┐  ┌─────────────────────────────────────────┐   │
│  │ CONTENT VELOCITY               │  │ AUTOMATION STATUS                        │   │
│  │                                 │  │                                         │   │
│  │ This Week    This Month   Total │  │ ● Active  │  Schedule: Daily 9 AM      │   │
│  │                                 │  │                                         │   │
│  │ Articles   5      28      156   │  │ Last Run: Dec 27, 7:00 AM              │   │
│  │ Words    4.2K    24K     156K   │  │ ├─ Clustered: 12 keywords              │   │
│  │ Images    12      67      340   │  │ ├─ Ideas: 8 generated                   │   │
│  │                                 │  │ ├─ Content: 5 articles                  │   │
│  │ 📈 +23% vs last week           │  │ └─ Images: 15 created                   │   │
│  │                                 │  │                                         │   │
│  │ [View Analytics →]             │  │ Next Run: Dec 28, 9:00 AM               │   │
│  └─────────────────────────────────┘  │ [Configure →] [Run Now →]               │   │
│                                        └─────────────────────────────────────────┘   │
│                                                                                      │
└─────────────────────────────────────────────────────────────────────────────────────┘
```

### Widget Specifications

#### 1. Needs Attention Bar
- Collapsible, only visible when items exist
- Types: `pending_review`, `sync_failed`, `setup_incomplete`, `automation_failed`
- Compact horizontal cards with action buttons

#### 2. Workflow Pipeline Widget
- Visual flow: Sites → Keywords → Clusters → Ideas → Tasks → Drafts → Published
- Shows counts at each stage
- Single progress bar for overall completion
- Clickable stage names link to respective pages

#### 3. Quick Actions + Workflow Guide Widget
- 2x3 grid of action buttons (use existing icons)
- Compact numbered workflow guide (1-8 steps)
- "Full Help" link to help page

#### 4. AI Operations Widget (NEW - from Django Admin Reports)
Shows data from `CreditUsageLog` model:
```typescript
interface AIOperationsData {
  period: '7d' | '30d' | '90d';
  operations: Array<{
    type: 'clustering' | 'ideas' | 'content' | 'images';
    count: number;
    credits: number;
  }>;
  totals: {
    count: number;
    credits: number;
    success_rate: number;
    avg_credits_per_op: number;
  };
}
```
- Time period filter (7d/30d/90d dropdown)
- Table with operation type, count, credits
- Success rate percentage
- Average credits per operation

#### 5. Recent Activity Widget
Shows data from `AITaskLog` and `CreditUsageLog`:
- Last 5 significant operations
- Timestamp relative (2 hours ago, Yesterday)
- Clickable to navigate to relevant content
- "View All Activity" link

#### 6. Content Velocity Widget (NEW)
Shows content production rates:
```typescript
interface ContentVelocityData {
  this_week: { articles: number; words: number; images: number };
  this_month: { articles: number; words: number; images: number };
  total: { articles: number; words: number; images: number };
  trend: number; // percentage vs previous period
}
```
- Three time columns: This Week, This Month, Total
- Rows: Articles, Words, Images
- Trend indicator vs previous period

#### 7. Automation Status Widget
Shows automation run status:
- Current status indicator (Active/Paused/Failed)
- Schedule display
- Last run details with stage breakdown
- Next scheduled run
- Configure and Run Now buttons

### API Endpoint Required

```python
# GET /api/v1/dashboard/summary/
{
    "needs_attention": [...],
    "pipeline": {
        "sites": 2, "keywords": 156, "clusters": 23, 
        "ideas": 67, "tasks": 45, "drafts": 28, "published": 45,
        "completion_percentage": 72
    },
    "ai_operations": {
        "period": "7d",
        "operations": [...],
        "totals": {...}
    },
    "recent_activity": [...],
    "content_velocity": {...},
    "automation": {...}
}
```

### Implementation Notes

- Use existing components from `components/ui/`
- Use CSS tokens from `styles/tokens.css`
- Grid layout: `grid grid-cols-1 lg:grid-cols-2 gap-4`
- Compact widget padding: `p-4`
- No large headings - use subtle section labels