Remove obsolete migration and workflow files; delete Site Builder Wizard references and related components. Update documentation to reflect the removal of the WorkflowState model and streamline the site building process.
This commit is contained in:
IGNY8 VPS (Salman)
@@ -1,6 +1,6 @@
|
||||
# IGNY8 Frontend Architecture Documentation
|
||||
|
||||
**Last Updated:** 2025-01-XX
|
||||
**Last Updated:** 2025-01-XX (Added Sites Renderer application, updated routing with Linker/Optimizer/Sites modules, fixed React Router versions)
|
||||
**Version:** 1.0
|
||||
**Purpose:** Master-level architecture and functional documentation for the IGNY8 frontend application, covering structure, routing, state management, build system, and all functional details.
|
||||
|
||||
@@ -30,12 +30,13 @@
|
||||
|
||||
## Executive Summary
|
||||
|
||||
The IGNY8 frontend is a modern, dual-application React-based system consisting of:
|
||||
The IGNY8 frontend is a modern, triple-application React-based system consisting of:
|
||||
|
||||
1. **Main Application** (`app.igny8.com`): A full-featured SaaS platform for SEO content management with authentication, multi-tenancy, and complex workflows
|
||||
2. **Marketing Site** (`igny8.com`): A public-facing marketing website with SEO-optimized pages
|
||||
3. **Sites Renderer** (`sites.igny8.com`): A public-facing site renderer that serves deployed IGNY8-hosted sites
|
||||
|
||||
Both applications share the same codebase but are built and deployed separately, using different entry points, routing, and build configurations.
|
||||
All three applications share components and utilities but are built and deployed separately, using different entry points, routing, and build configurations.
|
||||
|
||||
### Key Characteristics
|
||||
|
||||
@@ -67,7 +68,8 @@ Both applications share the same codebase but are built and deployed separately,
|
||||
|------------|---------|---------|
|
||||
| **React** | 19.0.0 | UI library |
|
||||
| **React DOM** | 19.0.0 | DOM rendering |
|
||||
| **React Router** | 7.9.5 | Client-side routing |
|
||||
| **react-router** | ^7.1.5 | Core routing library |
|
||||
| **react-router-dom** | ^7.9.5 | DOM bindings for React Router |
|
||||
| **Zustand** | 5.0.8 | State management |
|
||||
| **Vite** | 6.1.0 | Build tool & dev server |
|
||||
|
||||
@@ -87,6 +89,7 @@ Both applications share the same codebase but are built and deployed separately,
|
||||
{
|
||||
"react": "^19.0.0",
|
||||
"react-dom": "^19.0.0",
|
||||
"react-router": "^7.1.5",
|
||||
"react-router-dom": "^7.9.5",
|
||||
"zustand": "^5.0.8",
|
||||
"typescript": "~5.7.2"
|
||||
@@ -144,15 +147,15 @@ Both applications share the same codebase but are built and deployed separately,
|
||||
│ Frontend Application │
|
||||
├─────────────────────────────────────────────────────────────┤
|
||||
│ │
|
||||
│ ┌──────────────────────┐ ┌──────────────────────┐ │
|
||||
│ │ Main Application │ │ Marketing Site │ │
|
||||
│ │ (app.igny8.com) │ │ (igny8.com) │ │
|
||||
│ ├──────────────────────┤ ├──────────────────────┤ │
|
||||
│ │ • Authentication │ │ • Public Pages │ │
|
||||
│ │ • Multi-tenant │ │ • SEO Optimized │ │
|
||||
│ │ • Protected Routes │ │ • No Authentication │ │
|
||||
│ │ • Complex Workflows │ │ • Static Content │ │
|
||||
│ └──────────────────────┘ └──────────────────────┘ │
|
||||
│ ┌──────────────────────┐ ┌──────────────────────┐ ┌──────────────────────┐ │
|
||||
│ │ Main Application │ │ Marketing Site │ │ Sites Renderer │ │
|
||||
│ │ (app.igny8.com) │ │ (igny8.com) │ │ (sites.igny8.com) │ │
|
||||
│ ├──────────────────────┤ ├──────────────────────┤ ├──────────────────────┤ │
|
||||
│ │ • Authentication │ │ • Public Pages │ │ • Public Sites │ │
|
||||
│ │ • Multi-tenant │ │ • SEO Optimized │ │ • Dynamic Content │ │
|
||||
│ │ • Protected Routes │ │ • No Authentication │ │ • No Authentication │ │
|
||||
│ │ • Complex Workflows │ │ • Static Content │ │ • Site Blueprints │ │
|
||||
│ └──────────────────────┘ └──────────────────────┘ └──────────────────────┘ │
|
||||
│ │ │ │
|
||||
│ └──────────┬───────────────────┘ │
|
||||
│ │ │
|
||||
@@ -187,6 +190,13 @@ Both applications share the same codebase but are built and deployed separately,
|
||||
- **Port**: 5174 (dev), 8023 (Docker)
|
||||
- **Domain**: `igny8.com`
|
||||
|
||||
#### Sites Renderer Entry
|
||||
- **File**: `sites/src/main.tsx` (separate repository/package)
|
||||
- **HTML**: `sites/index.html`
|
||||
- **Port**: 5176 (dev), 8024 (Docker)
|
||||
- **Domain**: `sites.igny8.com`
|
||||
- **Purpose**: Renders deployed public sites from Site Blueprints
|
||||
|
||||
---
|
||||
|
||||
## Project Structure
|
||||
@@ -274,12 +284,18 @@ frontend/
|
||||
├── vite.config.ts # Vite configuration
|
||||
├── tsconfig.json # TypeScript config
|
||||
├── package.json # Dependencies
|
||||
└── Dockerfile* # Docker files
|
||||
├── Dockerfile* # Docker files
|
||||
└── sites/ # Sites Renderer (separate app)
|
||||
├── src/ # Sites renderer source
|
||||
├── index.html # Sites renderer HTML
|
||||
├── vite.config.ts # Sites Vite config
|
||||
├── package.json # Sites dependencies
|
||||
└── Dockerfile.dev # Sites dev Dockerfile
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Dual Application Architecture
|
||||
## Triple Application Architecture
|
||||
|
||||
### Main Application (`app.igny8.com`)
|
||||
|
||||
@@ -358,6 +374,42 @@ frontend/
|
||||
- Open Graph tags
|
||||
- Twitter Card tags
|
||||
|
||||
### Sites Renderer (`sites.igny8.com`)
|
||||
|
||||
**Purpose**: Public-facing site renderer for deployed IGNY8-hosted sites
|
||||
|
||||
**Characteristics**:
|
||||
- No authentication required
|
||||
- Dynamic content from Site Blueprints
|
||||
- Public access to deployed sites
|
||||
- Separate codebase (`sites/` directory)
|
||||
- React Router for site navigation
|
||||
- API integration for blueprint data
|
||||
|
||||
**Entry Point**: `sites/src/main.tsx` → `sites/src/App.tsx`
|
||||
|
||||
**Technology Stack**:
|
||||
- React 19.2.0
|
||||
- React Router DOM 7.9.6
|
||||
- TypeScript 5.9.3
|
||||
- Vite 7.2.2
|
||||
- Zustand 5.0.8
|
||||
- Axios 1.13.2
|
||||
|
||||
**Features**:
|
||||
- Loads site definitions from backend API
|
||||
- Renders pages from Page Blueprints
|
||||
- Dynamic routing based on site structure
|
||||
- SEO-optimized pages
|
||||
- Responsive design
|
||||
|
||||
**Data Flow**:
|
||||
1. Site slug extracted from URL
|
||||
2. API call to fetch Site Blueprint
|
||||
3. Page Blueprints loaded
|
||||
4. Content rendered from blueprints
|
||||
5. Navigation generated from site structure
|
||||
|
||||
---
|
||||
|
||||
## Routing Architecture
|
||||
@@ -411,10 +463,34 @@ frontend/
|
||||
<Route path="/reference/seed-keywords" element={<SeedKeywords />} />
|
||||
<Route path="/reference/industries" element={<ReferenceIndustries />} />
|
||||
|
||||
{/* Linker Module */}
|
||||
<Route path="/linker" element={<Navigate to="/linker/content" replace />} />
|
||||
<Route path="/linker/content" element={<LinkerContent />} />
|
||||
|
||||
{/* Optimizer Module */}
|
||||
<Route path="/optimizer" element={<Navigate to="/optimizer/content" replace />} />
|
||||
<Route path="/optimizer/content" element={<OptimizerContent />} />
|
||||
<Route path="/optimizer/analyze/:id" element={<OptimizerAnalyze />} />
|
||||
|
||||
{/* Automation */}
|
||||
<Route path="/automation" element={<AutomationDashboard />} />
|
||||
{/* Note: Schedules functionality is integrated into Automation Dashboard */}
|
||||
|
||||
{/* Sites Module */}
|
||||
<Route path="/sites" element={<SiteList />} />
|
||||
<Route path="/sites/manage" element={<SiteManage />} />
|
||||
<Route path="/sites/:id" element={<SiteDashboard />} />
|
||||
<Route path="/sites/:id/content" element={<SiteContent />} />
|
||||
<Route path="/sites/:id/editor" element={<SiteEditor />} />
|
||||
<Route path="/sites/:id/pages" element={<PageManager />} />
|
||||
<Route path="/sites/:id/pages/new" element={<PageManager />} />
|
||||
<Route path="/sites/:id/pages/:pageId/edit" element={<PageManager />} />
|
||||
<Route path="/sites/:id/posts/:postId" element={<PostEditor />} />
|
||||
<Route path="/sites/:id/preview" element={<SitePreview />} />
|
||||
<Route path="/sites/:id/settings" element={<SiteSettings />} />
|
||||
<Route path="/sites/:id/sync" element={<SyncDashboard />} />
|
||||
<Route path="/sites/:id/deploy" element={<DeploymentPanel />} />
|
||||
|
||||
{/* Settings */}
|
||||
<Route path="/settings" element={<GeneralSettings />} />
|
||||
<Route path="/settings/users" element={<Users />} />
|
||||
@@ -458,6 +534,26 @@ frontend/
|
||||
- Reduces initial bundle size
|
||||
- Improves time-to-interactive
|
||||
|
||||
### Sites Renderer Routing
|
||||
|
||||
**Router**: React Router v7 (`BrowserRouter`)
|
||||
|
||||
**Structure**:
|
||||
- Dynamic routing based on Site Blueprint structure
|
||||
- Routes generated from Page Blueprints
|
||||
- Public access (no authentication)
|
||||
- SEO-friendly URLs
|
||||
|
||||
**Key Routes**:
|
||||
- `/:siteSlug` - Site home page
|
||||
- `/:siteSlug/:pageSlug` - Individual pages
|
||||
- Dynamic navigation from site structure
|
||||
|
||||
**Data Loading**:
|
||||
- Site Blueprint loaded on mount
|
||||
- Page Blueprints loaded per route
|
||||
- Content rendered from blueprint data
|
||||
|
||||
### Marketing Site Routing
|
||||
|
||||
**Router**: React Router v7 (`BrowserRouter`)
|
||||
@@ -1051,6 +1147,12 @@ build: {
|
||||
- Marketing-specific configuration
|
||||
- SEO-friendly development
|
||||
|
||||
**Sites Renderer** (Port 5176):
|
||||
- Separate Vite configuration (`sites/vite.config.ts`)
|
||||
- Public site rendering
|
||||
- API integration for blueprints
|
||||
- Dynamic routing from site structure
|
||||
|
||||
#### 4. Custom Plugins
|
||||
|
||||
**bypassHostCheck**:
|
||||
@@ -1128,6 +1230,13 @@ npm run dev:marketing
|
||||
# Runs on http://localhost:5174
|
||||
```
|
||||
|
||||
**Sites Renderer**:
|
||||
```bash
|
||||
cd sites
|
||||
npm run dev
|
||||
# Runs on http://localhost:5176
|
||||
```
|
||||
|
||||
#### 3. Build for Production
|
||||
|
||||
**Main Application**:
|
||||
@@ -1142,6 +1251,13 @@ npm run build:marketing
|
||||
# Output: dist/marketing.html
|
||||
```
|
||||
|
||||
**Sites Renderer**:
|
||||
```bash
|
||||
cd sites
|
||||
npm run build
|
||||
# Output: sites/dist/
|
||||
```
|
||||
|
||||
### Docker Development
|
||||
|
||||
#### Main App Container
|
||||
@@ -1177,6 +1293,8 @@ docker run -p 8023:5174 \
|
||||
| `dev:marketing` | `PORT=5174 vite --port 5174` | Start marketing dev server |
|
||||
| `build` | `vite build` | Build main app |
|
||||
| `build:marketing` | `vite build --mode marketing` | Build marketing site |
|
||||
| `sites:dev` | `cd sites && npm run dev` | Start sites renderer dev server (Port 5176) |
|
||||
| `sites:build` | `cd sites && npm run build` | Build sites renderer |
|
||||
| `type-check` | `tsc -b --noEmit` | Type checking |
|
||||
| `lint` | `eslint .` | Lint code |
|
||||
|
||||
@@ -1206,6 +1324,25 @@ dist/
|
||||
- Static file serving
|
||||
- SPA routing fallback
|
||||
|
||||
#### Sites Renderer
|
||||
|
||||
**Build Output**:
|
||||
```
|
||||
sites/dist/
|
||||
├── index.html
|
||||
├── assets/
|
||||
│ ├── js/
|
||||
│ │ └── [hash].js
|
||||
│ └── css/
|
||||
│ └── [hash].css
|
||||
```
|
||||
|
||||
**Deployment**:
|
||||
- Separate Docker container (`igny8_sites`)
|
||||
- Served via Caddy reverse proxy
|
||||
- Dynamic routing from Site Blueprints
|
||||
- Public access (no authentication)
|
||||
|
||||
#### Marketing Site
|
||||
|
||||
**Build Output**:
|
||||
@@ -1277,6 +1414,21 @@ CMD ["caddy", "run", "--config", "/etc/caddy/Caddyfile"]
|
||||
}
|
||||
```
|
||||
|
||||
#### Sites Renderer (`Caddyfile.sites`)
|
||||
|
||||
```caddy
|
||||
sites.igny8.com {
|
||||
reverse_proxy igny8_sites:5176
|
||||
encode gzip zstd
|
||||
}
|
||||
```
|
||||
|
||||
**Features**:
|
||||
- Public access (no authentication)
|
||||
- Dynamic routing from Site Blueprints
|
||||
- SEO-friendly URLs
|
||||
- HTTPS via Caddy
|
||||
|
||||
#### Marketing Site (`Caddyfile.marketing`)
|
||||
|
||||
```caddy
|
||||
|
||||
Reference in New Issue
Block a user