salman/igny8
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
47a00e8875e831813693529dd23d57eae105b907
igny8/NAVIGATION_REFACTOR_PLAN.md

20 KiB
Raw Blame History

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

// 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

// 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

// 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

// Add new Automation routes
<Route path="/automation" element={<Navigate to="/automation/run-now" replace />} />
<Route path="/automation/run-now" element={<AutomationPage />} />
<Route path="/automation/settings" element={<AutomationSettings />} />
<Route path="/automation/publishing-settings" element={<PublishingSettingsPage />} />

// Update Account Settings route (remove sub-routes)
<Route path="/account/settings" element={<AccountSettingsPage />} />
// Remove these:
// <Route path="/account/settings/profile" element={<AccountSettingsPage />} />
// <Route path="/account/settings/team" element={<AccountSettingsPage />} />

// Existing routes stay as-is
<Route path="/writer/review" element={<Review />} />
<Route path="/writer/approved" element={<Approved />} />
<Route path="/publisher/content-calendar" element={<ContentCalendar />} />

Step 7: Update AppSidebar.tsx

// Add Publisher section after WORKFLOW
{
  label: "PUBLISHER",
  items: [
    {
      icon: <CalendarIcon />,
      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: <BoltIcon />,
      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: <UserCircleIcon />,
      name: "Account Settings",
      path: "/account/settings", // No subItems
    },
    {
      icon: <DollarLineIcon />,
      name: "Plans & Billing",
      path: "/account/plans",
    },
    {
      icon: <PieChartIcon />,
      name: "Usage",
      path: "/account/usage",
    },
    {
      icon: <PlugInIcon />,
      name: "AI Models",
      path: "/settings/integration",
      adminOnly: true,
    },
  ],
},

// Update Help section - add Notifications
{
  label: "HELP",
  items: [
    {
      icon: <Bell />,
      name: "Notifications",
      path: "/account/notifications",
    },
    {
      icon: <DocsIcon />,
      name: "Help & Docs",
      path: "/help",
    },
  ],
},

Step 8: Update AppHeader.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:

  1. /data/app/igny8/frontend/src/pages/Automation/AutomationPage.tsx (remove ConfigModal)
  2. /data/app/igny8/frontend/src/pages/Sites/Settings.tsx (remove Publishing tab)
  3. /data/app/igny8/frontend/src/pages/account/AccountSettingsPage.tsx (consolidate 3 pages)
  4. /data/app/igny8/frontend/src/App.tsx (update routes)
  5. /data/app/igny8/frontend/src/layout/AppSidebar.tsx (restructure menu)
  6. /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:

  • Plan reviewed and updated
  • Site awareness strategy clarified
  • Risk assessment complete
  • 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
Reference in New Issue View Git Blame Copy Permalink