Files
igny8/master-docs/30-frontend/sites/SITE-DASHBOARD.md
IGNY8 VPS (Salman) 3cbed65601 revamps docs complete
2025-12-07 14:14:29 +00:00

60 lines
3.2 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# Site Dashboard
## Purpose
Provide a per-site overview showing basic site info, stats (pages/content/integrations/deployments), and quick actions for navigation. Serves as the landing view for a specific site id.
## Code Locations (exact paths)
- Page: `frontend/src/pages/Sites/Dashboard.tsx`
- API: `frontend/src/services/api` (`fetchAPI` for `/v1/auth/sites/{id}/`; `fetchSiteStats` placeholder)
- UI: `frontend/src/components/common/{PageMeta,PageHeader,ComponentCard}`, `frontend/src/components/dashboard/EnhancedMetricCard`, `frontend/src/components/sites/SiteProgressWidget`, `frontend/src/components/ui/{card,button}`
## High-Level Responsibilities
- Load a single sites record (name/slug/type/hosting/domain/status) and display a card-based dashboard.
- Show metric cards for pages, integrations, deployments, and content counts (placeholder stats until backend endpoint exists).
- Provide quick actions to manage pages, sync, publish, or open settings.
## Detailed Behavior
- Routing: expects `:id` param; uses `useParams` and `fetchAPI(/v1/auth/sites/{id}/)` to load site.
- Stats: `fetchSiteStats` currently returns placeholder structure (zeros); TODO noted to back with a real endpoint.
- If site not found: shows “Site not found” with Back to Sites button.
- Metric cards (EnhancedMetricCard) link to pages list, published filter, draft filter, integrations tab, deployments preview, and content list.
- Quick actions: buttons for Manage Pages, View Integrations, View Content, Deployments (navigations).
- Header shows site name, slug, type, hosting, optional domain, and Settings button linking to `/sites/{id}/settings`.
- Loading state: spinner until data fetch completes.
## Data Structures / Models Involved (no code)
- Site DTO: `id`, `name`, `slug`, `site_type`, `hosting_type`, `status`, `is_active`, `domain`.
- Stats DTO (placeholder): counts for pages/content/integrations/deployments/views/visitors.
## Execution Flow
- `useEffect` on `siteId``loadSiteData` (Promise.all for site + stats) → set `site` + `stats`.
- Renders cards and actions with derived links.
## Cross-Module Interactions
- Integrations quick action routes to Site Settings integrations tab.
- Content and pages links route to module pages that rely on planner/writer data scoped by site.
## State Transitions
- `loading` gates initial fetch; absent site shows fallback card.
## Error Handling
- Errors during fetch show toast (`Failed to load site data`) and stop loading spinner.
## Tenancy Rules
- Site fetch is account-scoped server-side; client only supplies the site id from the router.
## Billing Rules (if applicable)
- None on this page.
## Background Tasks / Schedulers (if applicable)
- None; no polling.
## Key Design Considerations
- Uses placeholder stats until backend supplies real site analytics; structure prepared for drop-in replacement.
- Quick navigation shortcuts reduce hops for site-level operations.
## How Developers Should Work With This Module
- Replace `fetchSiteStats` with a real endpoint and map returned fields into `statCards`.
- Add new quick actions by extending the ComponentCard grid with navigation handlers.
- Keep links consistent with router paths in `App.tsx` to avoid broken navigation.