# jeanadhm/pixel-perfect-replica architecture

> Architecture diagram of the GitHub repository jeanadhm/pixel-perfect-replica, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-11). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/jeanadhm/pixel-perfect-replica
- Repository: https://github.com/jeanadhm/pixel-perfect-replica

## Overview

AMBS Visibility Hub is a browser-based SEO/GEO operations dashboard with independent manual and demonstration workspaces. Users select a workspace and site, review portfolio and page data, then manage keyword plans, observations, audits, and corrective actions; reports and settings support export and backup. The README documents capabilities beyond the sampled source, so those branches are represented at their route level without inferring internal calls. The excerpts show keyword workflows and action-dialog behavior; storage implementation and several route internals were not sampled.

Main entry points: [`src/components/actions/NewActionDialog.tsx`](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/actions/NewActionDialog.tsx) (Action editor), [`src/routes/sites.tsx`](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/sites.tsx) (Sites inventory), [`src/routes/mots-cles.tsx`](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/mots-cles.tsx) (Keyword planning), [`src/components/layout/WorkspaceOverview.tsx`](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/layout/WorkspaceOverview.tsx) (Workspace overview)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["Application shell"]
  node_workspace["Workspace overview"]
  node_shell["Navigation shell<br/>[AppShell.tsx]"]
  node_settings["Workspace settings<br/>[parametres.tsx]"]
  node_browserstore[("Browser storage")]
end

subgraph group_portfolio["Portfolio and pages"]
  node_home["Portfolio overview"]
  node_sites["Sites inventory<br/>[sites.tsx]"]
  node_pages["Page records<br/>[pages.tsx]"]
  node_content["Content tracking<br/>[pages.tsx]"]
end

subgraph group_operations["SEO and GEO operations"]
  node_seo["SEO tracking<br/>[seo.tsx]"]
  node_keywords["Keyword planning<br/>[mots-cles.tsx]"]
  node_keywordworkflow["Keyword workflow"]
  node_geo["GEO observations<br/>[geo.tsx]"]
  node_prompts["Prompt tracking<br/>[prompts.tsx]"]
  node_audit["Page audits<br/>[audit.tsx]"]
  node_backlinks["Backlink tracking<br/>[backlinks.tsx]"]
  node_competitors["Competitor tracking<br/>[concurrents.tsx]"]
end

subgraph group_management["Actions and reporting"]
  node_actions["Action tracking<br/>[actions.tsx]"]
  node_actiondialog["Action editor"]
  node_leads["Lead management<br/>[leads.tsx]"]
  node_reports["Reports and exports<br/>[rapports.tsx]"]
end

node_user(("Team member"))

node_user -->|"opens dashboard"| node_shell
node_shell -->|"shows overview"| node_home
node_user -->|"chooses workspace"| node_workspace
node_workspace -->|"persists workspace data"| node_browserstore
node_user -->|"reviews sites"| node_sites
node_sites -->|"opens page records"| node_pages
node_user -->|"reviews pages"| node_pages
node_user -->|"reviews observations"| node_seo
node_user -->|"manages keywords"| node_keywords
node_keywords -->|"renders workflow"| node_keywordworkflow
node_user -->|"records observations"| node_geo
node_user -->|"manages prompts"| node_prompts
node_user -->|"reviews page checks"| node_audit
node_audit -->|"creates corrective action"| node_actiondialog
node_user -->|"tracks tasks"| node_actions
node_actions -.->|"opens editor"| node_actiondialog
node_user -->|"tracks content"| node_content
node_user -->|"records backlinks"| node_backlinks
node_user -->|"records competitors"| node_competitors
node_user -->|"manages leads"| node_leads
node_user -->|"exports reports"| node_reports
node_reports -->|"exports workspace data"| node_browserstore
node_user -->|"configures workspace"| node_settings
node_settings -->|"backs up and restores"| node_browserstore
node_sites -->|"creates linked action"| node_actiondialog
node_keywords -->|"links an action"| node_actiondialog
node_geo -->|"creates linked action"| node_actiondialog
node_backlinks -->|"creates linked action"| node_actiondialog
node_competitors -->|"creates linked action"| node_actiondialog

