diff --git a/NAVIGATION_REFACTOR_PLAN.md b/NAVIGATION_REFACTOR_PLAN.md new file mode 100644 index 00000000..34a60917 --- /dev/null +++ b/NAVIGATION_REFACTOR_PLAN.md @@ -0,0 +1,630 @@ +# Navigation Refactoring Plan +**Date:** January 17, 2026 +**Objective:** Restructure sidebar navigation to better organize Publisher and Automation features + +--- + +## Current Structure + +``` +DASHBOARD (standalone) + +SETUP +├── Setup Wizard +├── Sites +├── Keyword Library +└── Thinker (admin only) + ├── Prompts + └── Author Profiles + +WORKFLOW +├── Planner +│ ├── Keywords +│ ├── Clusters +│ └── Ideas +├── Writer +│ ├── Content Queue +│ ├── Content Drafts +│ ├── Content Images +│ ├── Content Review +│ └── Content Approved +├── Automation (single page) +└── Content Calendar (single page) + +ACCOUNT +├── Notifications +├── Account Settings +│ ├── Account +│ ├── Profile +│ └── Team +├── Plans & Billing +├── Usage +└── AI Models (admin only) + +HELP +└── Help & Docs +``` + +--- + +## New Structure (UPDATED v2) + +``` +DASHBOARD (standalone) + +SETUP +├── Setup Wizard +├── Sites +├── Keyword Library +└── Thinker (admin only) + ├── Prompts + └── Author Profiles + +WORKFLOW +├── Planner +│ ├── Keywords +│ ├── Clusters +│ └── Ideas +└── Writer + ├── Content Queue + ├── Content Drafts + └── Content Images + +PUBLISHER (NEW DROPDOWN) +├── Content Review +├── Publish / Schedule (formerly "Content Approved") +├── Publish Settings (moved from Sites Settings Publishing tab + works with automation) +└── Content Calendar + +AUTOMATION (NEW DROPDOWN) +├── Overview (NEW - comprehensive dashboard with metrics, costing, run history) +├── Pipeline Settings (new page from ConfigModal - 7 stage toggles + batch config) +└── Run Now (simplified - only stage cards + run controls) + +ACCOUNT (CONSOLIDATED) +├── Account Settings (single page, multiple cards: Account Info, Profile, Team) +├── Plans & Billing +├── Usage +└── AI Models (admin only) + +HELP +├── Notifications (moved from ACCOUNT) +└── Help & Docs +``` + +**Key Changes from v1:** +1. "Publish Settings" moved to PUBLISHER section (better fit - used by both manual publish and automation) +2. "Status" renamed to "Overview" (clearer purpose - comprehensive automation dashboard) +3. "Automation Settings" renamed to "Pipeline Settings" (more descriptive of 7-stage configuration) +4. "AUTOMATION & SCHEDULING" simplified to "AUTOMATION" (shorter, clearer) +5. "Overview" is new comprehensive page similar to site dashboard and homepage + +--- + +## Changes Required (UPDATED) + +### 1. **AppSidebar.tsx** +- Add new "PUBLISHER" section after WORKFLOW +- Add new "AUTOMATION & SCHEDULING" dropdown section after PUBLISHER +- Move "Content Review" from Writer to Publisher +- Rename "Content Approved" to "Publish / Schedule" and move to Publisher +- Move "Content Calendar" to Publisher dropdown +- Create new Automation & Scheduling dropdown with 3 items: + - "Publish/Schedule Settings" (new page) + - "Automation Settings" (new page from modal) + - "Run Now" (renamed from Automation) +- **Consolidate Account Settings**: Remove dropdown, make single page +- **Move Notifications**: From ACCOUNT to HELP section + +### 2. **App.tsx Routes** +- Add route: `/automation` → redirect to `/automation/run-now` +- Add route: `/automation/run-now` → AutomationPage.tsx (rename from /automation) +- Add route: `/automation/settings` → new AutomationSettings.tsx page +- Add route: `/automation/publishing-settings` → new PublishingSettingsPage.tsx +- Update route: `/account/settings` → consolidated AccountSettings.tsx (no sub-routes) +- Remove routes: `/account/settings/profile`, `/account/settings/team` (consolidated) +- Keep existing Writer routes (Content Review and Approved stay as-is) +- Keep existing Publisher route (Content Calendar stays as-is) + +### 3. **New Page: PublishingSettingsPage.tsx** +- Extract Publishing tab content from Sites/Settings.tsx +- **Site Awareness**: Use `SingleSiteSelector` from AppHeader (like Automation) +- Gets site from `useSiteStore().activeSite` (NO URL param) +- Show Publishing Settings form: + - Automation toggles (Auto-Approval, Auto-Publish) + - Limits (Daily, Weekly, Monthly) + - Schedule (Publishing Days, Time Slots, Timezone) +- Save button at bottom +- Breadcrumb: "Automation / Publish Settings" +- Route: `/automation/publishing-settings` + +### 4. **New Page: AutomationSettings.tsx** +- Extract ConfigModal content to standalone page +- Use same layout as other settings pages +- Show AutomationConfig form fields +- Include all 7 stage toggle switches +- Include batch sizes, delays, and schedule settings +- Save button at bottom +- Breadcrumb: "Automation / Settings" +- Route: `/automation/settings` + +### 5. **Update AccountSettings.tsx** (Consolidation) +- Merge Account, Profile, and Team into single page +- Use card-based layout with 3 cards in rows: + - **Account Info Card**: Account name, timezone, plan level + - **Profile Card**: Name, email, avatar, bio + - **Team Card**: Team members list with roles +- Remove tab navigation (no more sub-routes) +- Single route: `/account/settings` +- Breadcrumb: "Account / Settings" + +### 6. **Update Sites/Settings.tsx** +- Remove "Publishing" tab completely +- Keep only: General, Integrations, AI Settings tabs +- Update tab navigation to exclude Publishing +- Remove all Publishing Settings form code (moved to new page) + +### 7. **Site Awareness Analysis (UPDATED)** + +#### Current Implementation: +- **Automation Pages**: Use `SingleSiteSelector` from AppHeader + - Gets site from `useSiteStore().activeSite` + - No URL parameter needed + - Header shows site selector + +- **Publishing Tab (in Site Settings)**: Uses URL parameter + site selector + - Gets site from URL: `/sites/:id/settings` + - Also has `SingleSiteSelector` in header for switching + - Tab content within SiteSettings.tsx + - **ISSUE**: Changing site selector changes all sites' settings (bug) + +- **Content Review & Approved Pages**: Use `SiteAndSectorSelector` + - Gets site AND sector from store + - Different selector component than automation + +#### New Site Awareness Strategy: + +**Pages Moving to Automation & Scheduling:** +1. **Publishing Settings** (`/automation/publishing-settings`) + - **CHANGE**: From URL-based (`/sites/:id/settings`) to store-based + - Use `SingleSiteSelector` in header (like Automation Run Now) + - Gets site from `useSiteStore().activeSite` + - **BENEFIT**: Fixes the bug where changing site in selector affected all sites + - API call: `fetchAPI(\`/v1/integration/sites/\${activeSite.id}/publishing-settings/\`)` + +2. **Automation Settings** (`/automation/settings`) + - Use `SingleSiteSelector` in header (same as Run Now) + - Gets site from `useSiteStore().activeSite` + - API call: `automationService.getConfig(activeSite.id)` + +3. **Automation Run Now** (`/automation/run-now`) + - **NO CHANGE**: Already uses `SingleSiteSelector` + - Gets site from `useSiteStore().activeSite` + +**Pages Staying in Current Location:** +- Content Review (`/writer/review`) - keeps `SiteAndSectorSelector` +- Publish/Schedule (`/writer/approved`) - keeps `SiteAndSectorSelector` +- Content Calendar (`/publisher/content-calendar`) - keeps `SingleSiteSelector` + +**Summary of Site Selector Usage:** +- `SingleSiteSelector`: Automation pages, Content Calendar +- `SiteAndSectorSelector`: Writer pages (Review, Approved) +- No selector: Account pages (no site context) + +--- + +## Revised Plan (UPDATED) + +### What Actually Moves: + +1. **Publishing Settings Tab → PublishingSettingsPage.tsx** + - Extract entire Publishing tab from `/sites/:id/settings` + - New route: `/automation/publishing-settings` + - Change from URL-based to store-based site awareness + - **FIXES BUG**: Site selector will now only affect current view + - Includes: Auto-Approval, Auto-Publish toggles, Limits, Schedule settings + +2. **ConfigModal → AutomationSettings.tsx** + - Extract modal content from AutomationPage + - New route: `/automation/settings` + - Store-based site awareness (like Run Now page) + - Includes: 7 stage toggles, batch sizes, delays, schedule time + +3. **Account Settings Pages → Consolidated AccountSettings.tsx** + - Merge 3 pages (Account, Profile, Team) into 1 + - Remove sub-routes and dropdown + - Use card-based layout (3 cards total) + - Single route: `/account/settings` + +4. **Notifications Menu Item** + - Move from ACCOUNT section to HELP section + - No page changes, just sidebar reorganization + +### What Gets Reorganized in Sidebar: + +**New "PUBLISHER" Section:** +- Content Review (from Writer) +- Publish / Schedule (from Writer, renamed from "Content Approved") +- Content Calendar (from standalone) + +**New "AUTOMATION & SCHEDULING" Section:** +- Publish/Schedule Settings (new page from Sites Settings Publishing tab) +- Automation Settings (new page from ConfigModal) +- Run Now (renamed from "Automation") + +**Updated "ACCOUNT" Section:** +- Account Settings (consolidated, no dropdown) +- Plans & Billing +- Usage +- AI Models (admin only) + +**Updated "HELP" Section:** +- Notifications (moved from ACCOUNT) +- Help & Docs + +--- + +## Implementation Steps (UPDATED) + +### Step 1: Create PublishingSettingsPage.tsx +```tsx +// frontend/src/pages/Automation/PublishingSettingsPage.tsx +// Extract Publishing tab content from Sites/Settings.tsx (lines ~1000-1200) +// Change from URL-based siteId to store-based activeSite +// Use activeSite from useSiteStore() +// Breadcrumb: "Automation / Publish Settings" +// Include: Automation toggles, Limits cards, Schedule card +``` + +### Step 2: Create AutomationSettings.tsx +```tsx +// frontend/src/pages/Automation/AutomationSettings.tsx +// Extract ConfigModal content +// Use activeSite from store +// Breadcrumb: "Automation / Settings" +// Include: 7 stage toggles, batch sizes, delays, schedule time +``` + +### Step 3: Consolidate AccountSettings.tsx +```tsx +// frontend/src/pages/account/AccountSettingsPage.tsx +// Merge Account, Profile, Team into single page +// Remove tab navigation +// Create 3-card layout in rows: +// - Account Info Card (account name, timezone, plan) +// - Profile Card (name, email, avatar, bio) +// - Team Card (members list with roles) +// Single route, no sub-routes +``` + +### Step 4: Update Sites/Settings.tsx +- Remove "Publishing" tab from tabs array +- Remove PublishingSettings state and loading +- Remove loadPublishingSettings() function +- Remove savePublishingSettings() function +- Remove entire Publishing tab JSX (Automation, Limits, Schedule cards) +- Keep only: General, Integrations, AI Settings tabs + +### Step 5: Update AutomationPage.tsx +- Remove ConfigModal import and state +- Remove showConfigModal state +- Remove setShowConfigModal +- Remove "Configure" button from header +- Add "Settings" link/button that navigates to `/automation/settings` +- Keep all existing automation run functionality + +### Step 6: Update App.tsx Routes +```tsx +// Add new Automation routes +} /> +} /> +} /> +} /> + +// Update Account Settings route (remove sub-routes) +} /> +// Remove these: +// } /> +// } /> + +// Existing routes stay as-is +} /> +} /> +} /> +``` + +### Step 7: Update AppSidebar.tsx +```tsx +// Add Publisher section after WORKFLOW +{ + label: "PUBLISHER", + items: [ + { + icon: , + name: "Publisher", + subItems: [ + { name: "Content Review", path: "/writer/review" }, + { name: "Publish / Schedule", path: "/writer/approved" }, + { name: "Content Calendar", path: "/publisher/content-calendar" }, + ], + }, + ], +}, + +// Add Automation & Scheduling section after Publisher +{ + label: "AUTOMATION & SCHEDULING", + items: [ + { + icon: , + name: "Automation", + subItems: [ + { name: "Publish/Schedule Settings", path: "/automation/publishing-settings" }, + { name: "Automation Settings", path: "/automation/settings" }, + { name: "Run Now", path: "/automation/run-now" }, + ], + }, + ], +}, + +// Update Account section - remove dropdown +{ + label: "ACCOUNT", + items: [ + { + icon: , + name: "Account Settings", + path: "/account/settings", // No subItems + }, + { + icon: , + name: "Plans & Billing", + path: "/account/plans", + }, + { + icon: , + name: "Usage", + path: "/account/usage", + }, + { + icon: , + name: "AI Models", + path: "/settings/integration", + adminOnly: true, + }, + ], +}, + +// Update Help section - add Notifications +{ + label: "HELP", + items: [ + { + icon: , + name: "Notifications", + path: "/account/notifications", + }, + { + icon: , + name: "Help & Docs", + path: "/help", + }, + ], +}, +``` + +### Step 8: Update AppHeader.tsx +```tsx +// Add new automation routes to SINGLE_SITE_ROUTES +const SINGLE_SITE_ROUTES = [ + '/automation', // All automation pages + '/publisher', // Content Calendar page + '/account/content-settings', // Content settings and sub-pages + '/sites', // Site dashboard (matches /sites/21, etc.) +]; + +// Remove /account/settings from any site-aware routes (no site context needed) +``` + +--- + +## Testing Checklist (UPDATED) + +- [ ] Syntax error fixed in AutomationPage.tsx +- [ ] PublishingSettingsPage created and loads settings from activeSite +- [ ] PublishingSettingsPage: Site selector changes only current view (bug fixed) +- [ ] AutomationSettings page created and loads config +- [ ] AccountSettings page consolidated (3 cards in single page) +- [ ] Automation Run Now page works without ConfigModal +- [ ] Sites Settings page: Publishing tab removed +- [ ] Sidebar shows Publisher dropdown with 3 items +- [ ] Sidebar shows Automation & Scheduling dropdown with 3 items +- [ ] Sidebar shows Notifications in HELP section +- [ ] Sidebar shows Account Settings without dropdown +- [ ] Content Review accessible from Publisher menu +- [ ] Publish/Schedule accessible from Publisher menu +- [ ] Content Calendar accessible from Publisher menu +- [ ] Publish/Schedule Settings accessible from Automation menu +- [ ] Automation Settings accessible from Automation menu +- [ ] Automation Run Now accessible from Automation menu +- [ ] Account Settings shows all 3 sections in one page +- [ ] All pages retain correct site awareness +- [ ] No broken links or navigation issues +- [ ] Publishing Settings moved successfully from Sites Settings + +--- + +## Files to Modify (UPDATED) + +### CREATE NEW: +1. `/data/app/igny8/frontend/src/pages/Automation/PublishingSettingsPage.tsx` +2. `/data/app/igny8/frontend/src/pages/Automation/AutomationSettings.tsx` + +### MODIFY: +3. `/data/app/igny8/frontend/src/pages/Automation/AutomationPage.tsx` (remove ConfigModal) +4. `/data/app/igny8/frontend/src/pages/Sites/Settings.tsx` (remove Publishing tab) +5. `/data/app/igny8/frontend/src/pages/account/AccountSettingsPage.tsx` (consolidate 3 pages) +6. `/data/app/igny8/frontend/src/App.tsx` (update routes) +7. `/data/app/igny8/frontend/src/layout/AppSidebar.tsx` (restructure menu) +8. `/data/app/igny8/frontend/src/layout/AppHeader.tsx` (update route patterns) + +--- + +## Risk Assessment (UPDATED) + +**Low Risk:** +- Adding new routes +- Adding sidebar sections +- Moving Notifications menu item +- Creating AutomationSettings page + +**Medium Risk:** +- Removing ConfigModal from AutomationPage +- Updating navigation structure +- Consolidating Account Settings pages + +**High Risk:** +- **Moving Publishing Settings from Site Settings to new page** + - Changes site awareness from URL-based to store-based + - Affects how site selector behaves + - Multiple API calls to refactor + - Tab removal from Sites Settings +- **Removing Publishing tab from Sites/Settings.tsx** + - Need to ensure no broken references + - State management changes + +**Mitigation:** +- Test Publishing Settings thoroughly with site selector +- Verify site selector only affects current view (not all sites) +- Keep backup of Sites/Settings.tsx Publishing tab code +- Test all Account Settings cards render correctly +- Ensure all navigation paths work +- Test site awareness on all moved pages + +--- + +## Rollback Plan (UPDATED) + +If critical issues occur: + +1. **Publishing Settings Issues:** + - Revert Sites/Settings.tsx to restore Publishing tab + - Delete PublishingSettingsPage.tsx + - Revert AppSidebar.tsx Automation & Scheduling section + - Remove `/automation/publishing-settings` route from App.tsx + +2. **Account Settings Issues:** + - Revert AccountSettingsPage.tsx to tabbed version + - Restore sub-routes in App.tsx + - Restore Account Settings dropdown in AppSidebar.tsx + +3. **Navigation Issues:** + - Revert App.tsx routes to original + - Revert AppSidebar.tsx to original structure + - Re-add ConfigModal to AutomationPage + +4. **Complete Rollback:** + - Revert all 8 modified files + - Delete 2 new files + - Restart frontend dev server + +--- + +## Additional Considerations + +### API Endpoints to Verify: +1. `/v1/integration/sites/{site_id}/publishing-settings/` (GET, PATCH) +2. `/v1/automation/config/` (GET, PUT) +3. Account settings endpoints (verify no breaking changes) + +### UI/UX Improvements: +1. Add "Settings" link in Automation Run Now page header +2. Add navigation helper text in Publishing Settings +3. Ensure breadcrumbs are consistent +4. Add loading states for all new pages + +### Documentation Updates Needed: +1. Update PAGES.md with new routes +2. Update navigation screenshots +3. Document site awareness changes +4. Update CHANGELOG.md with v1.3.3 changes + +--- + +## Summary of Key Changes + +### 1. **Publishing Settings Liberation** + - **Problem Fixed**: Site selector in `/sites/:id/settings?tab=publishing` was changing settings for ALL sites + - **Solution**: Move to `/automation/publishing-settings` with store-based site awareness + - **Benefit**: Site selector now only affects current view, not all sites globally + +### 2. **Automation Organization** + - **Before**: Single "Automation" page with config modal + - **After**: Dropdown with 3 pages: + - Publish/Schedule Settings (publishing automation) + - Automation Settings (pipeline config) + - Run Now (manual execution) + +### 3. **Publisher Centralization** + - **Concept**: Group all publishing-related pages together + - **Pages**: Content Review, Publish/Schedule, Content Calendar + - **Benefit**: Clearer workflow from review → approve → schedule → publish + +### 4. **Account Simplification** + - **Before**: 3 separate pages (Account, Profile, Team) with dropdown + - **After**: 1 consolidated page with 3 cards + - **Benefit**: Faster access, less navigation overhead + +### 5. **Notifications Relocation** + - **Move**: From ACCOUNT to HELP section + - **Reasoning**: Notifications are more of a communication/help tool than account management + +--- + +## Implementation Priority + +### Phase 1 (Critical - Fix Publishing Settings Bug): +1. Create PublishingSettingsPage.tsx +2. Remove Publishing tab from Sites/Settings.tsx +3. Update routes in App.tsx +4. Update sidebar with Automation & Scheduling section +5. Test site selector behavior + +### Phase 2 (Important - Automation Organization): +1. Create AutomationSettings.tsx +2. Update AutomationPage.tsx (remove modal) +3. Update routes and sidebar +4. Test all automation pages + +### Phase 3 (Enhancement - Account Consolidation): +1. Update AccountSettingsPage.tsx (merge 3 pages) +2. Remove sub-routes +3. Update sidebar (remove dropdown) +4. Test all account functionality + +### Phase 4 (Polish - Navigation Refinement): +1. Move Notifications to HELP +2. Add Publisher dropdown +3. Test complete navigation flow +4. Update documentation + +--- + +## Ready to Implement? + +**Review Checklist:** +- [x] Plan reviewed and updated +- [x] Site awareness strategy clarified +- [x] Risk assessment complete +- [x] Rollback plan documented +- [ ] **Awaiting approval to begin implementation** + +**Estimated Implementation Time:** +- Phase 1: 2-3 hours +- Phase 2: 1-2 hours +- Phase 3: 1-2 hours +- Phase 4: 30 minutes +- **Total: 5-8 hours** + +--- + diff --git a/NAVIGATION_REFACTOR_PLAN_BACKUP.md b/NAVIGATION_REFACTOR_PLAN_BACKUP.md new file mode 100644 index 00000000..34a60917 --- /dev/null +++ b/NAVIGATION_REFACTOR_PLAN_BACKUP.md @@ -0,0 +1,630 @@ +# Navigation Refactoring Plan +**Date:** January 17, 2026 +**Objective:** Restructure sidebar navigation to better organize Publisher and Automation features + +--- + +## Current Structure + +``` +DASHBOARD (standalone) + +SETUP +├── Setup Wizard +├── Sites +├── Keyword Library +└── Thinker (admin only) + ├── Prompts + └── Author Profiles + +WORKFLOW +├── Planner +│ ├── Keywords +│ ├── Clusters +│ └── Ideas +├── Writer +│ ├── Content Queue +│ ├── Content Drafts +│ ├── Content Images +│ ├── Content Review +│ └── Content Approved +├── Automation (single page) +└── Content Calendar (single page) + +ACCOUNT +├── Notifications +├── Account Settings +│ ├── Account +│ ├── Profile +│ └── Team +├── Plans & Billing +├── Usage +└── AI Models (admin only) + +HELP +└── Help & Docs +``` + +--- + +## New Structure (UPDATED v2) + +``` +DASHBOARD (standalone) + +SETUP +├── Setup Wizard +├── Sites +├── Keyword Library +└── Thinker (admin only) + ├── Prompts + └── Author Profiles + +WORKFLOW +├── Planner +│ ├── Keywords +│ ├── Clusters +│ └── Ideas +└── Writer + ├── Content Queue + ├── Content Drafts + └── Content Images + +PUBLISHER (NEW DROPDOWN) +├── Content Review +├── Publish / Schedule (formerly "Content Approved") +├── Publish Settings (moved from Sites Settings Publishing tab + works with automation) +└── Content Calendar + +AUTOMATION (NEW DROPDOWN) +├── Overview (NEW - comprehensive dashboard with metrics, costing, run history) +├── Pipeline Settings (new page from ConfigModal - 7 stage toggles + batch config) +└── Run Now (simplified - only stage cards + run controls) + +ACCOUNT (CONSOLIDATED) +├── Account Settings (single page, multiple cards: Account Info, Profile, Team) +├── Plans & Billing +├── Usage +└── AI Models (admin only) + +HELP +├── Notifications (moved from ACCOUNT) +└── Help & Docs +``` + +**Key Changes from v1:** +1. "Publish Settings" moved to PUBLISHER section (better fit - used by both manual publish and automation) +2. "Status" renamed to "Overview" (clearer purpose - comprehensive automation dashboard) +3. "Automation Settings" renamed to "Pipeline Settings" (more descriptive of 7-stage configuration) +4. "AUTOMATION & SCHEDULING" simplified to "AUTOMATION" (shorter, clearer) +5. "Overview" is new comprehensive page similar to site dashboard and homepage + +--- + +## Changes Required (UPDATED) + +### 1. **AppSidebar.tsx** +- Add new "PUBLISHER" section after WORKFLOW +- Add new "AUTOMATION & SCHEDULING" dropdown section after PUBLISHER +- Move "Content Review" from Writer to Publisher +- Rename "Content Approved" to "Publish / Schedule" and move to Publisher +- Move "Content Calendar" to Publisher dropdown +- Create new Automation & Scheduling dropdown with 3 items: + - "Publish/Schedule Settings" (new page) + - "Automation Settings" (new page from modal) + - "Run Now" (renamed from Automation) +- **Consolidate Account Settings**: Remove dropdown, make single page +- **Move Notifications**: From ACCOUNT to HELP section + +### 2. **App.tsx Routes** +- Add route: `/automation` → redirect to `/automation/run-now` +- Add route: `/automation/run-now` → AutomationPage.tsx (rename from /automation) +- Add route: `/automation/settings` → new AutomationSettings.tsx page +- Add route: `/automation/publishing-settings` → new PublishingSettingsPage.tsx +- Update route: `/account/settings` → consolidated AccountSettings.tsx (no sub-routes) +- Remove routes: `/account/settings/profile`, `/account/settings/team` (consolidated) +- Keep existing Writer routes (Content Review and Approved stay as-is) +- Keep existing Publisher route (Content Calendar stays as-is) + +### 3. **New Page: PublishingSettingsPage.tsx** +- Extract Publishing tab content from Sites/Settings.tsx +- **Site Awareness**: Use `SingleSiteSelector` from AppHeader (like Automation) +- Gets site from `useSiteStore().activeSite` (NO URL param) +- Show Publishing Settings form: + - Automation toggles (Auto-Approval, Auto-Publish) + - Limits (Daily, Weekly, Monthly) + - Schedule (Publishing Days, Time Slots, Timezone) +- Save button at bottom +- Breadcrumb: "Automation / Publish Settings" +- Route: `/automation/publishing-settings` + +### 4. **New Page: AutomationSettings.tsx** +- Extract ConfigModal content to standalone page +- Use same layout as other settings pages +- Show AutomationConfig form fields +- Include all 7 stage toggle switches +- Include batch sizes, delays, and schedule settings +- Save button at bottom +- Breadcrumb: "Automation / Settings" +- Route: `/automation/settings` + +### 5. **Update AccountSettings.tsx** (Consolidation) +- Merge Account, Profile, and Team into single page +- Use card-based layout with 3 cards in rows: + - **Account Info Card**: Account name, timezone, plan level + - **Profile Card**: Name, email, avatar, bio + - **Team Card**: Team members list with roles +- Remove tab navigation (no more sub-routes) +- Single route: `/account/settings` +- Breadcrumb: "Account / Settings" + +### 6. **Update Sites/Settings.tsx** +- Remove "Publishing" tab completely +- Keep only: General, Integrations, AI Settings tabs +- Update tab navigation to exclude Publishing +- Remove all Publishing Settings form code (moved to new page) + +### 7. **Site Awareness Analysis (UPDATED)** + +#### Current Implementation: +- **Automation Pages**: Use `SingleSiteSelector` from AppHeader + - Gets site from `useSiteStore().activeSite` + - No URL parameter needed + - Header shows site selector + +- **Publishing Tab (in Site Settings)**: Uses URL parameter + site selector + - Gets site from URL: `/sites/:id/settings` + - Also has `SingleSiteSelector` in header for switching + - Tab content within SiteSettings.tsx + - **ISSUE**: Changing site selector changes all sites' settings (bug) + +- **Content Review & Approved Pages**: Use `SiteAndSectorSelector` + - Gets site AND sector from store + - Different selector component than automation + +#### New Site Awareness Strategy: + +**Pages Moving to Automation & Scheduling:** +1. **Publishing Settings** (`/automation/publishing-settings`) + - **CHANGE**: From URL-based (`/sites/:id/settings`) to store-based + - Use `SingleSiteSelector` in header (like Automation Run Now) + - Gets site from `useSiteStore().activeSite` + - **BENEFIT**: Fixes the bug where changing site in selector affected all sites + - API call: `fetchAPI(\`/v1/integration/sites/\${activeSite.id}/publishing-settings/\`)` + +2. **Automation Settings** (`/automation/settings`) + - Use `SingleSiteSelector` in header (same as Run Now) + - Gets site from `useSiteStore().activeSite` + - API call: `automationService.getConfig(activeSite.id)` + +3. **Automation Run Now** (`/automation/run-now`) + - **NO CHANGE**: Already uses `SingleSiteSelector` + - Gets site from `useSiteStore().activeSite` + +**Pages Staying in Current Location:** +- Content Review (`/writer/review`) - keeps `SiteAndSectorSelector` +- Publish/Schedule (`/writer/approved`) - keeps `SiteAndSectorSelector` +- Content Calendar (`/publisher/content-calendar`) - keeps `SingleSiteSelector` + +**Summary of Site Selector Usage:** +- `SingleSiteSelector`: Automation pages, Content Calendar +- `SiteAndSectorSelector`: Writer pages (Review, Approved) +- No selector: Account pages (no site context) + +--- + +## Revised Plan (UPDATED) + +### What Actually Moves: + +1. **Publishing Settings Tab → PublishingSettingsPage.tsx** + - Extract entire Publishing tab from `/sites/:id/settings` + - New route: `/automation/publishing-settings` + - Change from URL-based to store-based site awareness + - **FIXES BUG**: Site selector will now only affect current view + - Includes: Auto-Approval, Auto-Publish toggles, Limits, Schedule settings + +2. **ConfigModal → AutomationSettings.tsx** + - Extract modal content from AutomationPage + - New route: `/automation/settings` + - Store-based site awareness (like Run Now page) + - Includes: 7 stage toggles, batch sizes, delays, schedule time + +3. **Account Settings Pages → Consolidated AccountSettings.tsx** + - Merge 3 pages (Account, Profile, Team) into 1 + - Remove sub-routes and dropdown + - Use card-based layout (3 cards total) + - Single route: `/account/settings` + +4. **Notifications Menu Item** + - Move from ACCOUNT section to HELP section + - No page changes, just sidebar reorganization + +### What Gets Reorganized in Sidebar: + +**New "PUBLISHER" Section:** +- Content Review (from Writer) +- Publish / Schedule (from Writer, renamed from "Content Approved") +- Content Calendar (from standalone) + +**New "AUTOMATION & SCHEDULING" Section:** +- Publish/Schedule Settings (new page from Sites Settings Publishing tab) +- Automation Settings (new page from ConfigModal) +- Run Now (renamed from "Automation") + +**Updated "ACCOUNT" Section:** +- Account Settings (consolidated, no dropdown) +- Plans & Billing +- Usage +- AI Models (admin only) + +**Updated "HELP" Section:** +- Notifications (moved from ACCOUNT) +- Help & Docs + +--- + +## Implementation Steps (UPDATED) + +### Step 1: Create PublishingSettingsPage.tsx +```tsx +// frontend/src/pages/Automation/PublishingSettingsPage.tsx +// Extract Publishing tab content from Sites/Settings.tsx (lines ~1000-1200) +// Change from URL-based siteId to store-based activeSite +// Use activeSite from useSiteStore() +// Breadcrumb: "Automation / Publish Settings" +// Include: Automation toggles, Limits cards, Schedule card +``` + +### Step 2: Create AutomationSettings.tsx +```tsx +// frontend/src/pages/Automation/AutomationSettings.tsx +// Extract ConfigModal content +// Use activeSite from store +// Breadcrumb: "Automation / Settings" +// Include: 7 stage toggles, batch sizes, delays, schedule time +``` + +### Step 3: Consolidate AccountSettings.tsx +```tsx +// frontend/src/pages/account/AccountSettingsPage.tsx +// Merge Account, Profile, Team into single page +// Remove tab navigation +// Create 3-card layout in rows: +// - Account Info Card (account name, timezone, plan) +// - Profile Card (name, email, avatar, bio) +// - Team Card (members list with roles) +// Single route, no sub-routes +``` + +### Step 4: Update Sites/Settings.tsx +- Remove "Publishing" tab from tabs array +- Remove PublishingSettings state and loading +- Remove loadPublishingSettings() function +- Remove savePublishingSettings() function +- Remove entire Publishing tab JSX (Automation, Limits, Schedule cards) +- Keep only: General, Integrations, AI Settings tabs + +### Step 5: Update AutomationPage.tsx +- Remove ConfigModal import and state +- Remove showConfigModal state +- Remove setShowConfigModal +- Remove "Configure" button from header +- Add "Settings" link/button that navigates to `/automation/settings` +- Keep all existing automation run functionality + +### Step 6: Update App.tsx Routes +```tsx +// Add new Automation routes +} /> +} /> +} /> +} /> + +// Update Account Settings route (remove sub-routes) +} /> +// Remove these: +// } /> +// } /> + +// Existing routes stay as-is +} /> +} /> +} /> +``` + +### Step 7: Update AppSidebar.tsx +```tsx +// Add Publisher section after WORKFLOW +{ + label: "PUBLISHER", + items: [ + { + icon: , + name: "Publisher", + subItems: [ + { name: "Content Review", path: "/writer/review" }, + { name: "Publish / Schedule", path: "/writer/approved" }, + { name: "Content Calendar", path: "/publisher/content-calendar" }, + ], + }, + ], +}, + +// Add Automation & Scheduling section after Publisher +{ + label: "AUTOMATION & SCHEDULING", + items: [ + { + icon: , + name: "Automation", + subItems: [ + { name: "Publish/Schedule Settings", path: "/automation/publishing-settings" }, + { name: "Automation Settings", path: "/automation/settings" }, + { name: "Run Now", path: "/automation/run-now" }, + ], + }, + ], +}, + +// Update Account section - remove dropdown +{ + label: "ACCOUNT", + items: [ + { + icon: , + name: "Account Settings", + path: "/account/settings", // No subItems + }, + { + icon: , + name: "Plans & Billing", + path: "/account/plans", + }, + { + icon: , + name: "Usage", + path: "/account/usage", + }, + { + icon: , + name: "AI Models", + path: "/settings/integration", + adminOnly: true, + }, + ], +}, + +// Update Help section - add Notifications +{ + label: "HELP", + items: [ + { + icon: , + name: "Notifications", + path: "/account/notifications", + }, + { + icon: , + name: "Help & Docs", + path: "/help", + }, + ], +}, +``` + +### Step 8: Update AppHeader.tsx +```tsx +// Add new automation routes to SINGLE_SITE_ROUTES +const SINGLE_SITE_ROUTES = [ + '/automation', // All automation pages + '/publisher', // Content Calendar page + '/account/content-settings', // Content settings and sub-pages + '/sites', // Site dashboard (matches /sites/21, etc.) +]; + +// Remove /account/settings from any site-aware routes (no site context needed) +``` + +--- + +## Testing Checklist (UPDATED) + +- [ ] Syntax error fixed in AutomationPage.tsx +- [ ] PublishingSettingsPage created and loads settings from activeSite +- [ ] PublishingSettingsPage: Site selector changes only current view (bug fixed) +- [ ] AutomationSettings page created and loads config +- [ ] AccountSettings page consolidated (3 cards in single page) +- [ ] Automation Run Now page works without ConfigModal +- [ ] Sites Settings page: Publishing tab removed +- [ ] Sidebar shows Publisher dropdown with 3 items +- [ ] Sidebar shows Automation & Scheduling dropdown with 3 items +- [ ] Sidebar shows Notifications in HELP section +- [ ] Sidebar shows Account Settings without dropdown +- [ ] Content Review accessible from Publisher menu +- [ ] Publish/Schedule accessible from Publisher menu +- [ ] Content Calendar accessible from Publisher menu +- [ ] Publish/Schedule Settings accessible from Automation menu +- [ ] Automation Settings accessible from Automation menu +- [ ] Automation Run Now accessible from Automation menu +- [ ] Account Settings shows all 3 sections in one page +- [ ] All pages retain correct site awareness +- [ ] No broken links or navigation issues +- [ ] Publishing Settings moved successfully from Sites Settings + +--- + +## Files to Modify (UPDATED) + +### CREATE NEW: +1. `/data/app/igny8/frontend/src/pages/Automation/PublishingSettingsPage.tsx` +2. `/data/app/igny8/frontend/src/pages/Automation/AutomationSettings.tsx` + +### MODIFY: +3. `/data/app/igny8/frontend/src/pages/Automation/AutomationPage.tsx` (remove ConfigModal) +4. `/data/app/igny8/frontend/src/pages/Sites/Settings.tsx` (remove Publishing tab) +5. `/data/app/igny8/frontend/src/pages/account/AccountSettingsPage.tsx` (consolidate 3 pages) +6. `/data/app/igny8/frontend/src/App.tsx` (update routes) +7. `/data/app/igny8/frontend/src/layout/AppSidebar.tsx` (restructure menu) +8. `/data/app/igny8/frontend/src/layout/AppHeader.tsx` (update route patterns) + +--- + +## Risk Assessment (UPDATED) + +**Low Risk:** +- Adding new routes +- Adding sidebar sections +- Moving Notifications menu item +- Creating AutomationSettings page + +**Medium Risk:** +- Removing ConfigModal from AutomationPage +- Updating navigation structure +- Consolidating Account Settings pages + +**High Risk:** +- **Moving Publishing Settings from Site Settings to new page** + - Changes site awareness from URL-based to store-based + - Affects how site selector behaves + - Multiple API calls to refactor + - Tab removal from Sites Settings +- **Removing Publishing tab from Sites/Settings.tsx** + - Need to ensure no broken references + - State management changes + +**Mitigation:** +- Test Publishing Settings thoroughly with site selector +- Verify site selector only affects current view (not all sites) +- Keep backup of Sites/Settings.tsx Publishing tab code +- Test all Account Settings cards render correctly +- Ensure all navigation paths work +- Test site awareness on all moved pages + +--- + +## Rollback Plan (UPDATED) + +If critical issues occur: + +1. **Publishing Settings Issues:** + - Revert Sites/Settings.tsx to restore Publishing tab + - Delete PublishingSettingsPage.tsx + - Revert AppSidebar.tsx Automation & Scheduling section + - Remove `/automation/publishing-settings` route from App.tsx + +2. **Account Settings Issues:** + - Revert AccountSettingsPage.tsx to tabbed version + - Restore sub-routes in App.tsx + - Restore Account Settings dropdown in AppSidebar.tsx + +3. **Navigation Issues:** + - Revert App.tsx routes to original + - Revert AppSidebar.tsx to original structure + - Re-add ConfigModal to AutomationPage + +4. **Complete Rollback:** + - Revert all 8 modified files + - Delete 2 new files + - Restart frontend dev server + +--- + +## Additional Considerations + +### API Endpoints to Verify: +1. `/v1/integration/sites/{site_id}/publishing-settings/` (GET, PATCH) +2. `/v1/automation/config/` (GET, PUT) +3. Account settings endpoints (verify no breaking changes) + +### UI/UX Improvements: +1. Add "Settings" link in Automation Run Now page header +2. Add navigation helper text in Publishing Settings +3. Ensure breadcrumbs are consistent +4. Add loading states for all new pages + +### Documentation Updates Needed: +1. Update PAGES.md with new routes +2. Update navigation screenshots +3. Document site awareness changes +4. Update CHANGELOG.md with v1.3.3 changes + +--- + +## Summary of Key Changes + +### 1. **Publishing Settings Liberation** + - **Problem Fixed**: Site selector in `/sites/:id/settings?tab=publishing` was changing settings for ALL sites + - **Solution**: Move to `/automation/publishing-settings` with store-based site awareness + - **Benefit**: Site selector now only affects current view, not all sites globally + +### 2. **Automation Organization** + - **Before**: Single "Automation" page with config modal + - **After**: Dropdown with 3 pages: + - Publish/Schedule Settings (publishing automation) + - Automation Settings (pipeline config) + - Run Now (manual execution) + +### 3. **Publisher Centralization** + - **Concept**: Group all publishing-related pages together + - **Pages**: Content Review, Publish/Schedule, Content Calendar + - **Benefit**: Clearer workflow from review → approve → schedule → publish + +### 4. **Account Simplification** + - **Before**: 3 separate pages (Account, Profile, Team) with dropdown + - **After**: 1 consolidated page with 3 cards + - **Benefit**: Faster access, less navigation overhead + +### 5. **Notifications Relocation** + - **Move**: From ACCOUNT to HELP section + - **Reasoning**: Notifications are more of a communication/help tool than account management + +--- + +## Implementation Priority + +### Phase 1 (Critical - Fix Publishing Settings Bug): +1. Create PublishingSettingsPage.tsx +2. Remove Publishing tab from Sites/Settings.tsx +3. Update routes in App.tsx +4. Update sidebar with Automation & Scheduling section +5. Test site selector behavior + +### Phase 2 (Important - Automation Organization): +1. Create AutomationSettings.tsx +2. Update AutomationPage.tsx (remove modal) +3. Update routes and sidebar +4. Test all automation pages + +### Phase 3 (Enhancement - Account Consolidation): +1. Update AccountSettingsPage.tsx (merge 3 pages) +2. Remove sub-routes +3. Update sidebar (remove dropdown) +4. Test all account functionality + +### Phase 4 (Polish - Navigation Refinement): +1. Move Notifications to HELP +2. Add Publisher dropdown +3. Test complete navigation flow +4. Update documentation + +--- + +## Ready to Implement? + +**Review Checklist:** +- [x] Plan reviewed and updated +- [x] Site awareness strategy clarified +- [x] Risk assessment complete +- [x] Rollback plan documented +- [ ] **Awaiting approval to begin implementation** + +**Estimated Implementation Time:** +- Phase 1: 2-3 hours +- Phase 2: 1-2 hours +- Phase 3: 1-2 hours +- Phase 4: 30 minutes +- **Total: 5-8 hours** + +--- + diff --git a/NAVIGATION_REFACTOR_PLAN_V2.md b/NAVIGATION_REFACTOR_PLAN_V2.md new file mode 100644 index 00000000..cfbce0e6 --- /dev/null +++ b/NAVIGATION_REFACTOR_PLAN_V2.md @@ -0,0 +1,613 @@ +# Navigation Refactoring Plan v2 +**Date:** January 17, 2026 (Updated) +**Objective:** Restructure sidebar navigation + create comprehensive Automation Overview dashboard + +--- + +## Executive Summary + +### What's Changing: +1. **Publisher Section Created** - Groups all publishing-related pages (Review → Approve → Schedule → Settings) +2. **Automation Reorganized** - 3 focused pages (Overview dashboard, Pipeline Settings, Run Now) +3. **Publish Settings Moved** - From Sites Settings to Publisher section (better logical fit) +4. **Overview Dashboard Created** - NEW comprehensive automation status/metrics/history page +5. **Account Consolidated** - 3 pages merged into 1 with card layout +6. **Notifications Moved** - From ACCOUNT to HELP section + +### Key Benefits: +- **Transparency**: New Overview page shows complete automation details (what was processed, costs, status) +- **Organization**: Logical grouping of related features +- **Simplification**: Run Now page simplified, Account pages consolidated +- **Bug Fix**: Publish Settings site selector will work correctly (store-based instead of URL-based) + +--- + +## New Structure + +``` +DASHBOARD (standalone) + +SETUP +├── Setup Wizard +├── Sites +├── Keyword Library +└── Thinker (admin only) + ├── Prompts + └── Author Profiles + +WORKFLOW +├── Planner +│ ├── Keywords +│ ├── Clusters +│ └── Ideas +└── Writer + ├── Content Queue + ├── Content Drafts + └── Content Images + +PUBLISHER (NEW DROPDOWN) +├── Content Review +├── Publish / Schedule +├── Publish Settings (moved from Sites Settings) +└── Content Calendar + +AUTOMATION (NEW DROPDOWN) +├── Overview (NEW comprehensive dashboard) +├── Pipeline Settings (from ConfigModal) +└── Run Now (simplified) + +ACCOUNT (CONSOLIDATED) +├── Account Settings (single page with 3 cards) +├── Plans & Billing +├── Usage +└── AI Models (admin only) + +HELP +├── Notifications (moved from ACCOUNT) +└── Help & Docs +``` + +--- + +## Detailed Page Breakdown + +### 1. Automation Overview Page (NEW) +**Route:** `/automation/overview` or `/automation` +**Purpose:** Comprehensive automation dashboard - similar to site dashboard and homepage + +**Content Sections:** + +#### A. Current Configuration Status Cards +``` +┌─────────────┬─────────────┬─────────────┬─────────────┬─────────────┐ +│ Keywords │ Clusters │ Ideas │ Tasks │ Content │ +│ 265 │ 27 │ 127 │ 0 │ 127 │ +│ New: 3 │ New: 0 │ New: 0 │ │ Draft: 66 │ +│ Mapped:265 │ Mapped: 27 │ Queued: 0 │ │ Review: 0 │ +│ │ │ Done: 127 │ │ Publish:61 │ +└─────────────┴─────────────┴─────────────┴─────────────┴─────────────┘ +``` +(These are the 5 metric cards currently on Run Now page) + +#### B. Processable Items & Cost Estimation (NEW) +**Card: "Ready to Process"** +- Show what items can be processed right now per stage +- Estimated output (how many items each stage will create) +- Individual cost per stage (credits) +- Total estimated cost +- Current credit balance +- Sufficient credits indicator + +Example: +``` +Stage 1: Keywords → Clusters + Input: 3 new keywords + Output: ~1-2 clusters expected + Cost: 150 credits + Status: ✓ Ready + +Stage 2: Clusters → Ideas + Input: 0 new clusters + Output: 0 ideas expected + Cost: 0 credits + Status: ⊗ Nothing to process + +... (continue for all 7 stages) + +TOTAL COST: 450 credits +Current Balance: 3,174 credits +Status: ✓ Sufficient credits +``` + +#### C. Last Automation Run - Detailed View (NEW) +**Card: "Last Run Details"** +Show complete breakdown of most recent run: +``` +Run ID: #1234 +Started: Jan 17, 2026 7:35 PM +Duration: 12 minutes +Status: Completed ✓ +Trigger: Manual + +┌──────────┬──────────┬──────────┬───────────┬────────┐ +│ Stage │ Processed│ Created │ Credits │ Status │ +├──────────┼──────────┼──────────┼───────────┼────────┤ +│ Stage 1 │ 3 │ 0 │ 0 │ ✓ │ +│ Stage 2 │ 0 │ 0 │ 0 │ Skip │ +│ Stage 3 │ 127 │ 0 │ 0 │ ✓ │ +│ Stage 4 │ 0 │ 0 │ 0 │ Skip │ +│ Stage 5 │ 0 │ 0 │ 0 │ Skip │ +│ Stage 6 │ 281 │ 315 │ 945 │ ✓ │ +│ Stage 7 │ 0 │ 0 │ 0 │ Skip │ +│ Stage 8 │ 61 │ 42 │ 0 │ ✓ │ +├──────────┼──────────┼──────────┼───────────┼────────┤ +│ TOTAL │ 472 │ 357 │ 945 │ ✓ │ +└──────────┴──────────┴──────────┴───────────┴────────┘ + +Output Status Breakdown: +- Draft: 66 items +- Review: 0 items +- Approved: 16 items +- Scheduled: 42 items +- Published: 3 items +``` + +#### D. Run History Table (MOVED from Run Now page) +**Card: "Automation Run History"** +- Last 10-20 automation runs +- Columns: Run ID, Trigger (Manual/Scheduled), Started, Duration, Status, Items Processed, Credits Used +- Click row to see detailed breakdown (expand or modal) +- Filter: All / Manual / Scheduled / Failed + +Example: +``` +┌─────┬───────────┬──────────────┬──────────┬───────────┬───────────┬────────────┐ +│ ID │ Trigger │ Started │ Duration │ Status │ Processed │ Credits │ +├─────┼───────────┼──────────────┼──────────┼───────────┼───────────┼────────────┤ +│1234 │ Manual │ Jan 17 19:35 │ 12 min │ Completed │ 472 │ 945 │ +│1233 │ Scheduled │ Jan 17 19:35 │ 8 min │ Completed │ 234 │ 420 │ +│1232 │ Manual │ Jan 16 14:22 │ 15 min │ Failed │ 156 │ 280 │ +└─────┴───────────┴──────────────┴──────────┴───────────┴───────────┴────────────┘ +``` + +**Technology:** +- Reuse existing metrics loading logic from AutomationPage +- Reuse RunHistory component +- Add new API endpoint or extend existing: `/api/v1/automation/overview/` + - Returns: metrics, cost estimation, last run details, run history + + +### 2. Automation Pipeline Settings Page (NEW) +**Route:** `/automation/pipeline-settings` or `/automation/settings` +**Purpose:** Configure 7-stage automation pipeline (extract from ConfigModal) + +**Content:** +- **Stage Processing Section** (7 checkboxes for stage enable/disable) +- **Batch Sizes Section** (7 input fields for stage batch sizes) +- **Timing Section**: + - Within-stage delay + - Between-stage delay +- **Schedule Section**: + - Enable/Disable toggle + - Frequency dropdown (Daily/Weekly/Monthly) + - Schedule time picker +- **Save button** at bottom + +**Technology:** +- Extract all content from ConfigModal component +- Use same AutomationConfig API +- Breadcrumb: "Automation / Pipeline Settings" +- Site awareness: `useSiteStore().activeSite` (same as Run Now) + + +### 3. Automation Run Now Page (SIMPLIFIED) +**Route:** `/automation/run-now` +**Purpose:** Manual automation execution with real-time progress + +**What STAYS:** +- Compact Schedule & Controls Panel (header banner) +- 7 Stage cards (showing pending/processed counts) +- Stage 8 card (Scheduled card - see note below) +- Processing card (when run is active) +- Activity Log component +- Run controls (Run Now, Pause, Resume buttons) + +**What MOVES to Overview:** +- 5 Metric cards (Keywords, Clusters, Ideas, Tasks, Content) +- Run History table + +**Stage 8 Consistency Update:** +- Change card title from "Scheduled" to "Stage 8" +- Right side text: "Approved → Scheduled" (consistent with other stages like "Review → Published") +- Keep same layout as other stage cards + + +### 4. Publish Settings Page (NEW) +**Route:** `/publisher/publish-settings` or `/automation/publishing-settings` +**Purpose:** Configure publishing automation and limits + +**Content (extracted from Sites/Settings.tsx Publishing tab):** +- **Automation Card**: + - Auto-Approval toggle + - Auto-Publish toggle +- **Limits Card**: + - Daily publish limit + - Weekly publish limit + - Monthly publish limit +- **Schedule Card**: + - Publishing days (Mon-Sun checkboxes) + - Time slots (multiple time pickers) + - Timezone selector +- **Save button** at bottom + +**Site Awareness Change:** +- **OLD**: `/sites/:id/settings?tab=publishing` used URL param `siteId` +- **NEW**: `/publisher/publish-settings` uses `useSiteStore().activeSite` +- **BUG FIX**: Site selector will now only affect current view, not all sites globally + +**Placement Decision:** +- **Location**: PUBLISHER dropdown (not AUTOMATION) +- **Reasoning**: Publishing settings affect both manual publishing (Publish/Schedule page) and automation +- **Benefit**: Centralized publishing configuration accessible from publisher workflow + + +### 5. Account Settings Page (CONSOLIDATED) +**Route:** `/account/settings` (single route, no sub-routes) +**Purpose:** All account management in one place + +**Layout:** Single page with 3 cards in rows: +1. **Account Info Card** + - Account name + - Timezone + - Plan level + - Billing status + +2. **Profile Card** + - Name + - Email + - Avatar + - Bio/Description + +3. **Team Card** + - Team members list + - Roles (Owner, Admin, Editor, Viewer) + - Invite button + - Remove member actions + +**Changes:** +- Merge 3 pages into 1 +- Remove tab navigation +- Remove sub-routes (`/account/settings/profile`, `/account/settings/team`) +- Remove dropdown from sidebar + + +### 6. Content Review & Publish/Schedule Pages (NO CHANGES) +**Routes:** `/writer/review`, `/writer/approved` +**Changes:** Just moved in sidebar to PUBLISHER section, pages unchanged + + +### 7. Content Calendar (NO CHANGES) +**Route:** `/publisher/content-calendar` +**Changes:** Just moved in sidebar to PUBLISHER section, page unchanged + +--- + +## System Analysis - Files Requiring Changes + +### CREATE NEW FILES (3): +1. **`/frontend/src/pages/Automation/AutomationOverview.tsx`** - NEW comprehensive dashboard +2. **`/frontend/src/pages/Automation/PipelineSettings.tsx`** - Extract from ConfigModal +3. **`/frontend/src/pages/Publisher/PublishSettings.tsx`** - Extract from Sites/Settings.tsx + +### MODIFY EXISTING FILES (6): +4. **`/frontend/src/pages/Automation/AutomationPage.tsx`** (Run Now) + - Remove 5 metric cards (move to Overview) + - Remove RunHistory component (move to Overview) + - Remove ConfigModal (moved to PipelineSettings page) + - Update "Stage 8" card title and label + - Add link to Pipeline Settings + - Keep stage cards, controls, activity log + +5. **`/frontend/src/pages/Sites/Settings.tsx`** + - Remove "Publishing" from tabs array + - Remove publishing settings state/loading + - Remove loadPublishingSettings() function + - Remove savePublishingSettings() function + - Remove entire Publishing tab JSX (3 cards: Automation, Limits, Schedule) + +6. **`/frontend/src/pages/account/AccountSettingsPage.tsx`** + - Merge Account + Profile + Team into single page + - Remove tab navigation + - Create 3-card layout + - Remove sub-route handling + +7. **`/frontend/src/App.tsx`** - Update routes +8. **`/frontend/src/layout/AppSidebar.tsx`** - Update menu structure +9. **`/frontend/src/layout/AppHeader.tsx`** - Update site selector patterns + +### COMPONENTS TO REUSE: +- **`RunHistory.tsx`** - Move to Overview page (already exists) +- **`ConfigModal.tsx`** - Extract content to PipelineSettings page, then delete modal +- **Metric cards** - Move JSX to Overview page + +--- + +## Implementation Steps + +### Phase 1: Create Automation Overview Page (Priority 1) +**Time: 3-4 hours** + +1. Create `AutomationOverview.tsx` +2. Move 5 metric cards from AutomationPage +3. Add cost estimation section (NEW) +4. Add last run detailed breakdown (NEW) +5. Move RunHistory component +6. Add breadcrumb and header +7. Test metrics loading +8. Test with different site selections + +**API Requirements:** +- May need new endpoint: `GET /api/v1/automation/overview/{site_id}/` + - Returns: metrics, last_run_details, cost_estimation +- Or extend existing metrics endpoint + +### Phase 2: Create Pipeline Settings Page (Priority 2) +**Time: 1-2 hours** + +1. Create `PipelineSettings.tsx` +2. Extract ConfigModal content +3. Convert modal layout to page layout +4. Add breadcrumb: "Automation / Pipeline Settings" +5. Test config save/load +6. Remove ConfigModal from AutomationPage +7. Add "Settings" link in Run Now page header + +### Phase 3: Create Publish Settings Page (Priority 1 - Bug Fix) +**Time: 2-3 hours** + +1. Create `PublishSettings.tsx` +2. Extract Publishing tab content from Sites/Settings.tsx +3. Change from URL-based siteId to store-based activeSite +4. Update API calls to use activeSite.id +5. Test site selector behavior (critical - verify bug is fixed) +6. Remove Publishing tab from Sites/Settings.tsx + +### Phase 4: Simplify Run Now Page (Priority 2) +**Time: 1 hour** + +1. Remove 5 metric cards +2. Remove RunHistory component +3. Update Stage 8 card: + - Title: "Stage 8" (not "Scheduled") + - Right label: "Approved → Scheduled" +4. Add link to Pipeline Settings in header +5. Keep everything else as-is + +### Phase 5: Consolidate Account Settings (Priority 3) +**Time: 2 hours** + +1. Update AccountSettingsPage.tsx +2. Merge 3 pages into 1 +3. Create 3-card layout +4. Remove tab navigation +5. Test all account functionality + +### Phase 6: Update Navigation (Priority 2) +**Time: 1-2 hours** + +1. Update App.tsx routes +2. Update AppSidebar.tsx menu structure +3. Update AppHeader.tsx site selector patterns +4. Test all navigation paths +5. Verify breadcrumbs + +--- + +## Updated Routes + +```tsx +// Automation Routes +} /> +} /> +} /> +} /> + +// Publisher Routes +} /> // Moved in sidebar only +} /> // Moved in sidebar only +} /> +} /> + +// Account Routes (consolidated) +} /> +// Remove: /account/settings/profile, /account/settings/team +``` + +--- + +## Updated Sidebar Structure + +```tsx +// PUBLISHER Section (after WORKFLOW) +{ + label: "PUBLISHER", + items: [ + { + icon: , + name: "Publisher", + subItems: [ + { name: "Content Review", path: "/writer/review" }, + { name: "Publish / Schedule", path: "/writer/approved" }, + { name: "Publish Settings", path: "/publisher/publish-settings" }, + { name: "Content Calendar", path: "/publisher/content-calendar" }, + ], + }, + ], +}, + +// AUTOMATION Section (after PUBLISHER) +{ + label: "AUTOMATION", + items: [ + { + icon: , + name: "Automation", + subItems: [ + { name: "Overview", path: "/automation/overview" }, + { name: "Pipeline Settings", path: "/automation/pipeline-settings" }, + { name: "Run Now", path: "/automation/run-now" }, + ], + }, + ], +}, + +// ACCOUNT Section (updated) +{ + label: "ACCOUNT", + items: [ + { + icon: , + name: "Account Settings", + path: "/account/settings", // No subItems + }, + // ... rest of account items + ], +}, + +// HELP Section (updated) +{ + label: "HELP", + items: [ + { + icon: , + name: "Notifications", + path: "/account/notifications", + }, + { + icon: , + name: "Help & Docs", + path: "/help", + }, + ], +}, +``` + +--- + +## Testing Checklist + +### Automation Pages: +- [ ] Overview page loads with all metrics +- [ ] Overview shows cost estimation correctly +- [ ] Overview shows last run details with all stages +- [ ] Overview run history table works +- [ ] Pipeline Settings loads config +- [ ] Pipeline Settings saves config +- [ ] Run Now page simplified (no metrics, no history) +- [ ] Run Now stage cards work +- [ ] Run Now Stage 8 shows "Stage 8" and "Approved → Scheduled" +- [ ] Run controls work (Run, Pause, Resume) + +### Publisher Pages: +- [ ] Publish Settings loads from activeSite (not URL) +- [ ] Publish Settings site selector changes only current view +- [ ] Publish Settings saves correctly +- [ ] Content Review accessible from Publisher menu +- [ ] Publish/Schedule accessible from Publisher menu +- [ ] Content Calendar accessible from Publisher menu + +### Account Page: +- [ ] Account Settings shows all 3 cards +- [ ] Account Info card works +- [ ] Profile card works +- [ ] Team card works +- [ ] No broken sub-routes + +### Navigation: +- [ ] All sidebar links work +- [ ] Breadcrumbs correct on all pages +- [ ] Site selector shows on correct pages +- [ ] Notifications in HELP section +- [ ] No 404 errors + +--- + +## Risk Assessment + +**LOW RISK:** +- Adding Overview page (new page, no breaking changes) +- Adding Pipeline Settings page (modal to page, same functionality) +- Moving sidebar items (just navigation reorganization) +- Moving Notifications menu item + +**MEDIUM RISK:** +- Simplifying Run Now page (removing components, need careful testing) +- Consolidating Account Settings (merging pages) +- Stage 8 label changes (need to verify no hardcoded references) + +**HIGH RISK:** +- **Moving Publish Settings from Sites to Publisher** + - Changes site awareness model (URL → store) + - Multiple API calls to refactor + - Critical bug fix that needs thorough testing +- **Removing Publishing tab from Sites Settings** + - Ensure no broken references in codebase + +**MITIGATION:** +- Test Publish Settings thoroughly with site selector +- Keep backup of Sites/Settings.tsx Publishing tab +- Test all automation pages with real data +- Verify cost calculations are accurate +- Test with different credit balance scenarios + +--- + +## Implementation Priority + +### Must Have (Phase 1): +1. Automation Overview page - **Transparency & visibility** +2. Publish Settings page - **Bug fix** +3. Update Routes & Sidebar - **Navigation** + +### Should Have (Phase 2): +4. Pipeline Settings page - **Better UX** +5. Simplify Run Now page - **Cleaner interface** +6. Stage 8 consistency - **Polish** + +### Nice to Have (Phase 3): +7. Consolidate Account Settings - **Simplification** +8. Move Notifications to HELP - **Better organization** + +--- + +## Estimated Timeline + +- **Phase 1** (Must Have): 6-8 hours +- **Phase 2** (Should Have): 3-4 hours +- **Phase 3** (Nice to Have): 2-3 hours +- **Total**: 11-15 hours + +**Can be split across multiple sessions:** +- Session 1: Overview page (3-4 hours) +- Session 2: Publish Settings + Navigation (3-4 hours) +- Session 3: Pipeline Settings + Run Now simplification (2-3 hours) +- Session 4: Account consolidation + Polish (2-3 hours) + +--- + +## Ready to Begin? + +**Status:** ✅ **Plan reviewed and updated with new requirements** + +**Next Steps:** +1. Approve this plan +2. Start with Phase 1 (Automation Overview page) +3. Test thoroughly +4. Move to Phase 2 + +**Questions to confirm:** +1. Cost estimation logic - should we use existing estimate API or create new? +2. Last run details - extend existing API or create new endpoint? +3. Stage 8 - any other places where "Scheduled" label is used? +4. Account consolidation - any concerns about merging 3 pages? + diff --git a/REFACTOR_SUMMARY.md b/REFACTOR_SUMMARY.md new file mode 100644 index 00000000..f5225845 --- /dev/null +++ b/REFACTOR_SUMMARY.md @@ -0,0 +1,161 @@ +# Navigation Refactoring - Quick Summary + +## What's Changing? + +### 1. **New Automation Overview Page** 📊 +- **Comprehensive dashboard** showing everything about automation +- Current site data status (keywords, clusters, ideas, etc.) +- **Cost estimation** - what will be processed & how much it costs +- **Last run details** - complete breakdown per stage (items processed, created, credits used) +- **Run history table** - last 10-20 runs with details +- Similar to site dashboard and homepage design + +### 2. **Publish Settings Moved** 🔧 +- **From:** `/sites/:id/settings?tab=publishing` +- **To:** `/publisher/publish-settings` (in PUBLISHER dropdown) +- **Why:** Makes more sense with publisher workflow + **fixes bug** where site selector changed all sites +- **New:** Uses store-based site awareness (only affects current view) + +### 3. **Automation Reorganized** ⚡ +**3 focused pages:** +- **Overview** - Comprehensive dashboard (NEW) +- **Pipeline Settings** - 7 stage toggles + batch config (from ConfigModal) +- **Run Now** - Simplified, just stage cards + controls (metrics & history moved to Overview) + +### 4. **Publisher Section Created** 📅 +**Groups all publishing workflow:** +- Content Review +- Publish / Schedule +- Publish Settings (NEW here) +- Content Calendar + +### 5. **Account Consolidated** 👤 +- **From:** 3 separate pages with tabs +- **To:** 1 page with 3 cards (Account Info, Profile, Team) +- **Benefit:** Less clicking, faster access + +### 6. **Stage 8 Consistency** 🎯 +- Card title: "Stage 8" (instead of "Scheduled") +- Right label: "Approved → Scheduled" (consistent with other stages) + +### 7. **Notifications Moved** 🔔 +- From ACCOUNT section → HELP section + +--- + +## New Sidebar Structure + +``` +PUBLISHER (NEW) +├── Content Review +├── Publish / Schedule +├── Publish Settings ← NEW HERE +└── Content Calendar + +AUTOMATION (REORGANIZED) +├── Overview ← NEW DASHBOARD +├── Pipeline Settings ← FROM MODAL +└── Run Now ← SIMPLIFIED + +ACCOUNT (SIMPLIFIED) +├── Account Settings ← SINGLE PAGE NOW +├── Plans & Billing +├── Usage +└── AI Models + +HELP (UPDATED) +├── Notifications ← MOVED HERE +└── Help & Docs +``` + +--- + +## Files to Create (3) + +1. `AutomationOverview.tsx` - NEW comprehensive dashboard +2. `PipelineSettings.tsx` - Extract from ConfigModal +3. `PublishSettings.tsx` - Extract from Sites/Settings.tsx + +## Files to Modify (6) + +4. `AutomationPage.tsx` - Simplify (remove metrics & history) +5. `Sites/Settings.tsx` - Remove Publishing tab +6. `AccountSettingsPage.tsx` - Consolidate 3 pages +7. `App.tsx` - Update routes +8. `AppSidebar.tsx` - Update menu +9. `AppHeader.tsx` - Update site selector + +--- + +## Key Benefits + +### For Users: +- **Transparency**: See exactly what automation did (items processed, credits used, output status) +- **Better Organization**: Related features grouped logically +- **Simpler Navigation**: Less drilling down through menus +- **Bug Fix**: Publish Settings site selector works correctly now + +### For Development: +- **Clearer Code**: Separated concerns (Overview vs Run Now vs Settings) +- **Easier Maintenance**: Each page has focused purpose +- **Better Testing**: Isolated functionality easier to test +- **Future-Proof**: Easier to add features to appropriate sections + +--- + +## Implementation Order + +### Phase 1: Core Features (6-8 hours) +1. Create Automation Overview page +2. Create Publish Settings page (fixes bug) +3. Update routes and sidebar navigation + +### Phase 2: Refinement (3-4 hours) +4. Create Pipeline Settings page +5. Simplify Run Now page +6. Update Stage 8 labels + +### Phase 3: Polish (2-3 hours) +7. Consolidate Account Settings +8. Move Notifications to HELP +9. Final testing and documentation + +**Total: 11-15 hours** (can be split across multiple sessions) + +--- + +## Testing Focus Areas + +### Critical: +- ✅ Publish Settings site selector (must fix bug) +- ✅ Automation Overview metrics accuracy +- ✅ Cost estimation calculations +- ✅ Last run details per stage + +### Important: +- ✅ All navigation links work +- ✅ No broken routes +- ✅ Run Now controls still work +- ✅ Stage cards update correctly + +### Nice to Have: +- ✅ Breadcrumbs consistent +- ✅ Loading states smooth +- ✅ Responsive design +- ✅ Dark mode + +--- + +## Questions Before Starting? + +1. **Cost estimation** - Use existing API or create new endpoint? +2. **Last run details** - Extend API or new endpoint for per-stage breakdown? +3. **Timeline** - Prefer doing all at once or phase by phase? +4. **Testing** - Any specific scenarios to test? + +--- + +**Status:** 📋 **Plan complete and ready for implementation** + +**Next Step:** Approve plan and start Phase 1 (Automation Overview + Publish Settings) + diff --git a/frontend/src/pages/Automation/AutomationPage.tsx b/frontend/src/pages/Automation/AutomationPage.tsx index 85860154..2612125b 100644 --- a/frontend/src/pages/Automation/AutomationPage.tsx +++ b/frontend/src/pages/Automation/AutomationPage.tsx @@ -57,7 +57,7 @@ const STAGE_CONFIG = [ { icon: CheckCircleIcon, color: 'from-gray-700 to-gray-800', textColor: 'text-gray-700 dark:text-gray-300', bgColor: 'bg-gray-100 dark:bg-gray-800/30', hoverColor: 'hover:border-gray-500', name: 'Tasks → Content' }, { icon: PencilIcon, color: 'from-brand-500 to-brand-600', textColor: 'text-brand-600 dark:text-brand-400', bgColor: 'bg-brand-100 dark:bg-brand-900/30', hoverColor: 'hover:border-brand-500', name: 'Content → Image Prompts' }, { icon: FileIcon, color: 'from-purple-500 to-purple-600', textColor: 'text-purple-600 dark:text-purple-400', bgColor: 'bg-purple-100 dark:bg-purple-900/30', hoverColor: 'hover:border-purple-500', name: 'Image Prompts → Images' }, - { icon: PaperPlaneIcon, color: 'from-success-500 to-success-600', textColor: 'text-success-600 dark:text-success-400', bgColor: 'bg-success-100 dark:bg-success-900/30', hoverColor: 'hover:border-success-500', name: 'Review → Published' }, + { icon: PaperPlaneIcon, color: 'from-success-500 to-success-600', textColor: 'text-success-600 dark:text-success-400', bgColor: 'bg-success-100 dark:bg-success-900/30', hoverColor: 'hover:border-success-500', name: 'In Review → Approved' }, ]; const AutomationPage: React.FC = () => { @@ -215,6 +215,8 @@ const AutomationPage: React.FC = () => { contentDraftRes, contentReviewRes, contentPublishedRes, + contentNotPublishedRes, + contentScheduledRes, imagesTotalRes, imagesPendingRes, ] = await Promise.all([ @@ -233,6 +235,8 @@ const AutomationPage: React.FC = () => { fetchContent({ page_size: 1, site_id: siteId, status: 'draft' }), fetchContent({ page_size: 1, site_id: siteId, status: 'review' }), fetchContent({ page_size: 1, site_id: siteId, status__in: 'approved,published' }), + fetchContent({ page_size: 1, site_id: siteId, status: 'approved', site_status: 'not_published' }), + fetchContent({ page_size: 1, site_id: siteId, status: 'approved', site_status: 'scheduled' }), fetchImages({ page_size: 1 }), fetchImages({ page_size: 1, status: 'pending' }), ]); @@ -247,6 +251,8 @@ const AutomationPage: React.FC = () => { draft: contentDraftRes.count || 0, review: contentReviewRes.count || 0, published: contentPublishedRes.count || 0, + not_published: contentNotPublishedRes.count || 0, + scheduled: contentScheduledRes.count || 0, }, images: { total: imagesTotalRes.count || 0, pending: imagesPendingRes.count || 0 }, }); @@ -334,6 +340,8 @@ const AutomationPage: React.FC = () => { contentDraftRes, contentReviewRes, contentPublishedRes, + contentNotPublishedRes, + contentScheduledRes, imagesTotalRes, imagesPendingRes, ] = await Promise.all([ @@ -352,6 +360,8 @@ const AutomationPage: React.FC = () => { fetchContent({ page_size: 1, site_id: siteId, status: 'draft' }), fetchContent({ page_size: 1, site_id: siteId, status: 'review' }), fetchContent({ page_size: 1, site_id: siteId, status__in: 'approved,published' }), + fetchContent({ page_size: 1, site_id: siteId, status: 'approved', site_status: 'not_published' }), + fetchContent({ page_size: 1, site_id: siteId, status: 'approved', site_status: 'scheduled' }), fetchImages({ page_size: 1 }), fetchImages({ page_size: 1, status: 'pending' }), ]); @@ -366,6 +376,8 @@ const AutomationPage: React.FC = () => { draft: contentDraftRes.count || 0, review: contentReviewRes.count || 0, published: contentPublishedRes.count || 0, + not_published: contentNotPublishedRes.count || 0, + scheduled: contentScheduledRes.count || 0, }, images: { total: imagesTotalRes.count || 0, pending: imagesPendingRes.count || 0 }, }); @@ -1157,7 +1169,7 @@ const AutomationPage: React.FC = () => { ); })} - {/* Stage 7 - Review → Published (Auto-approve) */} + {/* Stage 7 - In Review → Approved (Auto-approve) */} {pipelineOverview[6] && (() => { const stage7 = pipelineOverview[6]; const stageConfig = STAGE_CONFIG[6]; @@ -1259,24 +1271,36 @@ const AutomationPage: React.FC = () => { ); })()} - {/* Approved summary card - Same layout as Stage 7 */} -
- {/* Header Row - Icon and Label on left, Big Count on right */} + {/* Scheduled summary card - Same layout as Stage cards */} +
+ {/* Header Row - Icon, Label on left; Function Name on right */}
-
- +
+
- Approved -
- {/* Big count on right */} -
- {metrics?.content?.published ?? pipelineOverview[3]?.counts?.published ?? getStageResult(4)?.published ?? 0} + Scheduled
+ {/* Stage Function Name - Right side, larger font */} +
Ready to Publish
- {/* Status Label - Right aligned */} -
Published Content
+ {/* Single Row: Pending & Scheduled */} +
+
+
Pending
+
0 ? 'text-gray-600 dark:text-gray-300' : 'text-gray-400 dark:text-gray-500'}`}> + {metrics?.content?.not_published ?? 0} +
+
+
+
+
Scheduled
+
0 ? 'text-success-600 dark:text-success-400' : 'text-gray-400 dark:text-gray-500'}`}> + {metrics?.content?.scheduled ?? 0} +
+
+