salman/igny8
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

final audit report fo all modules 1

Browse Source
This commit is contained in:
IGNY8 VPS (Salman)
2025-12-27 12:45:40 +00:00
parent 9d54bbff48
commit c44bee7fa7
1 changed files with 449 additions and 285 deletions
Download Patch File Download Diff File Expand all files Collapse all files

734
COMPREHENSIVE-AUDIT-REPORT.md
View File

@@ -1,19 +1,21 @@
# IGNY8 Comprehensive UX Audit & Recommendations # IGNY8 Comprehensive UX Audit & Recommendations
**Date:** December 27, 2025 **Date:** December 27, 2025
**Scope:** Complete application audit for optimal user experience **Scope:** Complete application audit for optimal user experience
**Note:** Plans, billing, credits, usage sections excluded - will be done in separate phase
--- ---
## Table of Contents ## Table of Contents
1. [Site & Sector Selector Placement](#1-site--sector-selector-placement) 1. [Site & Sector Selector Placement](#1-site--sector-selector-placement)
2. [Metrics System Recommendations](#2-metrics-system-recommendations) 2. [Table Action Row Metrics - Tooltip Improvements](#2-table-action-row-metrics---tooltip-improvements)
3. [Progress Modal Steps Audit](#3-progress-modal-steps-audit) 3. [Footer Metrics - 3-Widget Layout](#3-footer-metrics---3-widget-layout)
4. [Dashboard Redesign Plan](#4-dashboard-redesign-plan) 4. [Progress Modal Steps Audit](#4-progress-modal-steps-audit)
5. [Site Setup Checklist Implementation](#5-site-setup-checklist-implementation) 5. [Dashboard Redesign Plan](#5-dashboard-redesign-plan)
6. [To-Do-s Completion Audit](#6-to-do-s-completion-audit) 6. [Site Setup Checklist Implementation](#6-site-setup-checklist-implementation)
7. [Notification System Plan](#7-notification-system-plan) 7. [To-Do-s Completion Audit](#7-to-do-s-completion-audit)
8. [Notification System Plan](#8-notification-system-plan)
--- ---
@@ -76,131 +78,242 @@
--- ---
## 2. Metrics System Recommendations ## 2. Table Action Row Metrics - Tooltip Improvements
### A. Header Metrics Bar (Table Action Row) ### Current State
The metrics in the table action row are already implemented (as shown in screenshot):
- Keywords page: `Keywords 46 | Clustered 10 | Unmapped 0 | Volume 13.6K`
**Current**: Shows Credits + optional page metrics **NO additional metrics should be added to the App Header** - only Credits remains there.
**Problem**: Limited space, unclear what metrics mean, no actionable insights
#### Recommended Header Metrics by Page ### Improvement: Better Actionable Tooltips
##### Keywords Page The current tooltips are basic. Improve them with **actionable context and next-step guidance**:
| Metric | Value Example | Tooltip |
|--------|---------------|---------|
| Keywords | `46` | Total keywords in current view. Add more to expand your content pipeline. |
| Clustered | `10` | Keywords organized into clusters. Unclustered keywords need grouping before idea generation. |
| Unmapped | `0` | Keywords not assigned to clusters. Select unmapped keywords and click "Auto Cluster" to organize them. |
| Volume | `13.6K` | Combined monthly search volume of your keywords. Higher volume = more potential traffic. |
##### Clusters Page #### Keywords Page Metrics Tooltips
| Metric | Value Example | Tooltip |
|--------|---------------|---------|
| Clusters | `12` | Total keyword clusters. Each cluster can generate multiple content ideas. |
| With Ideas | `8` | Clusters that have generated content ideas. Click a cluster without ideas to "Generate Ideas". |
| Avg Size | `4.2` | Average keywords per cluster. 3-7 keywords per cluster is optimal for focused content. |
| Ready | `4` | Clusters ready for idea generation (have keywords, no ideas yet). |
##### Ideas Page | Metric | Current Tooltip | Improved Tooltip |
| Metric | Value Example | Tooltip | |--------|----------------|------------------|
|--------|---------------|---------| | **Keywords** | "Total keywords" | "46 keywords ready for clustering. Select unclustered keywords and click 'Auto Cluster' to organize them into topic groups." |
| Ideas | `34` | Content ideas ready to become articles. Select ideas and click "Create Tasks". | | **Clustered** | "Keywords in clusters" | "10 clusters created. Clusters with 3-7 keywords are optimal. Click on a cluster to generate content ideas from it." |
| Pending | `12` | Ideas not yet converted to tasks. Convert ideas to tasks to begin content creation. | | **Unmapped** | "Unclustered keywords" | "All keywords are clustered! New keywords you add will appear here until clustered." |
| In Tasks | `22` | Ideas already converted to writing tasks. View in Writer → Tasks. | | **Volume** | "Total search volume" | "13.6K combined monthly searches. Higher volume keywords should be prioritized for content creation." |
##### Tasks Page #### Clusters Page Metrics Tooltips
| Metric | Value Example | Tooltip |
|--------|---------------|---------|
| Queue | `15` | Tasks waiting for content generation. Select tasks and click "Generate Content". |
| Processing | `2` | Tasks currently being written by AI. Content will appear in Drafts when complete. |
| Complete | `28` | Tasks with generated content. View and edit in Writer → Content. |
##### Content/Drafts Page | Metric | Current Tooltip | Improved Tooltip |
| Metric | Value Example | Tooltip | |--------|----------------|------------------|
|--------|---------------|---------| | **Clusters** | "Total clusters" | "12 topic clusters available. Each cluster groups related keywords for focused content creation." |
| Drafts | `25` | Content pieces in draft status. Review and approve to move to publishing. | | **With Ideas** | "Clusters with ideas" | "8 clusters have content ideas. Click 'Generate Ideas' on clusters without ideas to plan new content." |
| Pending Images | `8` | Drafts missing images. Select and click "Generate Images" to create visuals. | | **Keywords** | "Total keywords" | "46 keywords organized across clusters. Well-balanced clusters have 3-7 keywords each." |
| Ready to Review | `17` | Drafts with complete content and images. Click "Send to Review" when ready. | | **Ready** | "Ready for ideas" | "4 clusters are ready for idea generation. Select them and click 'Generate Ideas' to create content outlines." |
##### Review Page #### Ideas Page Metrics Tooltips
| Metric | Value Example | Tooltip |
|--------|---------------|---------|
| In Review | `5` | Content awaiting your review. Approve to move to publishing queue. |
| This Week | `12` | Content reviewed this week. Stay on top of reviews to maintain workflow. |
##### Published Page | Metric | Current Tooltip | Improved Tooltip |
| Metric | Value Example | Tooltip | |--------|----------------|------------------|
|--------|---------------|---------| | **Ideas** | "Total ideas" | "34 content ideas generated. Review each idea's outline, then click 'Create Task' to begin content generation." |
| Published | `45` | Content successfully published to WordPress. | | **Pending** | "Not yet tasks" | "12 ideas haven't been converted to tasks yet. Convert ideas to tasks to start the content writing process." |
| This Month | `12` | Content published this billing cycle. | | **In Tasks** | "Converted to tasks" | "22 ideas are now writing tasks. View their progress in Writer → Tasks queue." |
| Total Words | `52.3K` | Total words published. Great for tracking content velocity! |
### B. Module Metrics Footer (Below Tables) #### Tasks Page Metrics Tooltips
**Current Problem**: Cards too large, not enough actionable info, unclear relationship to user's workflow | Metric | Current Tooltip | Improved Tooltip |
|--------|----------------|------------------|
| **Queue** | "Pending tasks" | "15 tasks waiting for content generation. Select tasks and click 'Generate Content' to write articles." |
| **Processing** | "In progress" | "2 tasks are being written by AI. Content will appear in Drafts when complete (~2-3 min each)." |
| **Complete** | "Finished tasks" | "28 tasks have generated content. Review articles in Writer → Content before publishing." |
#### Recommended Footer Design: Compact Information Cards #### Content Page Metrics Tooltips
**New Size**: Reduce card padding from `p-5 md:p-6` to `p-3 md:p-4` | Metric | Current Tooltip | Improved Tooltip |
**Layout**: 4-column grid on desktop, 2-column on tablet, 1-column on mobile |--------|----------------|------------------|
| **Drafts** | "Draft articles" | "25 articles in draft status. Add images and review before sending to the approval queue." |
| **Has Images** | "With images" | "17 articles have images attached. Articles with images get 94% more engagement." |
| **Needs Images** | "Missing images" | "8 articles need images. Select them and click 'Generate Images' to create featured & in-article visuals." |
#### Keywords Page Footer #### Images Page Metrics Tooltips
| Card | Title | Value | Subtitle | Color | Action | | Metric | Current Tooltip | Improved Tooltip |
|------|-------|-------|----------|-------|--------| |--------|----------------|------------------|
| 1 | Total Keywords | `46` | `10 clusters` | blue | → Keywords | | **Total** | "Total images" | "127 images in your library. Each article can have 1 featured image + multiple in-article images." |
| 2 | Clustered | `42` | `91% organized` | green | → Clusters | | **Generated** | "AI generated" | "112 images created by AI. Review generated images and regenerate any that don't match your brand." |
| 3 | Easy Wins | `8` | `Low difficulty, high volume` | orange | Filter low diff | | **Pending** | "Awaiting generation" | "15 image prompts ready. Click 'Generate Images' to create visuals from your approved prompts." |
| 4 | Unmapped | `4` | `Need clustering` | purple | Select unmapped |
**Progress Bar**: `Keyword Pipeline: 91% clustered`
#### Clusters Page Footer
| Card | Title | Value | Subtitle | Color | Action |
|------|-------|-------|----------|-------|--------|
| 1 | Clusters | `12` | `46 keywords` | blue | - |
| 2 | With Ideas | `8` | `67% have ideas` | green | → Ideas |
| 3 | Ready | `4` | `Can generate ideas` | orange | Select ready |
| 4 | Empty | `0` | `No keywords` | purple | - |
**Progress Bar**: `Idea Pipeline: 67% clusters have ideas`
#### Tasks Page Footer
| Card | Title | Value | Subtitle | Color | Action |
|------|-------|-------|----------|-------|--------|
| 1 | Ideas | `34` | `From 12 clusters` | blue | → Planner/Ideas |
| 2 | In Queue | `15` | `Awaiting AI` | orange | - |
| 3 | Processing | `2` | `Writing now` | purple | - |
| 4 | Complete | `28` | `Ready for review` | green | → Content |
**Progress Bar**: `Content Pipeline: 62% tasks complete`
#### Content Page Footer
| Card | Title | Value | Subtitle | Color | Action |
|------|-------|-------|----------|-------|--------|
| 1 | Drafts | `25` | `12.5K words` | blue | - |
| 2 | Has Images | `17` | `68% visual` | green | - |
| 3 | Needs Images | `8` | `Generate images` | orange | Select no images |
| 4 | Ready | `17` | `Complete & ready` | success | Send to review |
**Progress Bar**: `Image Pipeline: 68% have images`
### C. Additional Explainer Text
Add a subtle helper line below metrics footer (optional, can be toggled off):
```
💡 Next step: 8 drafts need images. Select them and click "Generate Images" to complete.
```
This contextual guidance appears based on current data state.
--- ---
## 3. Progress Modal Steps Audit ## 3. Footer Metrics - 3-Widget Layout
### Design: Three-Column Widget Layout
Replace current single metric cards with a **3-widget horizontal layout** (33.3% each):
```
┌─────────────────────────────────────────────────────────────────────────────────────┐
│ WIDGET 1: PAGE METRICS │ WIDGET 2: MODULE STATS │ WIDGET 3: COMPLETION │
│ (Current Page Progress) │ (Full Module Overview) │ (Both Modules Stats) │
│ ~33.3% width │ ~33.3% width │ ~33.3% width │
└─────────────────────────────────────────────────────────────────────────────────────┘
```
### Widget 1: Current Page Metrics (with Combined Progress Bar)
Shows metrics specific to the current page with a single combined progress bar.
#### Keywords Page - Widget 1
```
┌──────────────────────────────────────────────────┐
│ PAGE PROGRESS │
│ │
│ Keywords 46 Clustered 42 (91%) │
│ Unmapped 4 Volume 13.6K │
│ │
│ ████████████████████░░░ 91% Clustered │
│ │
│ 💡 4 keywords ready to cluster │
└──────────────────────────────────────────────────┘
```
#### Clusters Page - Widget 1
```
┌──────────────────────────────────────────────────┐
│ PAGE PROGRESS │
│ │
│ Clusters 12 With Ideas 8 (67%) │
│ Keywords 46 Ready 4 │
│ │
│ ██████████████░░░░░░░ 67% Have Ideas │
│ │
│ 💡 4 clusters ready for idea generation │
└──────────────────────────────────────────────────┘
```
#### Ideas Page - Widget 1
```
┌──────────────────────────────────────────────────┐
│ PAGE PROGRESS │
│ │
│ Ideas 34 In Tasks 22 (65%) │
│ Pending 12 From Clusters 8 │
│ │
│ █████████████░░░░░░░░ 65% Converted │
│ │
│ 💡 12 ideas ready to become tasks │
└──────────────────────────────────────────────────┘
```
#### Tasks Page - Widget 1
```
┌──────────────────────────────────────────────────┐
│ PAGE PROGRESS │
│ │
│ Total 45 Complete 28 (62%) │
│ Queue 15 Processing 2 │
│ │
│ ████████████░░░░░░░░░ 62% Generated │
│ │
│ 💡 15 tasks in queue for content generation │
└──────────────────────────────────────────────────┘
```
#### Content Page - Widget 1
```
┌──────────────────────────────────────────────────┐
│ PAGE PROGRESS │
│ │
│ Drafts 25 Has Images 17 (68%) │
│ Total Words 12.5K Ready 17 │
│ │
│ █████████████░░░░░░░░ 68% Have Images │
│ │
│ 💡 8 drafts need images before review │
└──────────────────────────────────────────────────┘
```
### Widget 2: Module Stats (Same Widget Across Module Pages)
Shows the **complete module overview** with actionable links. Same widget appears on all pages within a module.
#### Planner Module - Widget 2 (shown on Keywords, Clusters, Ideas pages)
```
┌──────────────────────────────────────────────────┐
│ PLANNER MODULE │
│ │
│ Keywords ─────────────────────────────► Clusters │
│ 46 Auto Cluster 12 │
│ ████████████████████░░░ 91% │
│ │
│ Clusters ─────────────────────────────► Ideas │
│ 12 Generate Ideas 34 │
│ █████████████░░░░░░░░░ 67% │
│ │
│ Ideas ────────────────────────────────► Tasks │
│ 34 Create Tasks 22 │
│ █████████████░░░░░░░░░ 65% │
│ │
│ [→ Keywords] [→ Clusters] [→ Ideas] │
└──────────────────────────────────────────────────┘
```
#### Writer Module - Widget 2 (shown on Tasks, Content, Images, Review, Published pages)
```
┌──────────────────────────────────────────────────┐
│ WRITER MODULE │
│ │
│ Tasks ───────────────────────────────► Drafts │
│ 45 Generate Content 28 │
│ ████████████░░░░░░░░░ 62% │
│ │
│ Drafts ──────────────────────────────► Images │
│ 28 Generate Images 17 │
│ █████████████░░░░░░░░ 68% │
│ │
│ Ready ───────────────────────────────► Published │
│ 17 Review & Publish 45 │
│ ████████████████░░░░ 73% │
│ │
│ [→ Tasks] [→ Content] [→ Images] [→ Published] │
└──────────────────────────────────────────────────┘
```
### Widget 3: Both Modules Completion Stats
Shows **completed items from both Planner and Writer** with time filter (7/30/90 days).
```
┌──────────────────────────────────────────────────┐
│ WORKFLOW COMPLETION [7d] [30d] [90d] │
│ │
│ PLANNER │
│ ├─ Keywords Clustered 42 ████████ │
│ ├─ Clusters Created 12 ███ │
│ └─ Ideas Generated 34 ███████ │
│ │
│ WRITER │
│ ├─ Content Generated 28 ██████ │
│ ├─ Images Created 127 █████████ │
│ └─ Articles Published 45 █████████ │
│ │
│ Credits Used: 2,450 │ Operations: 156 │
│ │
│ [View Full Analytics →] │
└──────────────────────────────────────────────────┘
```
### Implementation Notes
- Use existing `Card` component from `components/ui/card`
- Use existing `ProgressBar` component from `components/ui/progress`
- Use standard CSS tokens from `styles/tokens.css`:
- `--color-primary` for primary progress bars
- `--color-success` for completion indicators
- `--color-warning` for attention items
- Grid layout: `grid grid-cols-1 lg:grid-cols-3 gap-4`
- Compact padding: `p-4` instead of `p-6`
---
## 4. Progress Modal Steps Audit
### Current Issues ### Current Issues
- Generic messages lacking context - Generic messages lacking context
@@ -286,163 +399,186 @@ This contextual guidance appears based on current data state.
--- ---
## 4. Dashboard Redesign Plan ## 5. Dashboard Redesign Plan
### Current Issues ### Current Issues
- Too much whitespace - Too much whitespace and large headings
- Large headings with little content - Repeating same counts/metrics without different dimensions
- Workflow guide takes too much space - Missing actionable insights
- Not actionable at a glance - No AI operations analytics
- Missing "needs attention" items - Missing "needs attention" items
- Missing recent activity
### New Dashboard Layout (Compact, Information-Dense) ### 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 if items exist) │ │ ⚠ NEEDS ATTENTION (collapsible, only shows if items exist) │
│ ┌─────────────────────────┐ ┌─────────────────────────┐ ┌─────────────────┐ │ │ ┌────────────────────┐ ┌────────────────────┐ ┌────────────────────┐ │
│ │ 3 content pending review│ │ WP sync failed (Site A) │ │ Credits at 82% │ │ │ │ 3 pending review │ │ WP sync failed │ │ Setup incomplete │ │
│ │ [Review →] │ │ [Retry] [Settings →] │ │ [Upgrade →] │ │ │ │ [Review →] │ │ [Retry] [Fix →] │ │ [Complete →] │ │
│ └─────────────────────────┘ └─────────────────────────┘ └─────────────────┘ │ │ └────────────────────┘ └────────────────────┘ └────────────────────┘ │
├─────────────────────────────────────────────────────────────────────────────┤ ├─────────────────────────────────────────────────────────────────────────────────────┤
│ QUICK STATS (compact 4-6 column row) │ │ │
│ ┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐ │ │ ┌─────────────────────────────────┐ ┌─────────────────────────────────────────┐ │
│ │Sites │ │ KWs │ │Clust │ │Ideas │ │Draft │ │Pub'd │ [Site: ▼ All Sites] │ │ │ WORKFLOW PIPELINE │ │ QUICK ACTIONS │ │
│ │ 2 │ │ 156 │ │ 23 │ │ 67 │ │ 12 │ │ 45 │ │ │ │ │ │ │ │
│ └──────┘ └──────┘ └──────┘ └──────┘ └──────┘ └──────┘ │ │ │ Sites → KWs → Clusters → Ideas │ │ [+ Keywords] [⚡ Cluster] [📝 Content] │ │
├─────────────────────────────────────────────────────────────────────────────┤ │ │ 2 156 23 67 │ │ [🖼 Images] [✓ Review] [🚀 Publish] │ │
│ WORKFLOW PIPELINE (compact horizontal) │ CREDITS │ │ │ ↓ │ │ │ │
│ Sites → Keywords → Clusters → Ideas │ ████████░░░░░ 826/30K │ │ │ Tasks → Drafts → Published │ │ WORKFLOW GUIDE │ │
│ ✓ 156 23 67 │ ~82% remaining │ │ │ 45 28 45 │ │ 1. Add Keywords 5. Generate Content │ │
│ → Content → Published │ Est. 340 articles left │ │ │ │ │ 2. Auto Cluster 6. Generate Images │ │
│ 12 45 │ [View Usage →] │ │ │ ████████████░░░ 72% Complete │ │ 3. Generate Ideas 7. Review & Approve │ │
├────────────────────────────────────────────────┼────────────────────────────┤ │ │ │ │ 4. Create Tasks 8. Publish to WP │ │
│ QUICK ACTIONS (2 column grid) │ WORKFLOW GUIDE │ │ └─────────────────────────────────┘ │ [Full Help →] │ │
│ ┌────────────────┐ ┌────────────────┐ │ 1. Add Keywords → Planner │ │ └─────────────────────────────────────────┘ │
│ │ + Add Keywords │ │ ⚡ Auto Cluster │ │ 2. Cluster → Auto Cluster │ │ │
│ └────────────────┘ └────────────────┘ │ 3. Ideas → Generate Ideas │ ├─────────────────────────────────────────────────────────────────────────────────────┤
│ ┌────────────────┐ ┌────────────────┐ │ 4. Tasks → Create Tasks │ │ │
│ │ 📝 Write Content│ │ 🖼 Gen Images │ │ 5. Content → Generate │ │ ┌─────────────────────────────────┐ ┌─────────────────────────────────────────┐ │
│ └────────────────┘ └────────────────┘ │ 6. Images → Generate │ │ │ AI OPERATIONS (7d) [▼ 30d] │ │ RECENT ACTIVITY │ │
│ ┌────────────────┐ ┌────────────────┐ │ 7. Review → Approve │ │ │ │ │ │ │
│ │ ✓ Review Queue │ │ 🚀 Publish │ │ 8. Publish → WordPress │ │ │ Operation Count Credits │ │ • Clustered 45 keywords → 8 clusters │ │
│ └────────────────┘ └────────────────┘ │ [Full Help →] │ │ │ ───────────────────────────────│ │ 2 hours ago │ │
├────────────────────────────────────────────────┴────────────────────────────┤ │ │ Clustering 8 80 │ │ • Generated 5 articles (4.2K words) │ │
│ RECENT ACTIVITY (compact list, max 5 items) │ │ │ Ideas 12 24 │ │ 4 hours ago │ │
│ • Generated 5 articles from "Product Reviews" cluster 2 hours ago │ │ │ Content 28 1,400 │ │ • Created 15 image prompts │ │
│ • Created 12 image prompts for fitness content 4 hours ago │ │ │ Images 45 225 │ │ Yesterday │ │
│ • Clustered 45 keywords into 8 groups Yesterday │ │ │ ───────────────────────────────│ │ • Published "Best Running Shoes" to WP │ │
│ • Published "10 Best Running Shoes" to WordPress Yesterday │ │ │ Total 93 1,729 │ │ Yesterday │ │
│ • Added 23 keywords from seed database 2 days ago │ │ │ │ │ • Added 23 keywords from seed DB │ │
│ [View All →] │ │ │ Success Rate: 98.5% │ │ 2 days ago │ │
├─────────────────────────────────────────────────────────────────────────────┤ │ │ Avg Credits/Op: 18.6 │ │ │ │
│ AUTOMATION STATUS (if enabled) │ │ └─────────────────────────────────┘ │ [View All Activity →] │ │
│ ● Active Last run: 2h ago Next: Tomorrow 9:00 AM [Configure →] [Run →] │ │ └─────────────────────────────────────────┘ │
└─────────────────────────────────────────────────────────────────────────────┘ │ │
├─────────────────────────────────────────────────────────────────────────────────────┤
│ │
│ ┌─────────────────────────────────┐ ┌─────────────────────────────────────────┐ │
│ │ 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 →] │ │
│ └─────────────────────────────────────────┘ │
│ │
└─────────────────────────────────────────────────────────────────────────────────────┘
``` ```
### Component Specifications ### Widget Specifications
#### 1. NeedsAttention Widget #### 1. Needs Attention Bar
```typescript - Collapsible, only visible when items exist
interface NeedsAttentionItem { - Types: `pending_review`, `sync_failed`, `setup_incomplete`, `automation_failed`
type: 'pending_review' | 'sync_failed' | 'low_credits' | 'setup_incomplete' | 'automation_failed'; - Compact horizontal cards with action buttons
title: string;
count?: number;
actions: Array<{ label: string; href?: string; onClick?: () => void }>;
severity: 'warning' | 'error' | 'info';
}
```
**Triggers:** #### 2. Workflow Pipeline Widget
- `pending_review`: content.review.count > 0 - Visual flow: Sites → Keywords → Clusters → Ideas → Tasks → Drafts → Published
- `sync_failed`: site.wordpress_sync.last_error exists - Shows counts at each stage
- `low_credits`: usage > 80% - Single progress bar for overall completion
- `setup_incomplete`: site.setup_checklist.complete < 100% - Clickable stage names link to respective pages
- `automation_failed`: automation.last_run.status === 'failed'
#### 2. Quick Stats Row #### 3. Quick Actions + Workflow Guide Widget
- Ultra-compact metric chips - 2x3 grid of action buttons (use existing icons)
- Clickable to navigate to relevant page - Compact numbered workflow guide (1-8 steps)
- Shows current site filter or "All Sites"
#### 3. Workflow Pipeline (Compact)
- Single-line visual with numbers under each stage
- Checkmarks for completed stages
- Arrows showing flow direction
- Subtle progress indication
#### 4. Credits Widget (Compact)
- Progress bar with percentage
- Remaining estimate ("~340 articles left" based on avg cost)
- Link to usage page
#### 5. Quick Actions Grid
- 2x3 grid of action buttons
- Icons + short labels
- Direct actions (opens relevant page/modal)
#### 6. Workflow Guide (Compact)
- Numbered list (1-8 steps)
- Each step is a link
- Collapsible on mobile
- "Full Help" link to help page - "Full Help" link to help page
#### 7. Recent Activity #### 4. AI Operations Widget (NEW - from Django Admin Reports)
- Compact list format Shows data from `CreditUsageLog` model:
- Icon + description + timestamp
- Max 5 items with "View All" link
- Real data from AI task logs
#### 8. Automation Status (Conditional)
- Only shows if automation configured
- Status indicator (green dot = active)
- Last run / next run times
- Quick configure/run buttons
### Dashboard API Endpoint
Create aggregated endpoint to reduce API calls:
```typescript ```typescript
// GET /api/v1/dashboard/summary/ interface AIOperationsData {
interface DashboardSummary { period: '7d' | '30d' | '90d';
pipeline: { operations: Array<{
sites: number; type: 'clustering' | 'ideas' | 'content' | 'images';
keywords: number; count: number;
clusters: number; credits: number;
ideas: number;
tasks_pending: number;
content_draft: number;
content_review: number;
content_published: number;
};
credits: {
used: number;
limit: number;
percentage: number;
estimated_remaining_articles: number;
};
needs_attention: NeedsAttentionItem[];
recent_activity: ActivityItem[];
automation: {
enabled: boolean;
status: 'active' | 'paused' | 'failed';
last_run: string | null;
next_run: string | null;
};
sites_setup: Array<{
site_id: number;
site_name: string;
checklist_complete: number; // percentage
}>; }>;
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
--- ---
## 5. Site Setup Checklist Implementation ## 6. Site Setup Checklist Implementation
### Current Status ### Current Status
- ✅ `SiteSetupChecklist.tsx` component EXISTS - ✅ `SiteSetupChecklist.tsx` component EXISTS
@@ -485,7 +621,7 @@ Add compact checklist to each site card:
--- ---
## 6. To-Do-s Completion Audit ## 7. To-Do-s Completion Audit
### Summary by Section ### Summary by Section
@@ -494,10 +630,11 @@ Add compact checklist to each site card:
| Section 1 | `dashboard_mods.md` | 📋 Planned (do LAST) | Dashboard revamp, aggregated API | | Section 1 | `dashboard_mods.md` | 📋 Planned (do LAST) | Dashboard revamp, aggregated API |
| Section 2 | `SECTION_2_FINAL_MODS.md` | ✅ Done | - | | Section 2 | `SECTION_2_FINAL_MODS.md` | ✅ Done | - |
| Section 3 | `SECTION_3_FINAL_MODS.md` | ✅ Done | - | | Section 3 | `SECTION_3_FINAL_MODS.md` | ✅ Done | - |
| Section 4 | `SECTION_4_FINAL_MODS.md` | ✅ Done | Usage alerts, API activity data | | Section 4 | `SECTION_4_FINAL_MODS.md` | ✅ Done | - |
| Section 5 | `SECTION_5_FINAL_MODS.md` | ✅ Done | - | | Section 5 | `SECTION_5_FINAL_MODS.md` | ✅ Done | - |
| Section 6 | `SECTION_6_FINAL_MODS.md` | ✅ Done | - | | Section 6 | `SECTION_6_FINAL_MODS.md` | ✅ Done | - |
| Pricing | `pricing_simplification.md` | 📋 Planned | Credit simplification |
**Note:** Plans, billing, credits, usage improvements moved to separate phase.
### Remaining Items Detail ### Remaining Items Detail
@@ -505,30 +642,20 @@ Add compact checklist to each site card:
- [ ] Aggregated API endpoint `/v1/dashboard/summary/` - [ ] Aggregated API endpoint `/v1/dashboard/summary/`
- [ ] NeedsAttention widget - [ ] NeedsAttention widget
- [ ] Real Recent Activity log (replace hardcoded) - [ ] Real Recent Activity log (replace hardcoded)
- [ ] AI Operations widget (from CreditUsageLog)
- [ ] Content Velocity widget
- [ ] Automation Status display - [ ] Automation Status display
- [ ] Real-time polling/updates
- [ ] Contextual Quick Actions - [ ] Contextual Quick Actions
#### Usage (Section 4) - Minor Work
- [ ] Real API Activity data (currently hardcoded)
- [ ] Real success rate calculation
- [ ] Usage alerts at 80%, 90%, 100%
- [ ] Per-site usage breakdown
- [ ] Usage forecasting
#### Pricing Simplification
- [ ] Remove monthly limit fields (keep credits/keywords/sites only)
- [ ] Update CreditCostConfig values
- [ ] Add `target_word_count` to ContentSettings
- [ ] Update Usage page (credits only)
#### Cross-Module #### Cross-Module
- [ ] Notification bell dropdown with AI run logging - [ ] Notification bell dropdown with AI run logging
- [ ] Single source of truth for credit balance - [ ] 3-widget footer layout for Planner/Writer pages
- [ ] Improved tooltips for table action row metrics
- [ ] Site Setup Checklist on site cards (compact mode)
--- ---
## 7. Notification System Plan ## 8. Notification System Plan
### Current State ### Current State
- Bell icon exists with placeholder/mock notifications - Bell icon exists with placeholder/mock notifications
@@ -726,47 +853,84 @@ Create `/account/notifications` page with:
### Priority Order ### Priority Order
1. **Site Setup Checklist on Cards** - Quick win, already built 1. **Site Setup Checklist on Cards** - Quick win, already built
2. **Notification System** - High user value 2. **Table Action Row Tooltip Improvements** - Quick improvement
3. **Metrics Improvements** - Better user understanding 3. **Footer 3-Widget Layout** - Better workflow visibility
4. **Progress Modal Text** - Polish 4. **Notification System** - High user value
5. **Dashboard Redesign** - Major effort, do last 5. **Progress Modal Text** - Polish
6. **Dashboard Redesign** - Major effort, do last
### Estimated Effort ### Estimated Effort
| Item | Backend | Frontend | Total | | Item | Backend | Frontend | Total |
|------|---------|----------|-------| |------|---------|----------|-------|
| Site checklist on cards | 0h | 2h | 2h | | Site checklist on cards | 0h | 2h | 2h |
| Tooltip improvements | 0h | 4h | 4h |
| Footer 3-widget layout | 2h | 12h | 14h |
| Notification system | 8h | 8h | 16h | | Notification system | 8h | 8h | 16h |
| Metrics improvements | 2h | 8h | 10h |
| Progress modal text | 4h | 4h | 8h | | Progress modal text | 4h | 4h | 8h |
| Dashboard redesign | 8h | 16h | 24h | | Dashboard redesign | 8h | 16h | 24h |
| **Total** | **22h** | **38h** | **60h** | | **Total** | **22h** | **46h** | **68h** |
--- ---
## Appendix: Current vs Recommended Comparison ## Appendix: Current vs Recommended Comparison
### Header Metrics Example (Keywords Page) ### Table Action Row Metrics (Already Implemented)
**Current:** **Current:** Shows metrics in table action row
``` ```
| Credits 826/30K | | Keywords 46 | Clustered 10 | Unmapped 0 | Volume 13.6K |
``` ```
**Recommended:** **Improvement:** Better actionable tooltips with guidance on next steps
```
| Credits 826/30K | Keywords 46 ⓘ | Clustered 10 ⓘ | Unmapped 0 ⓘ | Volume 13.6K ⓘ |
```
### Footer Metrics Example (Keywords Page) ### Footer Metrics Example (Keywords Page)
**Current:** Large cards with minimal info **Current:** Large cards with minimal info
**Recommended:** Compact cards with actionable data + progress bar + next step hint **Recommended:** 3-widget layout:
- Widget 1: Page metrics with combined progress bar
- Widget 2: Full Planner module stats with links
- Widget 3: Both modules completion stats with 7/30/90d filter
### Dashboard Example ### Dashboard Example
**Current:** Hero banner + large sections + much whitespace **Current:** Hero banner + large sections + much whitespace + repeating counts
**Recommended:** Compact info-dense layout with needs-attention, stats, pipeline, actions, activity all visible without scrolling **Recommended:** Compact info-dense layout with:
- Needs Attention bar (only if items exist)
- Workflow Pipeline + Quick Actions/Guide (2 columns)
- AI Operations stats + Recent Activity (2 columns)
- Content Velocity + Automation Status (2 columns)
- All visible without scrolling, different data dimensions
---
## Technical Notes
### Standard Components to Use
From existing codebase:
- `components/ui/card` - Card component
- `components/ui/progress` - ProgressBar component
- `components/ui/button/Button` - Button component
- `components/ui/tooltip/Tooltip` - Tooltip component
- `components/ui/dropdown/Dropdown` - Dropdown component
### Standard CSS Tokens
From `styles/tokens.css`:
```css
--color-primary: #0693e3; /* Primary brand blue */
--color-success: #0bbf87; /* Success green */
--color-warning: #ff7a00; /* Warning orange */
--color-danger: #ef4444; /* Danger red */
--color-purple: #5d4ae3; /* Purple accent */
```
### Do NOT Create
- Inline duplicate styles
- New color variables outside tokens.css
- Duplicate component implementations
- Styles in igny8-colors.css (use tokens.css)