docs: add FalahOS architecture diagram (SVG HTML) + wiki page

2026-07-04 15:20:13 +02:00
parent ef722bcbbe
commit 26340b48c1
3 changed files with 460 additions and 0 deletions
+47
@@ -0,0 +1,47 @@
# FalahOS Architecture Diagram
![FalahOS Architecture](FalahOS-Architecture.html)
> **⚠️ Note:** The diagram is an interactive HTML/SVG file. View it directly by opening the link below.
👉 **[Open Full Architecture Diagram](FalahOS-Architecture.html)** (opens in browser)
---
## System Overview
### Web Layer
- **ummah.falahos.my** — Primary WordPress site with EDD, MailPoet, Members, Tutor LMS
- **my.falahos.my** — Monetisation subdomain with PayPal Standard
- **Cloudflare** — DNS (proxied), WAF security rules, cloudflared tunnel
- **cPanel (RoketServer)** — Shared hosting at 64.20.37.43 with Imunify360
### AI Agent Layer
- **Hermes Agent (Contabo VPS)** — Primary orchestrator at 13.140.161.244
- Gateway (Telegram, WhatsApp)
- Skills engine (60+ skills), MCP tools, sub-agents
- Cron scheduler for automated tasks
- **FalahOS Relay** — Telegram relay bus at :8088 (systemd)
### Agent Fleet (Tailscale Mesh)
| Agent | Host | Port | Role |
|-------|------|------|------|
| Odysseus | Mac Mini 100.72.2.115 | :7860 | API Gateway |
| Pi | Mac Mini 100.72.2.115 | :4747 | AI Assistant |
| OpenHand | Mac Mini 100.72.2.115 | :3000 | Coding Agent |
| OpenClaw | Mac Mini 100.72.2.115 | :3100 | Model Provider |
| Claude Code | Mac Mini 100.72.2.115 | CLI | Coding Assistant |
| Hermes (MBA) | MacBook Air 100.76.3.26 | — | Fallback Agent |
### External Integrations
- **Gitea** (git.falahos.my) — Git repos, CI/CD Actions, Wiki
- **OpenClaw Proxy** → DeepSeek v4, Qwen 3.6 models
- **PayPal Standard** (wanjauhari@me.com)
- **WhatsApp** Baileys bridge (+6013-225 0691)
### Key Architecture Decisions
- **Hybrid model**: cPanel hosts web frontend/payments; Mac Mini/Contabo handle AI compute
- **Tailscale mesh** for inter-agent routing (no exposed ports)
- **FalahOS Ops Chat** as unified agent coordination channel
- **Imunify360** blocks datacenter IPs — cPanel Git/Terminal APIs used as bypass
+409
@@ -0,0 +1,409 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FalahOS Architecture Diagram</title>
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: 'JetBrains Mono', monospace;
background: #020617;
min-height: 100vh;
padding: 2rem;
color: white;
}
.container { max-width: 1200px; margin: 0 auto; }
.header { margin-bottom: 2rem; }
.header-row { display: flex; align-items: center; gap: 1rem; margin-bottom: 0.5rem; }
.pulse-dot {
width: 12px; height: 12px; background: #22d3ee;
border-radius: 50%; animation: pulse 2s infinite;
}
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
h1 { font-size: 1.5rem; font-weight: 700; letter-spacing: -0.025em; }
.subtitle { color: #94a3b8; font-size: 0.875rem; margin-left: 1.75rem; }
.diagram-container {
background: rgba(15, 23, 42, 0.5);
border-radius: 1rem;
border: 1px solid #1e293b;
padding: 1.5rem;
overflow-x: auto;
}
svg { width: 100%; min-width: 1050px; display: block; }
.cards {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 1rem;
margin-top: 2rem;
}
.card {
background: rgba(15, 23, 42, 0.5);
border-radius: 0.75rem;
border: 1px solid #1e293b;
padding: 1.25rem;
}
.card-header { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }
.card-dot { width: 8px; height: 8px; border-radius: 50%; }
.card-dot.cyan { background: #22d3ee; }
.card-dot.emerald { background: #34d399; }
.card-dot.violet { background: #a78bfa; }
.card-dot.amber { background: #fbbf24; }
.card-dot.rose { background: #fb7185; }
.card-dot.slate { background: #94a3b8; }
.card h3 { font-size: 0.875rem; font-weight: 600; }
.card ul { list-style: none; color: #94a3b8; font-size: 0.75rem; }
.card li { margin-bottom: 0.375rem; }
.footer { text-align: center; margin-top: 1.5rem; color: #475569; font-size: 0.75rem; }
</style>
</head>
<body>
<div class="container">
<div class="header">
<div class="header-row">
<div class="pulse-dot"></div>
<h1>FalahOS Architecture</h1>
</div>
<p class="subtitle">Islamic Fintech OS — Multi-Agent AI Infrastructure (2026)</p>
</div>
<div class="diagram-container">
<svg viewBox="0 0 1100 980">
<defs>
<marker id="arrowhead" markerWidth="10" markerHeight="7" refX="9" refY="3.5" orient="auto">
<polygon points="0 0, 10 3.5, 0 7" fill="#64748b" />
</marker>
<marker id="arrowhead-cyan" markerWidth="10" markerHeight="7" refX="9" refY="3.5" orient="auto">
<polygon points="0 0, 10 3.5, 0 7" fill="#22d3ee" />
</marker>
<marker id="arrowhead-emerald" markerWidth="10" markerHeight="7" refX="9" refY="3.5" orient="auto">
<polygon points="0 0, 10 3.5, 0 7" fill="#34d399" />
</marker>
<marker id="arrowhead-violet" markerWidth="10" markerHeight="7" refX="9" refY="3.5" orient="auto">
<polygon points="0 0, 10 3.5, 0 7" fill="#a78bfa" />
</marker>
<marker id="arrowhead-rose" markerWidth="10" markerHeight="7" refX="9" refY="3.5" orient="auto">
<polygon points="0 0, 10 3.5, 0 7" fill="#fb7185" />
</marker>
<pattern id="grid" width="40" height="40" patternUnits="userSpaceOnUse">
<path d="M 40 0 L 0 0 0 40" fill="none" stroke="#1e293b" stroke-width="0.5"/>
</pattern>
<linearGradient id="glow-cyan" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#22d3ee" stop-opacity="0.05"/>
<stop offset="100%" stop-color="#22d3ee" stop-opacity="0"/>
</linearGradient>
<linearGradient id="glow-emerald" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#34d399" stop-opacity="0.05"/>
<stop offset="100%" stop-color="#34d399" stop-opacity="0"/>
</linearGradient>
</defs>
<!-- Background Grid -->
<rect width="100%" height="100%" fill="url(#grid)" />
<!-- ============ USERS / CHANNEL LAYER (Y: 60-160) ============ -->
<!-- Channel: Telegram -->
<rect x="50" y="65" width="150" height="65" rx="6" fill="rgba(30, 41, 59, 0.5)" stroke="#94a3b8" stroke-width="1.5"/>
<text x="125" y="90" fill="white" font-size="11" font-weight="600" text-anchor="middle">📱 Telegram</text>
<text x="125" y="106" fill="#94a3b8" font-size="9" text-anchor="middle">DM + Ops Chat</text>
<text x="125" y="118" fill="#475569" font-size="8" text-anchor="middle">@FalahOS_opsbot</text>
<!-- Channel: WhatsApp -->
<rect x="225" y="65" width="150" height="65" rx="6" fill="rgba(30, 41, 59, 0.5)" stroke="#94a3b8" stroke-width="1.5"/>
<text x="300" y="90" fill="white" font-size="11" font-weight="600" text-anchor="middle">💬 WhatsApp</text>
<text x="300" y="106" fill="#94a3b8" font-size="9" text-anchor="middle">Baileys Bridge</text>
<text x="300" y="118" fill="#475569" font-size="8" text-anchor="middle">+6013-225 0691</text>
<!-- Channel: Web Browser -->
<rect x="400" y="65" width="150" height="65" rx="6" fill="rgba(30, 41, 59, 0.5)" stroke="#94a3b8" stroke-width="1.5"/>
<text x="475" y="90" fill="white" font-size="11" font-weight="600" text-anchor="middle">🌐 Web Browser</text>
<text x="475" y="106" fill="#94a3b8" font-size="9" text-anchor="middle">ummah.falahos.my</text>
<text x="475" y="118" fill="#94a3b8" font-size="9" text-anchor="middle">my.falahos.my</text>
<!-- ============ CLOUDFLARE EDGE (Y: 180-260) ============ -->
<!-- Cloudflare Boundary -->
<rect x="30" y="180" width="1040" height="100" rx="12" fill="rgba(120, 53, 15, 0.08)" stroke="#fbbf24" stroke-width="1" stroke-dasharray="8,4"/>
<text x="42" y="196" fill="#fbbf24" font-size="10" font-weight="600">☁️ Cloudflare Edge (DNS + WAF + CDN)</text>
<!-- CF DNS -->
<rect x="60" y="205" width="130" height="50" rx="6" fill="rgba(120, 53, 15, 0.3)" stroke="#fbbf24" stroke-width="1.5"/>
<text x="125" y="225" fill="white" font-size="11" font-weight="600" text-anchor="middle">DNS</text>
<text x="125" y="241" fill="#94a3b8" font-size="9" text-anchor="middle">Proxied Records</text>
<!-- CF WAF -->
<rect x="220" y="205" width="130" height="50" rx="6" fill="rgba(120, 53, 15, 0.3)" stroke="#fbbf24" stroke-width="1.5"/>
<text x="285" y="225" fill="white" font-size="11" font-weight="600" text-anchor="middle">WAF</text>
<text x="285" y="241" fill="#94a3b8" font-size="9" text-anchor="middle">Security Rules</text>
<!-- CF Tunnel -->
<rect x="380" y="205" width="130" height="50" rx="6" fill="rgba(120, 53, 15, 0.3)" stroke="#fbbf24" stroke-width="1.5"/>
<text x="445" y="225" fill="white" font-size="11" font-weight="600" text-anchor="middle">Tunnel</text>
<text x="445" y="241" fill="#94a3b8" font-size="9" text-anchor="middle">cloudflared</text>
<!-- ============ SERVICE LAYER (Y: 300-610) ============ -->
<!-- === LEFT COLUMN: cPanel Hosting (RoketServer) === -->
<rect x="30" y="310" width="330" height="290" rx="12" fill="rgba(8, 51, 68, 0.06)" stroke="#22d3ee" stroke-width="1" stroke-dasharray="8,4"/>
<text x="42" y="326" fill="#22d3ee" font-size="10" font-weight="600">🖥️ cPanel Hosting — RoketServer (64.20.37.43)</text>
<!-- ummah.falahos.my WordPress -->
<rect x="55" y="340" width="150" height="70" rx="6" fill="rgba(8, 51, 68, 0.4)" stroke="#22d3ee" stroke-width="1.5"/>
<text x="130" y="360" fill="white" font-size="11" font-weight="600" text-anchor="middle">ummah.falahos.my</text>
<text x="130" y="376" fill="#94a3b8" font-size="9" text-anchor="middle">WordPress</text>
<text x="130" y="388" fill="#22d3ee" font-size="8" text-anchor="middle">EDD • MailPoet</text>
<text x="130" y="400" fill="#22d3ee" font-size="8" text-anchor="middle">Members • Tutor LMS</text>
<!-- my.falahos.my WordPress -->
<rect x="55" y="425" width="150" height="70" rx="6" fill="rgba(8, 51, 68, 0.4)" stroke="#22d3ee" stroke-width="1.5"/>
<text x="130" y="445" fill="white" font-size="11" font-weight="600" text-anchor="middle">my.falahos.my</text>
<text x="130" y="461" fill="#94a3b8" font-size="9" text-anchor="middle">WordPress</text>
<text x="130" y="473" fill="#22d3ee" font-size="8" text-anchor="middle">Monetisation</text>
<text x="130" y="485" fill="#94a3b8" font-size="8" text-anchor="middle">PayPal Standard</text>
<!-- MySQL Database -->
<rect x="230" y="355" width="110" height="55" rx="6" fill="rgba(76, 29, 149, 0.4)" stroke="#a78bfa" stroke-width="1.5"/>
<text x="285" y="376" fill="white" font-size="11" font-weight="600" text-anchor="middle">MySQL</text>
<text x="285" y="392" fill="#94a3b8" font-size="9" text-anchor="middle">Shared DB</text>
<!-- cPanel Tools -->
<rect x="230" y="430" width="110" height="65" rx="6" fill="rgba(8, 51, 68, 0.3)" stroke="#22d3ee" stroke-width="1.5"/>
<text x="285" y="450" fill="white" font-size="10" font-weight="600" text-anchor="middle">cPanel</text>
<text x="285" y="464" fill="#94a3b8" font-size="8" text-anchor="middle">Git • Terminal</text>
<text x="285" y="478" fill="#94a3b8" font-size="8" text-anchor="middle">Cron • Softaculous</text>
<!-- === MIDDLE COLUMN: Contabo VPS (13.140.161.244) === -->
<rect x="390" y="310" width="330" height="290" rx="12" fill="rgba(6, 78, 59, 0.06)" stroke="#34d399" stroke-width="1" stroke-dasharray="8,4"/>
<text x="402" y="326" fill="#34d399" font-size="10" font-weight="600">🖥️ Contabo VPS (13.140.161.244) — Hermes Agent</text>
<!-- Hermes Gateway -->
<rect x="415" y="340" width="140" height="55" rx="6" fill="rgba(6, 78, 59, 0.4)" stroke="#34d399" stroke-width="1.5"/>
<text x="485" y="358" fill="white" font-size="11" font-weight="600" text-anchor="middle">Hermes Gateway</text>
<text x="485" y="374" fill="#94a3b8" font-size="8" text-anchor="middle">Telegram • WhatsApp</text>
<text x="485" y="385" fill="#94a3b8" font-size="8" text-anchor="middle">Systemd Service</text>
<!-- Hermes Agent Core -->
<rect x="415" y="410" width="140" height="85" rx="6" fill="rgba(6, 78, 59, 0.4)" stroke="#34d399" stroke-width="1.5"/>
<text x="485" y="428" fill="white" font-size="11" font-weight="600" text-anchor="middle">Hermes Agent</text>
<text x="485" y="444" fill="#94a3b8" font-size="8" text-anchor="middle">Skills (60+)</text>
<text x="485" y="456" fill="#94a3b8" font-size="8" text-anchor="middle">Tools (MCP, Browser)</text>
<text x="485" y="468" fill="#94a3b8" font-size="8" text-anchor="middle">Sub-agents</text>
<text x="485" y="480" fill="#94a3b8" font-size="8" text-anchor="middle">Cron Scheduler</text>
<!-- FalahOS Relay -->
<rect x="575" y="340" width="120" height="55" rx="6" fill="rgba(6, 78, 59, 0.4)" stroke="#34d399" stroke-width="1.5"/>
<text x="635" y="358" fill="white" font-size="11" font-weight="600" text-anchor="middle">FalahOS Relay</text>
<text x="635" y="374" fill="#94a3b8" font-size="8" text-anchor="middle">Port :8088</text>
<text x="635" y="385" fill="#94a3b8" font-size="8" text-anchor="middle">Systemd</text>
<!-- SSH Tunnel (Mac Mini port forward) -->
<rect x="575" y="410" width="120" height="55" rx="6" fill="rgba(6, 78, 59, 0.4)" stroke="#34d399" stroke-width="1.5"/>
<text x="635" y="428" fill="white" font-size="11" font-weight="600" text-anchor="middle">SSH Tunnel</text>
<text x="635" y="444" fill="#94a3b8" font-size="8" text-anchor="middle">→ Mac Mini :7860</text>
<text x="635" y="456" fill="#94a3b8" font-size="8" text-anchor="middle">(ComfyUI)</text>
<!-- === RIGHT COLUMN: External Services === -->
<rect x="750" y="310" width="320" height="290" rx="12" fill="rgba(30, 41, 59, 0.06)" stroke="#94a3b8" stroke-width="1" stroke-dasharray="8,4"/>
<text x="762" y="326" fill="#94a3b8" font-size="10" font-weight="600">🔗 External Services</text>
<!-- Gitea -->
<rect x="770" y="340" width="140" height="55" rx="6" fill="rgba(120, 53, 15, 0.3)" stroke="#fbbf24" stroke-width="1.5"/>
<text x="840" y="358" fill="white" font-size="11" font-weight="600" text-anchor="middle">Gitea</text>
<text x="840" y="374" fill="#94a3b8" font-size="8" text-anchor="middle">git.falahos.my</text>
<text x="840" y="385" fill="#94a3b8" font-size="8" text-anchor="middle">CI/CD + Wiki</text>
<!-- OpenClaw Model Proxy -->
<rect x="770" y="410" width="140" height="55" rx="6" fill="rgba(251, 146, 60, 0.3)" stroke="#fb923c" stroke-width="1.5"/>
<text x="840" y="428" fill="white" font-size="11" font-weight="600" text-anchor="middle">OpenClaw Proxy</text>
<text x="840" y="444" fill="#94a3b8" font-size="8" text-anchor="middle">opencode.ai/zen</text>
<text x="840" y="456" fill="#94a3b8" font-size="8" text-anchor="middle">DeepSeek • Qwen</text>
<!-- PayPal -->
<rect x="930" y="340" width="120" height="55" rx="6" fill="rgba(30, 41, 59, 0.5)" stroke="#94a3b8" stroke-width="1.5"/>
<text x="990" y="358" fill="white" font-size="11" font-weight="600" text-anchor="middle">PayPal</text>
<text x="990" y="374" fill="#94a3b8" font-size="8" text-anchor="middle">Standard</text>
<text x="990" y="385" fill="#94a3b8" font-size="8" text-anchor="middle">wanjauhari@me.com</text>
<!-- MCP Tools -->
<rect x="930" y="410" width="120" height="55" rx="6" fill="rgba(30, 41, 59, 0.5)" stroke="#94a3b8" stroke-width="1.5"/>
<text x="990" y="428" fill="white" font-size="11" font-weight="600" text-anchor="middle">MCP Servers</text>
<text x="990" y="444" fill="#94a3b8" font-size="8" text-anchor="middle">UI/UX Tester</text>
<text x="990" y="456" fill="#94a3b8" font-size="8" text-anchor="middle">Browser Tools</text>
<!-- ============ TAILSCALE AGENT MESH (Y: 640-860) ============ -->
<!-- Tailscale Region Boundary -->
<rect x="30" y="640" width="1040" height="230" rx="12" fill="rgba(251, 191, 36, 0.04)" stroke="#fbbf24" stroke-width="1" stroke-dasharray="8,4"/>
<text x="42" y="656" fill="#fbbf24" font-size="10" font-weight="600">🔗 Tailscale Mesh Network (Agent Fleet)</text>
<!-- Agent cards row --->
<!-- Odysseus -->
<rect x="55" y="670" width="155" height="80" rx="6" fill="rgba(136, 19, 55, 0.4)" stroke="#fb7185" stroke-width="1.5"/>
<text x="132" y="690" fill="white" font-size="11" font-weight="600" text-anchor="middle">Odysseus</text>
<text x="132" y="706" fill="#94a3b8" font-size="9" text-anchor="middle">API Gateway</text>
<text x="132" y="720" fill="#94a3b8" font-size="8" text-anchor="middle">Mac Mini :7860</text>
<text x="132" y="734" fill="#94a3b8" font-size="8" text-anchor="middle">100.72.2.115</text>
<!-- Pi -->
<rect x="225" y="670" width="155" height="80" rx="6" fill="rgba(136, 19, 55, 0.4)" stroke="#fb7185" stroke-width="1.5"/>
<text x="302" y="690" fill="white" font-size="11" font-weight="600" text-anchor="middle">Pi</text>
<text x="302" y="706" fill="#94a3b8" font-size="9" text-anchor="middle">AI Assistant</text>
<text x="302" y="720" fill="#94a3b8" font-size="8" text-anchor="middle">Mac Mini :4747</text>
<!-- OpenHand -->
<rect x="395" y="670" width="155" height="80" rx="6" fill="rgba(136, 19, 55, 0.4)" stroke="#fb7185" stroke-width="1.5"/>
<text x="472" y="690" fill="white" font-size="11" font-weight="600" text-anchor="middle">OpenHand</text>
<text x="472" y="706" fill="#94a3b8" font-size="9" text-anchor="middle">Coding Agent</text>
<text x="472" y="720" fill="#94a3b8" font-size="8" text-anchor="middle">Mac Mini :3000</text>
<!-- OpenClaw -->
<rect x="565" y="670" width="155" height="80" rx="6" fill="rgba(251, 146, 60, 0.3)" stroke="#fb923c" stroke-width="1.5"/>
<text x="642" y="690" fill="white" font-size="11" font-weight="600" text-anchor="middle">OpenClaw</text>
<text x="642" y="706" fill="#94a3b8" font-size="9" text-anchor="middle">Model Provider</text>
<text x="642" y="720" fill="#94a3b8" font-size="8" text-anchor="middle">Mac Mini :3100</text>
<text x="642" y="734" fill="#94a3b8" font-size="8" text-anchor="middle">DeepSeek • Qwen</text>
<!-- Claude Code -->
<rect x="735" y="670" width="155" height="80" rx="6" fill="rgba(136, 19, 55, 0.4)" stroke="#fb7185" stroke-width="1.5"/>
<text x="812" y="690" fill="white" font-size="11" font-weight="600" text-anchor="middle">Claude Code</text>
<text x="812" y="706" fill="#94a3b8" font-size="9" text-anchor="middle">Coding Assistant</text>
<text x="812" y="720" fill="#94a3b8" font-size="8" text-anchor="middle">Mac Mini CLI</text>
<!-- Hermes (MBA) -->
<rect x="905" y="670" width="145" height="80" rx="6" fill="rgba(6, 78, 59, 0.4)" stroke="#34d399" stroke-width="1.5"/>
<text x="977" y="690" fill="white" font-size="11" font-weight="600" text-anchor="middle">Hermes (MBA)</text>
<text x="977" y="706" fill="#94a3b8" font-size="9" text-anchor="middle">Fallback Agent</text>
<text x="977" y="720" fill="#94a3b8" font-size="8" text-anchor="middle">100.76.3.26</text>
<!-- Agent Cluster Tag -->
<rect x="55" y="768" width="995" height="40" rx="6" fill="rgba(120, 53, 15, 0.2)" stroke="#fbbf24" stroke-width="1"/>
<text x="552" y="792" fill="#fbbf24" font-size="10" font-weight="600" text-anchor="middle">Mac Mini (100.72.2.115) + MacBook Air (100.76.3.26) — macOS</text>
<!-- ============ CONNECTION ARROWS ============ -->
<!-- Users → Cloudflare -->
<line x1="125" y1="130" x2="125" y2="203" stroke="#22d3ee" stroke-width="1.5" marker-end="url(#arrowhead-cyan)"/>
<line x1="300" y1="130" x2="300" y2="203" stroke="#22d3ee" stroke-width="1.5" marker-end="url(#arrowhead-cyan)"/>
<line x1="475" y1="130" x2="475" y2="203" stroke="#22d3ee" stroke-width="1.5" marker-end="url(#arrowhead-cyan)"/>
<!-- Cloudflare → cPanel -->
<path d="M 380 255 L 380 280 Q 380 295 195 295 L 195 338" fill="none" stroke="#22d3ee" stroke-width="1.5" marker-end="url(#arrowhead-cyan)"/>
<text x="290" y="290" fill="#22d3ee" font-size="8" text-anchor="middle">HTTPS (Proxied)</text>
<!-- Cloudflare → Contabo -->
<path d="M 445 255 L 445 338" fill="none" stroke="#34d399" stroke-width="1.5" marker-end="url(#arrowhead-emerald)"/>
<text x="458" y="300" fill="#34d399" font-size="8">Webhooks</text>
<!-- Hermes Gateway → Relay -->
<line x1="485" y1="395" x2="635" y2="395" stroke="#34d399" stroke-width="1.5" marker-end="url(#arrowhead-emerald)"/>
<text x="555" y="390" fill="#94a3b8" font-size="8" text-anchor="middle">Relay Bus</text>
<!-- Relay → Tailscale Agents -->
<path d="M 635 395 L 635 420 Q 635 450 635 460 L 635 668" fill="none" stroke="#34d399" stroke-width="1.5" marker-end="url(#arrowhead-emerald)"/>
<text x="648" y="560" fill="#34d399" font-size="8">Relay Protocol</text>
<!-- Contabo → Tailscale direct -->
<path d="M 485 495 L 485 520 Q 485 560 132 560 L 132 668" fill="none" stroke="#fb7185" stroke-width="1.5" stroke-dasharray="5,5"/>
<text x="300" y="555" fill="#fb7185" font-size="8" text-anchor="middle">SSH Tunnel (:17860)</text>
<!-- cPanel → PayPal -->
<path d="M 185 460 L 185 490 Q 185 510 990 510 L 990 395" fill="none" stroke="#94a3b8" stroke-width="1.5" marker-end="url(#arrowhead)"/>
<text x="590" y="505" fill="#94a3b8" font-size="8" text-anchor="middle">Payment IPN</text>
<!-- cPanel → Gitea -->
<path d="M 185 500 L 185 530 Q 185 545 840 545 L 840 395" fill="none" stroke="#fbbf24" stroke-width="1.5" marker-end="url(#arrowhead)"/>
<text x="520" y="540" fill="#fbbf24" font-size="8" text-anchor="middle">Git Deploy</text>
<!-- Contabo → Gitea -->
<path d="M 636 465 L 636 490 Q 636 545 840 545 L 840 395" fill="none" stroke="#fbbf24" stroke-width="1.5" marker-end="url(#arrowhead)"/>
<text x="740" y="540" fill="#fbbf24" font-size="8">CI/CD</text>
<!-- OpenClaw Mac Mini → OpenClaw Proxy (external) -->
<path d="M 642 750 L 642 760 Q 642 770 840 770 L 840 465" fill="none" stroke="#fb923c" stroke-width="1.5" marker-end="url(#arrowhead)"/>
<text x="750" y="765" fill="#fb923c" font-size="8">API Calls</text>
<!-- cPanel → MySQL (internal DB) -->
<line x1="205" y1="390" x2="228" y2="382" stroke="#a78bfa" stroke-width="1.5" marker-end="url(#arrowhead-violet)"/>
<!-- ummah → my.falahos (data flow) -->
<line x1="130" y1="410" x2="130" y2="423" stroke="#22d3ee" stroke-width="1.5" marker-end="url(#arrowhead-cyan)"/>
<!-- ============ LEGEND (Bottom-right) ============ -->
<rect x="750" y="830" width="300" height="120" rx="8" fill="rgba(15, 23, 42, 0.8)" stroke="#1e293b" stroke-width="1"/>
<text x="760" y="846" fill="white" font-size="10" font-weight="600">Legend</text>
<rect x="760" y="856" width="14" height="9" rx="2" fill="rgba(8, 51, 68, 0.4)" stroke="#22d3ee" stroke-width="1"/>
<text x="780" y="864" fill="#94a3b8" font-size="8">Frontend / Web</text>
<rect x="760" y="870" width="14" height="9" rx="2" fill="rgba(6, 78, 59, 0.4)" stroke="#34d399" stroke-width="1"/>
<text x="780" y="878" fill="#94a3b8" font-size="8">Backend / Agent</text>
<rect x="760" y="884" width="14" height="9" rx="2" fill="rgba(120, 53, 15, 0.3)" stroke="#fbbf24" stroke-width="1"/>
<text x="780" y="892" fill="#94a3b8" font-size="8">Cloud Service</text>
<rect x="760" y="898" width="14" height="9" rx="2" fill="rgba(76, 29, 149, 0.4)" stroke="#a78bfa" stroke-width="1"/>
<text x="780" y="906" fill="#94a3b8" font-size="8">Database</text>
<rect x="900" y="856" width="14" height="9" rx="2" fill="rgba(136, 19, 55, 0.4)" stroke="#fb7185" stroke-width="1"/>
<text x="920" y="864" fill="#94a3b8" font-size="8">Agent / Security</text>
<line x1="900" y1="878" x2="914" y2="878" stroke="#fb7185" stroke-width="1" stroke-dasharray="3,3"/>
<text x="920" y="881" fill="#94a3b8" font-size="8">Tunnel / Auth Flow</text>
<rect x="900" y="890" width="14" height="9" rx="2" fill="rgba(251, 146, 60, 0.3)" stroke="#fb923c" stroke-width="1"/>
<text x="920" y="898" fill="#94a3b8" font-size="8">Model Provider</text>
</svg>
</div>
<!-- Info Cards -->
<div class="cards">
<div class="card">
<div class="card-header">
<div class="card-dot cyan"></div>
<h3>Web Layer</h3>
</div>
<ul>
<li>• ummah.falahos.my — Primary WP site (EDD, MailPoet, Members, Tutor LMS)</li>
<li>• my.falahos.my — Monetisation subdomain (PayPal Standard)</li>
<li>• Cloudflare DNS + WAF (proxied records)</li>
<li>• Imunify360 (cPanel) blocks datacenter IPs</li>
</ul>
</div>
<div class="card">
<div class="card-header">
<div class="card-dot emerald"></div>
<h3>AI Agent Layer</h3>
</div>
<ul>
<li>• Hermes Agent (Contabo) — Primary orchestrator</li>
<li>• FalahOS Ops Chat — Telegram relay bus</li>
<li>• Mac Mini Agent Fleet — Odysseus, Pi, OpenHand, OpenClaw</li>
<li>• Claude Code + Hermes (MBA) — Fallback / support</li>
<li>• Tailscale mesh network for inter-agent routing</li>
</ul>
</div>
<div class="card">
<div class="card-header">
<div class="card-dot amber"></div>
<h3>External Integrations</h3>
</div>
<ul>
<li>• Gitea (git.falahos.my) — Git repos, CI/CD, Wiki</li>
<li>• OpenClaw Proxy → DeepSeek v4, Qwen 3.6 models</li>
<li>• PayPal Standard (wanjauhari@me.com)</li>
<li>• WhatsApp Baileys bridge (+6013-225 0691)</li>
</ul>
</div>
</div>
<p class="footer">
FalahOS • Islamic Fintech OS • Multi-Agent AI Infrastructure • 2026-07-04
</p>
</div>
</body>
</html>
+4
@@ -17,3 +17,7 @@ Welcome to the Falah Mobile wiki.
## Getting Started
See the main repo README for setup instructions.
## Architecture
- **[[Architecture-Diagram]]** — Full FalahOS system architecture diagram (web layer, AI agents, infrastructure, external services)