click node_home "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/portfolio/PortfolioOverview.tsx"
click node_workspace "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/layout/WorkspaceOverview.tsx"
click node_shell "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/layout/AppShell.tsx"
click node_sites "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/sites.tsx"
click node_pages "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/pages.tsx"
click node_seo "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/seo.tsx"
click node_keywords "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/mots-cles.tsx"
click node_keywordworkflow "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/keywords/KeywordWorkflow.tsx"
click node_geo "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/geo.tsx"
click node_prompts "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/prompts.tsx"
click node_audit "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/audit.tsx"
click node_actions "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/actions.tsx"
click node_actiondialog "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/actions/NewActionDialog.tsx"
click node_content "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/pages.tsx"
click node_backlinks "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/backlinks.tsx"
click node_competitors "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/concurrents.tsx"
click node_leads "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/leads.tsx"
click node_reports "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/rapports.tsx"
click node_settings "https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/parametres.tsx"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_workspace,node_shell,node_settings,node_browserstore toneBlue
class node_home,node_sites,node_pages,node_content toneAmber
class node_seo,node_keywords,node_keywordworkflow,node_geo,node_prompts,node_audit,node_backlinks,node_competitors toneMint
class node_actions,node_actiondialog,node_leads,node_reports toneRose
class node_user toneIndigo
```

## Components

### Application shell

- [Workspace overview](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/layout/WorkspaceOverview.tsx): `src/components/layout/WorkspaceOverview.tsx`
- [Navigation shell](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/layout/AppShell.tsx): `src/components/layout/AppShell.tsx`
- [Workspace settings](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/parametres.tsx): `src/routes/parametres.tsx`
- **Browser storage**

### Portfolio and pages

- [Portfolio overview](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/portfolio/PortfolioOverview.tsx): `src/components/portfolio/PortfolioOverview.tsx`
- [Sites inventory](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/sites.tsx): `src/routes/sites.tsx`
- [Page records](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/pages.tsx): `src/routes/pages.tsx`
- [Content tracking](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/pages.tsx): `src/routes/pages.tsx`

### SEO and GEO operations

- [SEO tracking](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/seo.tsx): `src/routes/seo.tsx`
- [Keyword planning](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/mots-cles.tsx): `src/routes/mots-cles.tsx`
- [Keyword workflow](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/keywords/KeywordWorkflow.tsx): `src/components/keywords/KeywordWorkflow.tsx`
- [GEO observations](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/geo.tsx): `src/routes/geo.tsx`
- [Prompt tracking](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/prompts.tsx): `src/routes/prompts.tsx`
- [Page audits](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/audit.tsx): `src/routes/audit.tsx`
- [Backlink tracking](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/backlinks.tsx): `src/routes/backlinks.tsx`
- [Competitor tracking](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/concurrents.tsx): `src/routes/concurrents.tsx`

### Actions and reporting

- [Action tracking](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/actions.tsx): `src/routes/actions.tsx`
- [Action editor](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/components/actions/NewActionDialog.tsx): `src/components/actions/NewActionDialog.tsx`
- [Lead management](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/leads.tsx): `src/routes/leads.tsx`
- [Reports and exports](https://github.com/jeanadhm/pixel-perfect-replica/blob/main/src/routes/rapports.tsx): `src/routes/rapports.tsx`

### Other components

- **Team member**

## Connections

- Team member → Navigation shell: opens dashboard
- Navigation shell → Portfolio overview: shows overview
- Team member → Workspace overview: chooses workspace
- Workspace overview → Browser storage: persists workspace data
- Team member → Sites inventory: reviews sites
- Sites inventory → Page records: opens page records
- Team member → Page records: reviews pages
- Team member → SEO tracking: reviews observations
- Team member → Keyword planning: manages keywords
- Keyword planning → Keyword workflow: renders workflow (evidence: `src/routes/mots-cles.tsx`)
- Team member → GEO observations: records observations
- Team member → Prompt tracking: manages prompts
- Team member → Page audits: reviews page checks
- Page audits → Action editor: creates corrective action
- Team member → Action tracking: tracks tasks
- Action tracking → Action editor: opens editor
- Team member → Content tracking: tracks content
- Team member → Backlink tracking: records backlinks
- Team member → Competitor tracking: records competitors
- Team member → Lead management: manages leads
- Team member → Reports and exports: exports reports
- Reports and exports → Browser storage: exports workspace data
- Team member → Workspace settings: configures workspace
- Workspace settings → Browser storage: backs up and restores
- Sites inventory → Action editor: creates linked action (evidence: `src/routes/sites.tsx`)
- Keyword planning → Action editor: links an action (evidence: `src/routes/mots-cles.tsx`)
- GEO observations → Action editor: creates linked action (evidence: `src/routes/geo.tsx`)
- Backlink tracking → Action editor: creates linked action
- Competitor tracking → Action editor: creates linked action