1140 lines
50 KiB
Markdown
1140 lines
50 KiB
Markdown
# Pages Audit — Complete Inventory
|
|
|
|
> Generated from comprehensive file-by-file review of `frontend/src/pages/`
|
|
|
|
---
|
|
|
|
## Legend
|
|
|
|
| Field | Description |
|
|
|---|---|
|
|
| **Component** | Export name |
|
|
| **Purpose** | One-line description |
|
|
| **Origin** | `tailadmin-original` · `tailadmin-modified` · `custom` · `placeholder` |
|
|
| **UI Patterns** | Layout/interaction patterns used |
|
|
| **Shared Components** | Imports from `components/` |
|
|
| **Local Sub-components** | Page-specific child components (in `components/` subdirs) |
|
|
| **Pattern Duplication** | Repeated code that could be extracted |
|
|
| **Template** | Which template system is used (if any) |
|
|
|
|
---
|
|
|
|
## 1. Dashboard
|
|
|
|
### Dashboard/Home.tsx (~300 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Home` |
|
|
| **Purpose** | Main dashboard with workflow pipeline, quick actions, analytics widgets, and site overview |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Widget grid layout (3-col responsive), floating action button, site filter, AI period filter |
|
|
| **Shared Components** | `PageMeta`, `WorkflowGuide`, `Button`, `usePageContext` |
|
|
| **Local Sub-components** | `NeedsAttentionBar`, `WorkflowPipelineWidget`, `QuickActionsWidget`, `AIOperationsWidget`, `RecentActivityWidget`, `ContentVelocityWidget`, `AutomationStatusWidget`, `SitesOverviewWidget`, `CreditsUsageWidget`, `AccountInfoWidget`, `KeywordLibraryStatsWidget` (all from `components/dashboard/`) |
|
|
| **Pattern Duplication** | None — all widgets properly extracted |
|
|
| **Template** | None (custom widget grid) |
|
|
|
|
---
|
|
|
|
## 2. Planner
|
|
|
|
### Planner/Keywords.tsx (~800 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Keywords` |
|
|
| **Purpose** | Keyword management table with CRUD, filters, bulk actions, import/export, auto-clustering |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Config-driven table, cascading filters from backend, debounced search, volume range dropdown with refs, header metrics from API totals, bulk action with progress modal |
|
|
| **Shared Components** | `PageHeader`, `StandardThreeWidgetFooter`, `FormModal`, `ProgressModal`, `useProgressModal`, `useToast`, `useSiteStore`, `useSectorStore`, `usePageSizeStore` |
|
|
| **Local Sub-components** | `useKeywordsImportExport` hook (from `components/keywords-library/`) |
|
|
| **Pattern Duplication** | Cascading filter pattern repeated in Clusters/Ideas; header metrics calculation repeated in all Planner pages; volume range dropdown is inline (not extracted) |
|
|
| **Template** | `TablePageTemplate` + `createKeywordsPageConfig()` |
|
|
|
|
### Planner/Clusters.tsx (~700 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Clusters` |
|
|
| **Purpose** | Cluster management table with CRUD, filters, bulk idea generation |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Config-driven table, cascading filters, header metrics from API totals, StandardThreeWidgetFooter |
|
|
| **Shared Components** | `PageHeader`, `StandardThreeWidgetFooter`, `FormModal`, `ProgressModal`, `useToast`, `useSiteStore`, `useSectorStore`, `usePageSizeStore` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Near-identical to Keywords.tsx — cascading filter loading, header metrics pattern, footer widget pattern |
|
|
| **Template** | `TablePageTemplate` + `createClustersPageConfig()` |
|
|
|
|
### Planner/ClusterDetail.tsx (~280 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `ClusterDetail` |
|
|
| **Purpose** | Detail view for single cluster with tabs (articles, pages, products, taxonomy) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Param-driven detail view, inline tab implementation (Button-based with border-bottom), tabbed content types, breadcrumb back navigation |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, `Badge`, `useToast` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Custom inline tab implementation — does NOT use a shared Tab component; duplicates tab pattern seen in Sites/Settings |
|
|
| **Template** | None (custom detail view) |
|
|
|
|
### Planner/Ideas.tsx (~700 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Ideas` |
|
|
| **Purpose** | Content ideas management with queue-to-writer bulk action |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Config-driven table, cascading filters, header metrics, bulk queue action with progress modal |
|
|
| **Shared Components** | `PageHeader`, `StandardThreeWidgetFooter`, `FormModal`, `ProgressModal`, `useToast`, `useSiteStore`, `useSectorStore`, `usePageSizeStore` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Near-identical to Keywords/Clusters — same cascading filter + header metrics + footer pattern. **Bug**: `sectors` prop passed twice in pageConfig creation |
|
|
| **Template** | `TablePageTemplate` + `createIdeasPageConfig()` |
|
|
|
|
---
|
|
|
|
## 3. Writer
|
|
|
|
### Writer/Content.tsx (~550 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Content` (Writer) |
|
|
| **Purpose** | Content drafts table (status='draft') with generate image prompts, optimize, send to optimizer, view on WordPress actions |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Config-driven table, locked status filter, per-row AI actions, inline optimization via `optimizerApi` |
|
|
| **Shared Components** | `PageHeader`, `StandardThreeWidgetFooter`, `FormModal`, `ProgressModal`, `useToast`, `useSiteStore`, `useSectorStore`, `usePageSizeStore` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Same table page pattern as Planner pages |
|
|
| **Template** | `TablePageTemplate` + `createContentPageConfig()` |
|
|
|
|
### Writer/Tasks.tsx (~500+ lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Tasks` |
|
|
| **Purpose** | Writing tasks management with content generation and image generation bulk actions |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Config-driven table, per-row content generation, bulk image generation |
|
|
| **Shared Components** | `PageHeader`, `StandardThreeWidgetFooter`, `FormModal`, `ProgressModal`, `useToast`, `useSiteStore`, `useSectorStore`, `usePageSizeStore` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Same table page pattern as Planner/Writer pages |
|
|
| **Template** | `TablePageTemplate` + `createTasksPageConfig()` |
|
|
|
|
### Writer/Review.tsx (~500 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Review` |
|
|
| **Purpose** | Content review queue (status='review') with approve single/bulk actions |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Config-driven table, approval workflow, event-based refresh |
|
|
| **Shared Components** | `PageHeader`, `StandardThreeWidgetFooter`, `FormModal`, `ProgressModal`, `useToast`, `useSiteStore`, `useSectorStore`, `usePageSizeStore` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Same table pattern. **Note**: Uses different event name (`'site-changed'` vs `'siteChanged'` used elsewhere) |
|
|
| **Template** | `TablePageTemplate` + `createReviewPageConfig()` |
|
|
|
|
### Writer/Approved.tsx (~550+ lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Approved` |
|
|
| **Purpose** | Approved content ready for publishing with extensive publishing workflow (single/bulk publish, schedule, reschedule) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Config-driven table, multi-modal publishing workflow, schedule management |
|
|
| **Shared Components** | `PageHeader`, `StandardThreeWidgetFooter`, `FormModal`, `ProgressModal`, `useToast`, `useSiteStore`, `useSectorStore`, `usePageSizeStore` |
|
|
| **Local Sub-components** | `PublishingProgressModal`, `BulkPublishingModal`, `PublishLimitModal`, `ScheduleContentModal`, `BulkScheduleModal`, `BulkSchedulePreviewModal`, `ErrorDetailsModal` (from `components/publishing/`, `components/BulkWordPressPublish/`) |
|
|
| **Pattern Duplication** | Base table pattern same; extensive modal system is specific to this page |
|
|
| **Template** | `TablePageTemplate` + `createApprovedPageConfig()` |
|
|
|
|
### Writer/Images.tsx (~550+ lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Images` |
|
|
| **Purpose** | Image management grouped by content (one row per content) with image generation queue |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Config-driven table, **client-side** filtering/sorting/pagination (not server-side), image generation queue flow, settings pre-fetch |
|
|
| **Shared Components** | `PageHeader`, `StandardThreeWidgetFooter`, `FormModal`, `useToast`, `useSiteStore`, `useSectorStore` |
|
|
| **Local Sub-components** | `ImageQueueModal`, `SingleRecordStatusUpdateModal` (from `components/`) |
|
|
| **Pattern Duplication** | Client-side filtering is an anomaly vs. other table pages that use server-side; base table pattern same |
|
|
| **Template** | `TablePageTemplate` + `createImagesPageConfig()` |
|
|
|
|
### Writer/ContentView.tsx (~67 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `ContentView` |
|
|
| **Purpose** | Individual content detail view (thin wrapper loading content by ID) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Param-driven detail view, loading state, error handling |
|
|
| **Shared Components** | None directly (delegates to template) |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | `ContentViewTemplate` |
|
|
|
|
---
|
|
|
|
## 4. Publisher
|
|
|
|
### Publisher/ContentCalendar.tsx (~550+ lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `ContentCalendar` |
|
|
| **Purpose** | Content scheduling with calendar and list views, drag-drop reordering and date assignment |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Dual view (calendar grid + list), drag-drop (list reorder + calendar date drop), complex derived state via useMemo, ButtonGroup view toggle |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `ComponentCard`, `Card`, `Button`, `IconButton`, `ButtonGroup`, `CalendarItemTooltip`, `ScheduleContentModal` |
|
|
| **Local Sub-components** | None (inline calendar grid rendering) |
|
|
| **Pattern Duplication** | Calendar rendering is fully inline (~200+ lines); shares `ScheduleContentModal` with Approved.tsx |
|
|
| **Template** | None (fully custom) |
|
|
|
|
### Publisher/PublishSettings.tsx (~500 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `PublishSettings` |
|
|
| **Purpose** | Publishing automation, limits, and schedule configuration (3-card form layout) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | 3-card form layout (Automation, Limits, Schedule), toggle switches, inline form validation |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, `IconButton`, `Label`, `InputField`, `Switch` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Settings form pattern similar to Sites/Settings and account/ContentSettingsPage |
|
|
| **Template** | None (custom form layout) |
|
|
|
|
---
|
|
|
|
## 5. Sites
|
|
|
|
### Sites/List.tsx (~550+ lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `SitesList` |
|
|
| **Purpose** | Sites list with table/grid toggle, site CRUD, activation, deletion |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Dual view (table + grid cards), ViewToggle, client-side filtering, inline deletion/toggle, WorkflowGuide |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, `Badge`, `Alert`, `Switch`, `InputField`, `Select`, `ViewToggle`, `WorkflowGuide`, `ConfirmDialog`, `SiteTypeBadge` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Table view uses `TablePageTemplate`; grid view is custom inline cards |
|
|
| **Template** | `TablePageTemplate` (table view only) + custom grid view |
|
|
|
|
### Sites/Dashboard.tsx (~500 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `SiteDashboard` |
|
|
| **Purpose** | Individual site dashboard with setup checklist, quick actions, analytics |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Widget layout, setup checklist, quick action cards, stat widgets |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `ComponentCard`, `SiteInfoBar`, `Card`, `Button` |
|
|
| **Local Sub-components** | `SiteSetupChecklist`, `SiteConfigWidget`, `OperationsCostsWidget`, `CreditAvailabilityWidget` (from `components/sites/`) |
|
|
| **Pattern Duplication** | Widget grid similar to Dashboard/Home but site-specific |
|
|
| **Template** | None (custom widget layout) |
|
|
|
|
### Sites/Settings.tsx (~1000+ lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `SiteSettings` |
|
|
| **Purpose** | Site settings with tabs (General, Automation, Integrations) — massive form |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Tabbed form, SEO settings, industry/sector selection, AI settings, WordPress integration form |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, `InputField`, `Select`, `SelectDropdown`, `Checkbox`, `Radio`, `TextArea`, `Switch`, `SiteInfoBar` |
|
|
| **Local Sub-components** | `AIAutomationSettings`, `WordPressIntegrationForm` (from `components/integration/`, `components/sites/`) |
|
|
| **Pattern Duplication** | Custom inline tab implementation (duplicates pattern in ClusterDetail); very large file that could be split into tab sub-components |
|
|
| **Template** | None (custom tabbed form) |
|
|
|
|
### Sites/Content.tsx (~500 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `SiteContent` |
|
|
| **Purpose** | Site-specific content manager with manual table and custom filters |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Manual table (not TablePageTemplate), custom filter cards, manual pagination |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, `InputField`, `Select`, `SiteInfoBar` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Manual table implementation duplicates what `TablePageTemplate` provides; manual pagination duplicates template pagination |
|
|
| **Template** | None (custom manual table) |
|
|
|
|
### Sites/ContentStructure.tsx (416 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `ContentStructure` |
|
|
| **Purpose** | Content organized by clusters with keyword table and content list |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Cluster selector dropdown, keyword table, content list, inline tables |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, `Badge`, `Select`, `SiteInfoBar` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Manual inline tables duplicate TablePageTemplate capabilities |
|
|
| **Template** | None (custom cluster-based view) |
|
|
|
|
### Sites/PostEditor.tsx (672 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `PostEditor` |
|
|
| **Purpose** | Full-featured post editor with SEO metadata, taxonomy, and content validation tabs |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Tabbed editor (content, taxonomy, validation), form inputs, rich content editing |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, form components, `SiteInfoBar` |
|
|
| **Local Sub-components** | Content validation feature inline |
|
|
| **Pattern Duplication** | Tab implementation likely duplicates other inline tab patterns |
|
|
| **Template** | None (custom post editor) |
|
|
|
|
### Sites/PageManager.tsx (395 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `PageManager` |
|
|
| **Purpose** | Drag-drop page reordering and management |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Drag-and-drop with `react-dnd` + `HTML5Backend`, sortable list |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `DndProvider`, `useDrag`, `useDrop` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Only page using `react-dnd` directly |
|
|
| **Template** | None (custom drag-drop interface) |
|
|
|
|
### Sites/SyncDashboard.tsx (460 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `SyncDashboard` |
|
|
| **Purpose** | WordPress sync health dashboard with sync status, mismatches, and logs |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Status cards, sync action buttons, mismatch list, log viewer |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, `Badge` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None (custom dashboard) |
|
|
|
|
### Sites/PublishingQueue.tsx (441 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `PublishingQueue` |
|
|
| **Purpose** | Scheduled content queue with list/calendar view (site-specific) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Dual view (list + calendar), similar to ContentCalendar but site-scoped |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Duplicates much of `Publisher/ContentCalendar.tsx` but scoped to a single site |
|
|
| **Template** | None (custom queue view) |
|
|
|
|
### Sites/AIAutomationSettings.tsx (929 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `AIAutomationSettings` |
|
|
| **Purpose** | Unified AI & automation settings per site (per SETTINGS-CONSOLIDATION-PLAN) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Multi-section settings form, stage configuration, unified settings API |
|
|
| **Shared Components** | `Card`, `Button`, `Switch`, `InputField`, `Label`, `Select` |
|
|
| **Local Sub-components** | Uses `unifiedSettings.api` with `UnifiedSiteSettings`, `StageConfig` types |
|
|
| **Pattern Duplication** | Large settings form pattern similar to Sites/Settings, Publisher/PublishSettings |
|
|
| **Template** | None (custom settings form) |
|
|
|
|
### Sites/DeploymentPanel.tsx (43 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `DeploymentPanel` |
|
|
| **Purpose** | **DEPRECATED** — Placeholder showing deprecation notice |
|
|
| **Origin** | `custom` (deprecated) |
|
|
| **UI Patterns** | Static notice card |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None |
|
|
|
|
---
|
|
|
|
## 6. Automation
|
|
|
|
### Automation/AutomationPage.tsx (~1156 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `AutomationPage` |
|
|
| **Purpose** | Main automation dashboard — run/pause/config pipeline, live progress tracking, activity log, eligibility checks |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | 7-stage pipeline visualization, live polling progress, server time display, eligibility gating, stage color coding |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `ComponentCard`, `DebugSiteSelector`, `Button`, `useToast`, `useSiteStore` |
|
|
| **Local Sub-components** | `ActivityLog`, `CurrentProcessingCardV2`, `GlobalProgressBar` (from `components/Automation/`) |
|
|
| **Pattern Duplication** | None — highly specialized |
|
|
| **Template** | None (custom automation dashboard) |
|
|
|
|
### Automation/AutomationOverview.tsx (269 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `AutomationOverview` |
|
|
| **Purpose** | Production stats dashboard showing actual output metrics and meaningful run history |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Quick action buttons with badge counts, production summary, run history list |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `useToast`, `useSiteStore` |
|
|
| **Local Sub-components** | `MeaningfulRunHistory`, `ProductionSummary` (from `components/Automation/DetailView/`) |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None (custom stats dashboard) |
|
|
|
|
### Automation/AutomationRunDetail.tsx (218 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `AutomationRunDetail` |
|
|
| **Purpose** | Detailed view of a single automation run with stage breakdown, charts, and insights |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Run summary card, 2-col layout (credit chart + stage accordion), insights panel, derived insights from data |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `useToast`, `useSiteStore` |
|
|
| **Local Sub-components** | `RunSummaryCard`, `StageAccordion`, `EfficiencyMetrics`, `InsightsPanel`, `CreditBreakdownChart` (from `components/Automation/DetailView/`) |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None (custom detail view) |
|
|
|
|
### Automation/PipelineSettings.tsx (399 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `PipelineSettings` |
|
|
| **Purpose** | Configure 7-stage automation pipeline — per-stage enable/disable, batch sizes, delays |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Multi-stage form with checkboxes and inputs per stage, save/cancel flow |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, `Checkbox`, `Select`, `InputField`, `useToast`, `useSiteStore` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Settings form pattern (similar to PublishSettings, Sites/Settings) |
|
|
| **Template** | None (custom pipeline settings form) |
|
|
|
|
---
|
|
|
|
## 7. Thinker
|
|
|
|
### Thinker/Prompts.tsx (499 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Prompts` |
|
|
| **Purpose** | AI prompt library — manage/edit/reset prompt templates for all AI operations (clustering, ideas, content, images, site structure) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Grouped prompt editor cards (Planner, Writer, Image, Site Builder sections), save/reset per prompt, TextArea editors |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Button`, `TextArea`, `useToast` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Repeating card+TextArea+save/reset pattern for each prompt type — could extract a `PromptEditorCard` component |
|
|
| **Template** | None (custom prompt editor layout) |
|
|
|
|
### Thinker/AuthorProfiles.tsx (160 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `AuthorProfiles` |
|
|
| **Purpose** | CRUD for writing style profiles (name, tone, language) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Card grid, FormModal for create/edit, confirm-delete, CRUD API calls |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, `Badge`, `FormModal`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | FormModal CRUD pattern is clean and reusable |
|
|
| **Template** | None (card grid + FormModal) |
|
|
|
|
### Thinker/ImageTesting.tsx (28 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `ImageTesting` |
|
|
| **Purpose** | **PLACEHOLDER** — "Coming Soon" for image testing |
|
|
| **Origin** | `placeholder` |
|
|
| **UI Patterns** | Static placeholder card |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `ComponentCard` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Same "Coming Soon" pattern as Profile, Strategies |
|
|
| **Template** | None |
|
|
|
|
### Thinker/Profile.tsx (22 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Profile` |
|
|
| **Purpose** | **PLACEHOLDER** — "Coming Soon" for AI profile settings |
|
|
| **Origin** | `placeholder` |
|
|
| **UI Patterns** | Static placeholder card |
|
|
| **Shared Components** | `PageMeta`, `ComponentCard` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Same "Coming Soon" pattern as ImageTesting, Strategies |
|
|
| **Template** | None |
|
|
|
|
### Thinker/Strategies.tsx (28 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Strategies` |
|
|
| **Purpose** | **PLACEHOLDER** — "Coming Soon" for content strategies |
|
|
| **Origin** | `placeholder` |
|
|
| **UI Patterns** | Static placeholder card |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `ComponentCard` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Same "Coming Soon" pattern as ImageTesting, Profile |
|
|
| **Template** | None |
|
|
|
|
---
|
|
|
|
## 8. Optimizer
|
|
|
|
### Optimizer/ContentSelector.tsx (303 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `OptimizerContentSelector` |
|
|
| **Purpose** | Content list for selecting items to optimize — single/batch optimize with entry point selection |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Manual table with checkboxes, client-side filtering, batch selection, entry-point dropdown, manual pagination |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `ModuleNavigationTabs`, `Button`, `Select`, `Checkbox`, `useToast`, `useSectorStore`, `usePageSizeStore` |
|
|
| **Local Sub-components** | `ContentFilter`, `SourceBadge`, `OptimizationScores` (from `components/content/`, `components/optimizer/`) |
|
|
| **Pattern Duplication** | Manual table with inline pagination — duplicates TablePageTemplate capability; pagination buttons duplicate pattern seen in Linker, Sites/Content |
|
|
| **Template** | None (custom manual table) |
|
|
|
|
### Optimizer/AnalysisPreview.tsx (304 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `AnalysisPreview` |
|
|
| **Purpose** | Preview optimization scores for a single content item without applying changes |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Param-driven detail view, score cards, metadata coverage scorecards, recommended actions list |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `useToast` |
|
|
| **Local Sub-components** | `OptimizationScores` (from `components/optimizer/`) |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None (custom analysis view) |
|
|
|
|
---
|
|
|
|
## 9. Linker
|
|
|
|
### Linker/ContentList.tsx (237 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `LinkerContentList` |
|
|
| **Purpose** | Content list for adding internal links — single/batch link processing |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Manual table, per-row process button, batch processing, link results display, manual pagination |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `ModuleNavigationTabs`, `Button`, `useToast`, `useSectorStore`, `usePageSizeStore`, `usePageLoading` |
|
|
| **Local Sub-components** | `SourceBadge`, `LinkResults` (from `components/content/`, `components/linker/`) |
|
|
| **Pattern Duplication** | Manual table + inline pagination — same pattern as Optimizer/ContentSelector and Sites/Content |
|
|
| **Template** | None (custom manual table) |
|
|
|
|
---
|
|
|
|
## 10. Settings (Admin/Legacy)
|
|
|
|
### Settings/Integration.tsx (~1028 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Integration` |
|
|
| **Purpose** | API integration management (OpenAI, Runware, GSC) — configure keys, test connections, image generation settings |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Integration cards, validation cards, image generation/result cards, site integrations, FormModal for config |
|
|
| **Shared Components** | `PageMeta`, `IntegrationCard`, `ValidationCard`, `ImageGenerationCard`, `ImageResultCard`, `ImageServiceCard`, `SiteIntegrationsSection`, `Modal`, `FormModal`, `Button`, `Checkbox`, `Label`, `SelectDropdown`, `Alert`, `useToast` |
|
|
| **Local Sub-components** | Inline SVG icon components (OpenAIIcon, RunwareIcon, GSCIcon) |
|
|
| **Pattern Duplication** | Complex integration management — unique |
|
|
| **Template** | None (custom integration management) |
|
|
|
|
### Settings/Sites.tsx (~638 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Sites` (Settings) |
|
|
| **Purpose** | Admin site management — CRUD sites, manage sectors, toggle active sites |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | SiteCard grid, FormModal for create/edit, sector selector modal, confirm delete |
|
|
| **Shared Components** | `PageMeta`, `SiteCard`, `FormModal`, `ConfirmDialog`, `Button`, `Alert`, `Select`, `Checkbox`, `Badge`, `useToast` |
|
|
| **Local Sub-components** | Inline SiteIcon SVG |
|
|
| **Pattern Duplication** | Overlaps with `Sites/List.tsx` — both manage sites with different UIs |
|
|
| **Template** | None (card grid + modals) |
|
|
|
|
### Settings/WordPressIntegrationDebug.tsx (~655 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `WordPressIntegrationDebug` |
|
|
| **Purpose** | WordPress integration health debugging — sync events, data validation, API status checks |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Health status cards, sync event log, data validation table, debug toggle |
|
|
| **Shared Components** | `useSiteStore`, `useToast`, icons |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Overlaps with Sites/SyncDashboard — both show WordPress sync health |
|
|
| **Template** | None (custom debug interface) |
|
|
|
|
### Settings/CreditsAndBilling.tsx (~238 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `CreditsAndBilling` |
|
|
| **Purpose** | Usage overview with credit balance and transaction history |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Tab toggle (overview/transactions), metric cards, transaction table |
|
|
| **Shared Components** | `PageMeta`, `ComponentCard`, `EnhancedMetricCard`, `Button`, `Badge`, `useToast` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Duplicates functionality in `account/UsageDashboardPage` and `Billing/Usage` |
|
|
| **Template** | None (custom billing view) |
|
|
|
|
### Settings/Plans.tsx (~218 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Plans` |
|
|
| **Purpose** | Display available subscription plans using PricingTable component |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Pricing table display, plan feature extraction, URL-based plan preselection |
|
|
| **Shared Components** | `PageMeta`, `PricingTable1`, `useToast`, `usePageLoading`, `useAuthStore` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Plan display overlaps with `account/PlansAndBillingPage` |
|
|
| **Template** | None (pricing table) |
|
|
|
|
### Settings/Publishing.tsx (~226 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Publishing` |
|
|
| **Purpose** | Publishing rules, auto-publish, sync settings (TODO: mostly placeholder) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Settings form with checkboxes, dropdowns, PublishingRules component |
|
|
| **Shared Components** | `PageMeta`, `Card`, `Button`, `Checkbox`, `Label`, `Input`, `Select`, `PublishingRules`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Overlaps with `Publisher/PublishSettings` |
|
|
| **Template** | None (custom settings form) |
|
|
|
|
### Settings/General.tsx (109 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `GeneralSettings` |
|
|
| **Purpose** | App preferences (table records per page, default sort) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Simple settings form, settingsStore integration |
|
|
| **Shared Components** | `PageMeta`, `ComponentCard`, `Button`, `Label`, `InputField`, `Select`, `useSettingsStore`, `useToast` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None (ComponentCard form) |
|
|
|
|
### Settings/Industries.tsx (59 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Industries` (Settings) |
|
|
| **Purpose** | Admin industry template viewer (read-only card grid) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Card grid, badge for active status |
|
|
| **Shared Components** | `PageMeta`, `Card`, `Badge`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Overlaps with `Reference/Industries` |
|
|
| **Template** | None (card grid) |
|
|
|
|
### Settings/Subscriptions.tsx (94 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Subscriptions` |
|
|
| **Purpose** | Admin subscription list (table of account subscriptions) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Simple table in Card, status badges |
|
|
| **Shared Components** | `PageMeta`, `Card`, `Badge`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None (simple table) |
|
|
|
|
### Settings/Users.tsx (79 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Users` |
|
|
| **Purpose** | Admin user list (table of account users) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Simple table in Card, role/status badges |
|
|
| **Shared Components** | `PageMeta`, `Card`, `Badge`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None (simple table) |
|
|
|
|
### Settings/Account.tsx (43 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `AccountSettings` (Settings) |
|
|
| **Purpose** | **PLACEHOLDER** — "coming soon" for account settings |
|
|
| **Origin** | `placeholder` |
|
|
| **UI Patterns** | Static placeholder |
|
|
| **Shared Components** | `PageMeta`, `Card`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Functionality exists in `account/AccountSettingsPage` |
|
|
| **Template** | None |
|
|
|
|
### Settings/System.tsx (43 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `SystemSettings` |
|
|
| **Purpose** | **PLACEHOLDER** — "coming soon" for system settings |
|
|
| **Origin** | `placeholder` |
|
|
| **UI Patterns** | Static placeholder |
|
|
| **Shared Components** | `PageMeta`, `Card`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None |
|
|
|
|
---
|
|
|
|
## 11. Billing (Legacy)
|
|
|
|
### Billing/Usage.tsx (170 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Usage` |
|
|
| **Purpose** | Credit usage overview with cost table and transaction history |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Balance card, cost reference table, transaction list |
|
|
| **Shared Components** | `PageMeta`, `Card`, `Badge`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Duplicates `Settings/CreditsAndBilling` and `account/UsageDashboardPage` |
|
|
| **Template** | None |
|
|
|
|
### Billing/Credits.tsx (122 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Credits` |
|
|
| **Purpose** | Credit balance display with upgrade CTA |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Balance cards, link to plans |
|
|
| **Shared Components** | `PageMeta`, `Card`, `Badge`, `Button`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Overlaps with Usage page and account/UsageDashboardPage |
|
|
| **Template** | None |
|
|
|
|
### Billing/Transactions.tsx (103 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Transactions` |
|
|
| **Purpose** | Credit transaction history table with pagination |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Table with color-coded badges, pagination |
|
|
| **Shared Components** | `PageMeta`, `Card`, `Badge`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Transaction table duplicated in Settings/CreditsAndBilling and Billing/Usage |
|
|
| **Template** | None |
|
|
|
|
---
|
|
|
|
## 12. Account (Current)
|
|
|
|
### account/PlansAndBillingPage.tsx (~1822 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `PlansAndBillingPage` |
|
|
| **Purpose** | Comprehensive billing dashboard — current plan, credit packages, invoices, payment methods, purchase flow |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Multi-section dashboard, credit package cards, invoice downloads, payment method cards, purchase modals, portal integration |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Badge`, `Button`, `Label`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | Inline SVG icons, portal-based purchase modal |
|
|
| **Pattern Duplication** | Supersedes `Settings/Plans`, `Settings/CreditsAndBilling`, `Billing/*`; very large file that could be split |
|
|
| **Template** | None (custom multi-section dashboard) |
|
|
|
|
### account/AccountSettingsPage.tsx (~979 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `AccountSettingsPage` |
|
|
| **Purpose** | Account, profile, and team management — single scrollable page with all settings |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Vertical form sections (Account, Profile, Team), invite/remove team members, change password, modal for invites |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `ComponentCard`, `Card`, `Badge`, `Button`, `InputField`, `Select`, `Checkbox`, `Modal`, `useToast`, `useAuthStore`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Supersedes `Settings/Account` placeholder |
|
|
| **Template** | None (custom form sections) |
|
|
|
|
### account/UsageDashboardPage.tsx (~954 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `UsageDashboardPage` |
|
|
| **Purpose** | Unified analytics dashboard — credit usage charts, operation breakdowns, plan limits, usage trends |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Charts (react-apexcharts), stat cards, operation breakdown table, period selector, pagination |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Badge`, `Button`, `SelectDropdown`, `Input`, `Pagination`, `useToast` |
|
|
| **Local Sub-components** | None (uses `Chart` from react-apexcharts) |
|
|
| **Pattern Duplication** | Supersedes `Billing/Usage`, `Billing/Credits`, `Settings/CreditsAndBilling`; most comprehensive usage view |
|
|
| **Template** | None (custom analytics dashboard) |
|
|
|
|
### account/ContentSettingsPage.tsx (~686 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `ContentSettingsPage` |
|
|
| **Purpose** | Content generation, publishing, and image settings — 3-tab settings page |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Tabbed form (Content, Publishing, Images), image generation settings with provider/model selectors |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, `SelectDropdown`, `Label`, `Checkbox`, `TextArea`, `useToast` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Publishing settings overlap with `Publisher/PublishSettings`; image settings overlap with `Settings/Integration` |
|
|
| **Template** | None (tabbed settings form) |
|
|
|
|
### account/PurchaseCreditsPage.tsx (~429 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `PurchaseCreditsPage` |
|
|
| **Purpose** | Credit package selection and payment flow — choose package, select payment method, purchase |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Package selection cards, payment method selection, manual payment form, invoice display |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Button`, `InputField`, `TextArea`, `Label` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Purchase flow also exists within `PlansAndBillingPage` |
|
|
| **Template** | None (custom purchase flow) |
|
|
|
|
### account/NotificationsPage.tsx (~428 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `NotificationsPage` |
|
|
| **Purpose** | Notification center — list, filter, mark read, delete notifications |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Filterable notification list, severity/type/read filters, bulk mark all read, individual delete |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Button`, `Select`, `useNotificationStore`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None (custom notification list) |
|
|
|
|
### account/UsageAnalyticsPage.tsx (~278 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `UsageAnalyticsPage` |
|
|
| **Purpose** | Usage analytics with URL-driven tabs (limits, activity, insights, API) |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | URL-driven tab selection (path-based), period selector, billing panels |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Badge`, `Button`, `useToast` |
|
|
| **Local Sub-components** | `BillingUsagePanel`, `UsageLimitsPanel`, `CreditInsightsCharts` (from `components/billing/`) |
|
|
| **Pattern Duplication** | Overlaps with `UsageDashboardPage` — both show usage analytics with different approaches |
|
|
| **Template** | None (tabbed analytics) |
|
|
|
|
---
|
|
|
|
## 13. Setup
|
|
|
|
### Setup/SetupWizard.tsx (46 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `SetupWizard` |
|
|
| **Purpose** | Onboarding setup wizard — thin wrapper delegating to `OnboardingWizard` component |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Wizard flow, complete/skip callbacks, page context integration |
|
|
| **Shared Components** | `PageMeta`, `OnboardingWizard`, `usePageContext` |
|
|
| **Local Sub-components** | None (all logic in `OnboardingWizard`) |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None (delegated to OnboardingWizard) |
|
|
|
|
### Setup/IndustriesSectorsKeywords.tsx (~1583 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `IndustriesSectorsKeywords` |
|
|
| **Purpose** | Keywords library — browse seed keywords by industry/sector, add to workflow, CSV import, smart suggestions |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Sector metric grid, smart suggestions, sector card browsing, CSV import modal, bulk add with confirmation, `TablePageTemplate` for keyword table |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `WorkflowGuide`, `Badge`, `Button`, `Modal`, `FileInput`, `Label`, `Input`, `Card`, `useToast`, `usePageLoading`, `useSiteStore`, `useSectorStore`, `usePageSizeStore` |
|
|
| **Local Sub-components** | `SectorMetricGrid`, `SmartSuggestions`, `SectorCardsGrid`, `BulkAddConfirmation` (from `components/keywords-library/`) |
|
|
| **Pattern Duplication** | Very large file that mixes browsing, importing, and management; could be split |
|
|
| **Template** | `TablePageTemplate` (for keyword browsing table) |
|
|
|
|
---
|
|
|
|
## 14. AuthPages
|
|
|
|
### AuthPages/SignIn.tsx (17 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `SignIn` |
|
|
| **Purpose** | Sign-in page — thin wrapper composing `AuthLayout` + `SignInForm` |
|
|
| **Origin** | `tailadmin-modified` |
|
|
| **UI Patterns** | Auth layout with split-screen |
|
|
| **Shared Components** | `PageMeta`, `AuthLayout`, `SignInForm` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | `AuthLayout` (shared auth template) |
|
|
|
|
### AuthPages/SignUp.tsx (~120 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `SignUp` |
|
|
| **Purpose** | Registration page with plan selection and unified signup form |
|
|
| **Origin** | `tailadmin-modified` |
|
|
| **UI Patterns** | Plan pre-selection from URL, plan cards, auth layout |
|
|
| **Shared Components** | `PageMeta`, `SignUpFormUnified`, `GridShape` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Plan fetching logic duplicated from Settings/Plans |
|
|
| **Template** | Custom layout (inline, not AuthLayout) |
|
|
|
|
### AuthPages/AuthPageLayout.tsx (87 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `AuthLayout` |
|
|
| **Purpose** | Shared auth page layout — split-screen with branding panel and plan preview |
|
|
| **Origin** | `tailadmin-modified` |
|
|
| **UI Patterns** | Split-screen layout (form left, branding right), responsive collapse, plan preview card, theme toggler |
|
|
| **Shared Components** | `GridShape`, `ThemeTogglerTwo` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None — this IS the shared layout |
|
|
| **Template** | N/A (this is a layout component) |
|
|
|
|
### AuthPages/ForgotPassword.tsx (177 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `ForgotPassword` |
|
|
| **Purpose** | Request password reset email |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Centered card form, success state transition, anti-enumeration (always shows success) |
|
|
| **Shared Components** | `PageMeta` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Standalone layout (doesn't use AuthLayout) |
|
|
| **Template** | None (standalone centered form) |
|
|
|
|
### AuthPages/ResetPassword.tsx (348 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `ResetPassword` |
|
|
| **Purpose** | Password reset form with token from email link |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Token-validated form, password strength checks, state machine (form/success/error/expired), auto-redirect |
|
|
| **Shared Components** | `PageMeta` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Standalone layout (doesn't use AuthLayout) |
|
|
| **Template** | None (standalone centered form) |
|
|
|
|
### AuthPages/VerifyEmail.tsx (220 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `VerifyEmail` |
|
|
| **Purpose** | Email verification with token from email link |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Auto-verify on mount, state machine (verifying/success/error/expired), resend option |
|
|
| **Shared Components** | `PageMeta` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Standalone layout (doesn't use AuthLayout) |
|
|
| **Template** | None (standalone centered form) |
|
|
|
|
### AuthPages/Unsubscribe.tsx (82 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Unsubscribe` |
|
|
| **Purpose** | Email preferences redirect — auto-redirects to account settings after 5s |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Informational card with auto-redirect timer, transactional email notice |
|
|
| **Shared Components** | `PageMeta` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Standalone layout |
|
|
| **Template** | None (standalone centered card) |
|
|
|
|
---
|
|
|
|
## 15. Help
|
|
|
|
### Help/Help.tsx (~1306 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Help` |
|
|
| **Purpose** | In-app help documentation — workflow pipeline visualization, Q&A accordions, getting started guide |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Table of contents, anchor-link scrolling, workflow pipeline visualization, accordion FAQ sections, cards |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Accordion`, `AccordionItem`, `Card`, `Badge` |
|
|
| **Local Sub-components** | `WorkflowPipeline` (inline component), `TableOfContentsItem` interface |
|
|
| **Pattern Duplication** | WorkflowPipeline visualization duplicates Dashboard pipeline widget concept; very large file |
|
|
| **Template** | None (custom documentation page) |
|
|
|
|
---
|
|
|
|
## 16. Reference
|
|
|
|
### Reference/Industries.tsx (185 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Industries` (Reference) |
|
|
| **Purpose** | Reference view of industries with keyword counts and volume stats |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Card grid with keyword stats, volume formatting, tooltip enrichment |
|
|
| **Shared Components** | `PageMeta`, `PageHeader`, `Card`, `Badge`, `Tooltip`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Overlaps with `Settings/Industries` (both show industry cards) |
|
|
| **Template** | None (card grid) |
|
|
|
|
### Reference/SeedKeywords.tsx (119 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `SeedKeywords` |
|
|
| **Purpose** | Global keyword library browser with industry filter and search |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Filter bar (industry dropdown + search), keyword list |
|
|
| **Shared Components** | `PageMeta`, `Card`, `Badge`, `useToast`, `usePageLoading` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Overlaps with `Setup/IndustriesSectorsKeywords` keyword browsing |
|
|
| **Template** | None |
|
|
|
|
---
|
|
|
|
## 17. Standalone Pages
|
|
|
|
### Payment.tsx (122 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Payment` |
|
|
| **Purpose** | Manual payment contact form — generates mailto link for sales |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Simple form, mailto link generation, plan display from URL params |
|
|
| **Shared Components** | `InputField`, `TextArea`, `Label`, `Button`, `useAuthStore` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None — unique manual payment flow |
|
|
| **Template** | None |
|
|
|
|
### UIElements.tsx (737 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `UIElements` |
|
|
| **Purpose** | **DEV REFERENCE** — UI component showcase/documentation page (non-indexable) |
|
|
| **Origin** | `tailadmin-modified` |
|
|
| **UI Patterns** | Component showcase with live examples of all `components/ui/` elements |
|
|
| **Shared Components** | Imports effectively ALL `components/ui/` components |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | N/A — reference page |
|
|
| **Template** | None |
|
|
|
|
### Components.tsx (680 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Components` |
|
|
| **Purpose** | **DEV REFERENCE** — Modal, dropdown, pagination, card, chart demo page |
|
|
| **Origin** | `tailadmin-modified` |
|
|
| **UI Patterns** | Component showcase with AlertModal, Modal, Dropdown, Pagination, Card variants |
|
|
| **Shared Components** | `PageMeta`, `AlertModal`, `Modal`, `Button`, `Dropdown`, `DropdownItem`, `Pagination`, `Card`, `ChartTab`, `InputField`, `TextArea` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | N/A — reference page |
|
|
| **Template** | None |
|
|
|
|
---
|
|
|
|
## 18. Legal
|
|
|
|
### legal/Privacy.tsx (260 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Privacy` |
|
|
| **Purpose** | Privacy policy static content page |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Static content with sections, centered card layout, back-to-home link |
|
|
| **Shared Components** | `PageMeta` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Same layout pattern as Terms.tsx |
|
|
| **Template** | None (standalone legal) |
|
|
|
|
### legal/Terms.tsx (186 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `Terms` |
|
|
| **Purpose** | Terms and conditions static content page |
|
|
| **Origin** | `custom` |
|
|
| **UI Patterns** | Static content with sections, centered card layout, back-to-home link |
|
|
| **Shared Components** | `PageMeta` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | Same layout pattern as Privacy.tsx — could extract a `LegalPageLayout` |
|
|
| **Template** | None (standalone legal) |
|
|
|
|
---
|
|
|
|
## 19. OtherPage
|
|
|
|
### OtherPage/NotFound.tsx (44 lines)
|
|
|
|
| Field | Value |
|
|
|---|---|
|
|
| **Component** | `NotFound` |
|
|
| **Purpose** | 404 error page |
|
|
| **Origin** | `tailadmin-original` |
|
|
| **UI Patterns** | Centered error display, SVG illustration, back-to-home link, GridShape background |
|
|
| **Shared Components** | `PageMeta`, `GridShape` |
|
|
| **Local Sub-components** | None |
|
|
| **Pattern Duplication** | None |
|
|
| **Template** | None |
|
|
|
|
---
|
|
|
|
## Summary Statistics
|
|
|
|
| Metric | Count |
|
|
|---|---|
|
|
| **Total page files** | 68 |
|
|
| **Using `TablePageTemplate`** | 10 (Keywords, Clusters, Ideas, Tasks, Content, Review, Approved, Images, Sites/List (table view), Setup/IndustriesSectorsKeywords) |
|
|
| **Using `ContentViewTemplate`** | 1 (ContentView) |
|
|
| **Custom (no template)** | 50 |
|
|
| **Placeholder / Coming Soon** | 5 (ImageTesting, Profile, Strategies, Settings/Account, Settings/System) |
|
|
| **Deprecated** | 1 (DeploymentPanel) |
|
|
| **TailAdmin-original** | 1 (NotFound) |
|
|
| **TailAdmin-modified** | 4 (SignIn, SignUp, UIElements, Components) |
|
|
| **Dev reference only** | 2 (UIElements, Components) |
|
|
|
|
---
|
|
|
|
## Key Findings — Pattern Duplication
|
|
|
|
### 1. Manual Table Duplication
|
|
**Pages**: `Sites/Content`, `Sites/ContentStructure`, `Optimizer/ContentSelector`, `Linker/ContentList`
|
|
These pages build manual `<table>` with inline pagination instead of using `TablePageTemplate`. Candidate for migration or a simpler `SimpleTableTemplate`.
|
|
|
|
### 2. Settings Form Proliferation
|
|
**Pages**: `Sites/Settings`, `Sites/AIAutomationSettings`, `Publisher/PublishSettings`, `Automation/PipelineSettings`, `account/ContentSettingsPage`, `Settings/Publishing`
|
|
At least 6 pages implement settings forms with similar card+toggle+save patterns. Consider a `SettingsFormTemplate` or shared `SettingsSection` component.
|
|
|
|
### 3. Billing/Usage Triplication
|
|
**Legacy**: `Settings/CreditsAndBilling`, `Billing/Usage`, `Billing/Credits`, `Billing/Transactions`
|
|
**Current**: `account/PlansAndBillingPage`, `account/UsageDashboardPage`, `account/UsageAnalyticsPage`
|
|
The legacy Settings/Billing pages duplicate what the account/* pages already provide. Candidates for removal.
|
|
|
|
### 4. Inline Tab Implementation
|
|
**Pages**: `ClusterDetail`, `Sites/Settings`, `Sites/PostEditor`
|
|
Custom button-based tab implementations instead of using a shared `Tabs` component.
|
|
|
|
### 5. Cascading Filter Boilerplate
|
|
**Pages**: `Keywords`, `Clusters`, `Ideas`, `Tasks`, `Content`, `Review`, `Approved`, `Images`
|
|
All Planner+Writer table pages repeat ~50-100 lines of cascading filter loading logic. Could be extracted into a `useCascadingFilters` hook.
|
|
|
|
### 6. WordPress Sync Overlap
|
|
**Pages**: `Settings/WordPressIntegrationDebug` vs `Sites/SyncDashboard`
|
|
Both show WordPress sync health with overlapping functionality.
|
|
|
|
### 7. Industry Display Overlap
|
|
**Pages**: `Settings/Industries` vs `Reference/Industries`
|
|
Both display industry cards; the Reference version adds keyword stats.
|
|
|
|
### 8. Calendar Duplication
|
|
**Pages**: `Publisher/ContentCalendar` vs `Sites/PublishingQueue`
|
|
Both implement calendar+list views for scheduled content. The site-scoped version could reuse the publisher calendar component.
|
|
|
|
### 9. Legal Page Layout
|
|
**Pages**: `legal/Privacy` vs `legal/Terms`
|
|
Identical layout wrapper — candidate for a `LegalPageLayout` component.
|