provisioning-code/resources/diagrams/arch-diagram.svg
Jesús Pérez b1c8e38a61 init repo
2026-07-09 20:36:57 +01:00

253 lines
15 KiB
XML

<svg viewBox="0 0 1200 900" xmlns="http://www.w3.org/2000/svg">
<defs>
<!-- Gradients -->
<linearGradient id="coreGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#667eea;stop-opacity:1" />
<stop offset="100%" style="stop-color:#764ba2;stop-opacity:1" />
</linearGradient>
<linearGradient id="configGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#06b6d4;stop-opacity:1" />
<stop offset="100%" style="stop-color:#0891b2;stop-opacity:1" />
</linearGradient>
<linearGradient id="extensionGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#10b981;stop-opacity:1" />
<stop offset="100%" style="stop-color:#059669;stop-opacity:1" />
</linearGradient>
<linearGradient id="orchestrationGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#f59e0b;stop-opacity:1" />
<stop offset="100%" style="stop-color:#d97706;stop-opacity:1" />
</linearGradient>
<linearGradient id="runtimeGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#8b5cf6;stop-opacity:1" />
<stop offset="100%" style="stop-color:#7c3aed;stop-opacity:1" />
</linearGradient>
<!-- Arrow markers -->
<marker id="arrowBlue" markerWidth="10" markerHeight="10" refX="9" refY="3" orient="auto" markerUnits="strokeWidth">
<path d="M0,0 L0,6 L9,3 z" fill="#3b82f6" />
</marker>
<marker id="arrowGreen" markerWidth="10" markerHeight="10" refX="9" refY="3" orient="auto" markerUnits="strokeWidth">
<path d="M0,0 L0,6 L9,3 z" fill="#10b981" />
</marker>
<marker id="arrowOrange" markerWidth="10" markerHeight="10" refX="9" refY="3" orient="auto" markerUnits="strokeWidth">
<path d="M0,0 L0,6 L9,3 z" fill="#f59e0b" />
</marker>
<marker id="arrowRed" markerWidth="10" markerHeight="10" refX="9" refY="3" orient="auto" markerUnits="strokeWidth">
<path d="M0,0 L0,6 L9,3 z" fill="#ef4444" />
</marker>
</defs>
<!-- Background -->
<rect width="1200" height="900" fill="#f8fafc"/>
<!-- Title -->
<text x="600" y="35" font-family="Arial, sans-serif" font-size="24" font-weight="bold" text-anchor="middle" fill="#1e293b">
Infrastructure Provisioning System Architecture
</text>
<!-- Data Flow Legend -->
<g transform="translate(50, 60)">
<text x="0" y="0" font-family="Arial, sans-serif" font-size="12" font-weight="600" fill="#475569">Data Flows:</text>
<line x1="0" y1="10" x2="40" y2="10" stroke="#3b82f6" stroke-width="2" marker-end="url(#arrowBlue)"/>
<text x="45" y="14" font-family="Arial, sans-serif" font-size="11" fill="#64748b">User Input</text>
<line x1="120" y1="10" x2="160" y2="10" stroke="#10b981" stroke-width="2" marker-end="url(#arrowGreen)"/>
<text x="165" y="14" font-family="Arial, sans-serif" font-size="11" fill="#64748b">Configuration</text>
<line x1="260" y1="10" x2="300" y2="10" stroke="#f59e0b" stroke-width="2" marker-end="url(#arrowOrange)"/>
<text x="305" y="14" font-family="Arial, sans-serif" font-size="11" fill="#64748b">Task Flow</text>
<line x1="380" y1="10" x2="420" y2="10" stroke="#ef4444" stroke-width="2" marker-end="url(#arrowRed)"/>
<text x="425" y="14" font-family="Arial, sans-serif" font-size="11" fill="#64748b">Cloud Output</text>
</g>
<!-- Central Core -->
<g id="core">
<circle cx="600" cy="400" r="80" fill="url(#coreGrad)" opacity="0.9"/>
<circle cx="600" cy="400" r="78" fill="none" stroke="#ffffff" stroke-width="2"/>
<text x="600" y="390" font-family="Arial, sans-serif" font-size="16" font-weight="bold" text-anchor="middle" fill="#ffffff">
Provisioning
</text>
<text x="600" y="410" font-family="Arial, sans-serif" font-size="16" font-weight="bold" text-anchor="middle" fill="#ffffff">
Core
</text>
<!-- Core Components -->
<circle cx="600" cy="360" r="8" fill="#ffffff" opacity="0.8"/>
<text x="600" y="348" font-family="Arial, sans-serif" font-size="9" text-anchor="middle" fill="#ffffff">CLI</text>
<circle cx="570" cy="420" r="8" fill="#ffffff" opacity="0.8"/>
<text x="555" y="440" font-family="Arial, sans-serif" font-size="9" text-anchor="middle" fill="#ffffff">Libraries</text>
<circle cx="630" cy="420" r="8" fill="#ffffff" opacity="0.8"/>
<text x="640" y="440" font-family="Arial, sans-serif" font-size="9" text-anchor="middle" fill="#ffffff">Plugins</text>
</g>
<!-- Configuration Layer (Top Left) -->
<g id="configLayer">
<rect x="180" y="180" width="200" height="140" rx="8" fill="url(#configGrad)" opacity="0.15" stroke="#06b6d4" stroke-width="2"/>
<text x="280" y="205" font-family="Arial, sans-serif" font-size="14" font-weight="bold" text-anchor="middle" fill="#0891b2">
Configuration Layer
</text>
<!-- Sub-components -->
<rect x="200" y="225" width="160" height="35" rx="4" fill="#ffffff" stroke="#06b6d4" stroke-width="1.5"/>
<text x="280" y="247" font-family="Arial, sans-serif" font-size="12" text-anchor="middle" fill="#0e7490">
Nickel Schemas
</text>
<rect x="200" y="270" width="160" height="35" rx="4" fill="#ffffff" stroke="#06b6d4" stroke-width="1.5"/>
<text x="280" y="292" font-family="Arial, sans-serif" font-size="12" text-anchor="middle" fill="#0e7490">
Validation Engine
</text>
</g>
<!-- Extension Ecosystem (Top Right) -->
<g id="extensionLayer">
<rect x="820" y="180" width="200" height="140" rx="8" fill="url(#extensionGrad)" opacity="0.15" stroke="#10b981" stroke-width="2"/>
<text x="920" y="205" font-family="Arial, sans-serif" font-size="14" font-weight="bold" text-anchor="middle" fill="#059669">
Extension Ecosystem
</text>
<!-- Provider plugins -->
<rect x="840" y="225" width="75" height="30" rx="4" fill="#ffffff" stroke="#10b981" stroke-width="1.5"/>
<text x="877" y="244" font-family="Arial, sans-serif" font-size="11" text-anchor="middle" fill="#047857">Hetzner</text>
<rect x="925" y="225" width="75" height="30" rx="4" fill="#ffffff" stroke="#10b981" stroke-width="1.5"/>
<text x="962" y="244" font-family="Arial, sans-serif" font-size="11" text-anchor="middle" fill="#047857">AWS</text>
<rect x="840" y="265" width="160" height="30" rx="4" fill="#ffffff" stroke="#10b981" stroke-width="1.5"/>
<text x="920" y="284" font-family="Arial, sans-serif" font-size="11" text-anchor="middle" fill="#047857">Kubernetes Provider</text>
</g>
<!-- Orchestration Engine (Bottom Left) -->
<g id="orchestrationLayer">
<rect x="180" y="520" width="200" height="160" rx="8" fill="url(#orchestrationGrad)" opacity="0.15" stroke="#f59e0b" stroke-width="2"/>
<text x="280" y="545" font-family="Arial, sans-serif" font-size="14" font-weight="bold" text-anchor="middle" fill="#d97706">
Orchestration Engine
</text>
<!-- Orchestration components -->
<circle cx="230" cy="580" r="18" fill="#f59e0b" opacity="0.8"/>
<text x="230" y="585" font-family="Arial, sans-serif" font-size="10" font-weight="bold" text-anchor="middle" fill="#ffffff">B</text>
<text x="230" y="610" font-family="Arial, sans-serif" font-size="10" text-anchor="middle" fill="#d97706">Batch</text>
<circle cx="280" cy="580" r="18" fill="#f59e0b" opacity="0.8"/>
<text x="280" y="585" font-family="Arial, sans-serif" font-size="10" font-weight="bold" text-anchor="middle" fill="#ffffff">E</text>
<text x="280" y="610" font-family="Arial, sans-serif" font-size="10" text-anchor="middle" fill="#d97706">Execution</text>
<circle cx="330" cy="580" r="18" fill="#f59e0b" opacity="0.8"/>
<text x="330" y="585" font-family="Arial, sans-serif" font-size="10" font-weight="bold" text-anchor="middle" fill="#ffffff">S</text>
<text x="330" y="610" font-family="Arial, sans-serif" font-size="10" text-anchor="middle" fill="#d97706">State</text>
<rect x="200" y="630" width="160" height="35" rx="4" fill="#ffffff" stroke="#f59e0b" stroke-width="1.5"/>
<text x="280" y="652" font-family="Arial, sans-serif" font-size="11" text-anchor="middle" fill="#d97706">
Workflow Manager
</text>
</g>
<!-- Workspace Runtime (Bottom Right) -->
<g id="runtimeLayer">
<rect x="820" y="520" width="200" height="160" rx="8" fill="url(#runtimeGrad)" opacity="0.15" stroke="#8b5cf6" stroke-width="2"/>
<text x="920" y="545" font-family="Arial, sans-serif" font-size="14" font-weight="bold" text-anchor="middle" fill="#7c3aed">
Workspace Runtime
</text>
<!-- Runtime components -->
<rect x="840" y="565" width="160" height="35" rx="4" fill="#ffffff" stroke="#8b5cf6" stroke-width="1.5"/>
<text x="920" y="587" font-family="Arial, sans-serif" font-size="11" text-anchor="middle" fill="#7c3aed">
Context Management
</text>
<rect x="840" y="610" width="160" height="35" rx="4" fill="#ffffff" stroke="#8b5cf6" stroke-width="1.5"/>
<text x="920" y="632" font-family="Arial, sans-serif" font-size="11" text-anchor="middle" fill="#7c3aed">
Multi-Environment
</text>
</g>
<!-- User Input -->
<g id="userInput">
<rect x="520" y="120" width="160" height="50" rx="6" fill="#3b82f6" opacity="0.2" stroke="#3b82f6" stroke-width="2" stroke-dasharray="5,5"/>
<text x="600" y="140" font-family="Arial, sans-serif" font-size="13" font-weight="600" text-anchor="middle" fill="#1e40af">
👤 User Input
</text>
<text x="600" y="158" font-family="Arial, sans-serif" font-size="11" text-anchor="middle" fill="#1e40af">
Commands and Config
</text>
</g>
<!-- Workspace Nodes at Bottom -->
<g id="workspaces" transform="translate(300, 750)">
<text x="300" y="-15" font-family="Arial, sans-serif" font-size="13" font-weight="600" text-anchor="middle" fill="#475569">
Deployment Targets
</text>
<rect x="50" y="0" width="140" height="60" rx="6" fill="#ffffff" stroke="#64748b" stroke-width="2"/>
<text x="120" y="22" font-family="Arial, sans-serif" font-size="12" font-weight="600" text-anchor="middle" fill="#334155">Development</text>
<text x="120" y="38" font-family="Arial, sans-serif" font-size="10" text-anchor="middle" fill="#64748b">workspace-dev</text>
<text x="120" y="52" font-family="Arial, sans-serif" font-size="9" text-anchor="middle" fill="#94a3b8">🔧 Testing</text>
<rect x="230" y="0" width="140" height="60" rx="6" fill="#ffffff" stroke="#64748b" stroke-width="2"/>
<text x="300" y="22" font-family="Arial, sans-serif" font-size="12" font-weight="600" text-anchor="middle" fill="#334155">Staging</text>
<text x="300" y="38" font-family="Arial, sans-serif" font-size="10" text-anchor="middle" fill="#64748b">workspace-staging</text>
<text x="300" y="52" font-family="Arial, sans-serif" font-size="9" text-anchor="middle" fill="#94a3b8">🧪 Pre-Production</text>
<rect x="410" y="0" width="140" height="60" rx="6" fill="#ffffff" stroke="#64748b" stroke-width="2"/>
<text x="480" y="22" font-family="Arial, sans-serif" font-size="12" font-weight="600" text-anchor="middle" fill="#334155">Production</text>
<text x="480" y="38" font-family="Arial, sans-serif" font-size="10" text-anchor="middle" fill="#64748b">workspace-prod</text>
<text x="480" y="52" font-family="Arial, sans-serif" font-size="9" text-anchor="middle" fill="#94a3b8">🚀 Live</text>
</g>
<!-- Cloud Endpoints -->
<g id="cloudEndpoints">
<ellipse cx="1100" cy="350" rx="60" ry="35" fill="#ef4444" opacity="0.2" stroke="#ef4444" stroke-width="2"/>
<text x="1100" y="350" font-family="Arial, sans-serif" font-size="11" font-weight="600" text-anchor="middle" fill="#dc2626">☁️ Hetzner</text>
<text x="1100" y="365" font-family="Arial, sans-serif" font-size="9" text-anchor="middle" fill="#b91c1c">Cloud Services</text>
<ellipse cx="1100" cy="430" rx="60" ry="35" fill="#ef4444" opacity="0.2" stroke="#ef4444" stroke-width="2"/>
<text x="1100" y="430" font-family="Arial, sans-serif" font-size="11" font-weight="600" text-anchor="middle" fill="#dc2626">☁️ AWS</text>
<text x="1100" y="445" font-family="Arial, sans-serif" font-size="9" text-anchor="middle" fill="#b91c1c">Infrastructure</text>
<ellipse cx="1100" cy="510" rx="60" ry="35" fill="#ef4444" opacity="0.2" stroke="#ef4444" stroke-width="2"/>
<text x="1100" y="510" font-family="Arial, sans-serif" font-size="11" font-weight="600" text-anchor="middle" fill="#dc2626">⎈ K8s</text>
<text x="1100" y="525" font-family="Arial, sans-serif" font-size="9" text-anchor="middle" fill="#b91c1c">Clusters</text>
</g>
<!-- Data Flow Arrows -->
<!-- Blue: User Input to Core -->
<path d="M 600 170 L 600 320" fill="none" stroke="#3b82f6" stroke-width="3" marker-end="url(#arrowBlue)"/>
<!-- Green: Core to Configuration Layer -->
<path d="M 540 360 Q 450 300 380 250" fill="none" stroke="#10b981" stroke-width="2.5" marker-end="url(#arrowGreen)"/>
<!-- Green: Configuration validation flow -->
<path d="M 280 320 Q 280 360 520 380" fill="none" stroke="#10b981" stroke-width="2" marker-end="url(#arrowGreen)" stroke-dasharray="4,4"/>
<!-- Orange: Core to Orchestration -->
<path d="M 550 450 Q 450 500 380 580" fill="none" stroke="#f59e0b" stroke-width="2.5" marker-end="url(#arrowOrange)"/>
<!-- Orange: Task flow within orchestration -->
<line x1="248" y1="580" x2="262" y2="580" stroke="#f59e0b" stroke-width="2"/>
<line x1="298" y1="580" x2="312" y2="580" stroke="#f59e0b" stroke-width="2"/>
<!-- Core to Extension Ecosystem -->
<path d="M 660 360 Q 750 300 820 250" fill="none" stroke="#10b981" stroke-width="2.5" marker-end="url(#arrowGreen)"/>
<!-- Core to Runtime -->
<path d="M 650 450 Q 750 500 820 580" fill="none" stroke="#8b5cf6" stroke-width="2.5"/>
<!-- Red: Extensions to Cloud Endpoints -->
<path d="M 1020 240 Q 1060 280 1070 315" fill="none" stroke="#ef4444" stroke-width="2.5" marker-end="url(#arrowRed)"/>
<path d="M 1020 265 Q 1050 340 1070 395" fill="none" stroke="#ef4444" stroke-width="2.5" marker-end="url(#arrowRed)"/>
<path d="M 1020 280 Q 1050 400 1070 475" fill="none" stroke="#ef4444" stroke-width="2.5" marker-end="url(#arrowRed)"/>
<!-- Runtime to Workspaces -->
<path d="M 880 680 L 680 735" fill="none" stroke="#8b5cf6" stroke-width="2" marker-end="url(#arrowBlue)" stroke-dasharray="3,3"/>
<path d="M 920 680 L 720 735" fill="none" stroke="#8b5cf6" stroke-width="2" marker-end="url(#arrowBlue)" stroke-dasharray="3,3"/>
<path d="M 960 680 L 760 735" fill="none" stroke="#8b5cf6" stroke-width="2" marker-end="url(#arrowBlue)" stroke-dasharray="3,3"/>
<!-- Orchestration to Workspaces -->
<path d="M 320 680 L 380 735" fill="none" stroke="#f59e0b" stroke-width="2" stroke-dasharray="3,3"/>
<path d="M 280 680 L 540 735" fill="none" stroke="#f59e0b" stroke-width="2" stroke-dasharray="3,3"/>
</svg>