178 lines
11 KiB
Markdown
178 lines
11 KiB
Markdown
|
|
## 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
|