From 61183cffdc32b3b3eb99148c0aac335d8a83dcaa Mon Sep 17 00:00:00 2001
From: Ankit Sharma <ankitsm08@gmail.com>
Date: Sun, 7 Jun 2026 09:20:45 +0530
Subject: [PATCH 1/3] docs: covert ascii diagram to mermaid flowchart

- use mermaid flowchart replacing broken ascii diagram
---
 .../quick-start/connect-an-agent/index.md       | 17 ++++++++++-------
 1 file changed, 10 insertions(+), 7 deletions(-)

diff --git a/docs/getting-started/quick-start/connect-an-agent/index.md b/docs/getting-started/quick-start/connect-an-agent/index.md
index 405076140..b6bead9bc 100644
--- a/docs/getting-started/quick-start/connect-an-agent/index.md
+++ b/docs/getting-started/quick-start/connect-an-agent/index.md
@@ -41,13 +41,16 @@ The agent decides when and how to use these tools based on your message, and Ope
 
 Regardless of which agent you connect, the architecture is the same:
 
-```
-┌──────────────┐         ┌──────────────────┐         ┌──────────────┐
-│              │  HTTP    │                  │  Tools  │              │
-│  Open WebUI  │────────▶│   Agent Gateway  │────────▶│  Terminal,   │
-│  (frontend)  │◀────────│   (API server)   │◀────────│  Files, Web  │
-│              │  Stream  │                  │  Results│              │
-└──────────────┘         └──────────────────┘         └──────────────┘
+```mermaid
+flowchart LR
+    A["Open WebUI<br/>(frontend)"]
+    B["Agent Gateway<br/>(API server)"]
+    C["Termainal,<br/>Files, Web"]
+
+    A -- HTTP --> B
+    B -- Tools --> C
+    C -- Results --> B
+    B -- Stream --> A
 ```
 
 1. **You type a message** in Open WebUI

From d7946bd0e573ff06ec4df5f764f822130e84840a Mon Sep 17 00:00:00 2001
From: Ankit Sharma <ankitsm08@gmail.com>
Date: Sun, 7 Jun 2026 09:59:24 +0530
Subject: [PATCH 2/3] docs: convert scaled deployment ascii diagram to mermaid
 flowchart

- use mermaid flowchart replacing broken ascii diagram
- use subgraphs for pods and shared infra node grouping
- annotate nodes using dotted lines
---
 .../advanced-topics/scaling.md                | 57 ++++++++++++-------
 1 file changed, 36 insertions(+), 21 deletions(-)

diff --git a/docs/getting-started/advanced-topics/scaling.md b/docs/getting-started/advanced-topics/scaling.md
index 3d778ded5..b02872a4d 100644
--- a/docs/getting-started/advanced-topics/scaling.md
+++ b/docs/getting-started/advanced-topics/scaling.md
@@ -326,27 +326,42 @@ For the full setup guide, see [OpenTelemetry Monitoring](/reference/monitoring/o
 
 Here's what a production-ready scaled deployment typically looks like:
 
-```
-┌─────────────────────────────────────────────────────┐
-│                   Load Balancer                     │
-│              (Nginx, HAProxy, Cloud LB)             │
-└──────────┬──────────┬──────────┬────────────────────┘
-           │          │          │
-     ┌─────▼──┐ ┌─────▼──┐ ┌────▼───┐
-     │ WebUI  │ │ WebUI  │ │ WebUI  │   ← Stateless containers
-     │ Pod 1  │ │ Pod 2  │ │ Pod N  │
-     └───┬────┘ └───┬────┘ └───┬────┘
-         │          │          │
-    ┌────▼──────────▼──────────▼────┐
-    │         PostgreSQL            │   ← Shared database
-    │     (+ PGVector for RAG)      │   ← Vector DB (or other Vector DB)
-    └───────────────────────────────┘
-    ┌───────────────────────────────┐
-    │           Redis               │   ← Shared state & websockets
-    └───────────────────────────────┘
-    ┌───────────────────────────────┐
-    │  Shared Storage (NFS or S3)   │   ← Shared file storage
-    └───────────────────────────────┘
+```mermaid
+flowchart TD
+    %% Main Flow
+    LB["Load Balancer<br/>(Nginx, HAProxy, Cloud LB)"]
+
+    subgraph Pods ["Stateless Containers"]
+        direction LR
+        P1["WebUI<br/>Pod 1"]
+        P2["WebUI<br/>Pod 2"]
+        PN["WebUI<br/>Pod N"]
+    end
+
+    subgraph Shared ["Shared Infrastructure"]
+        direction LR
+        DB[("PostgreSQL<br/>(+ PGVector for RAG)")]
+        Redis{{"Redis"}}
+        Storage[/"Shared Storage<br/>(NFS or S3)"/]
+    end
+
+    %% Annotations
+    DBNote["Shared database<br/>+ Vector DB"]
+    RedisNote["Shared state & websockets"]
+    StoreNote["Shared file storage"]
+
+    %% Connections
+    LB --> P1
+    LB --> P2
+    LB --> PN
+    P1 --> Shared
+    P2 --> Shared
+    PN --> Shared
+
+    %% Alignment Links
+    DB -.-> DBNote
+    Redis -.-> RedisNote
+    Storage -.-> StoreNote
 ```
 
 **Running into issues?** The [Scaling & HA Troubleshooting](/troubleshooting/multi-replica) guide covers common problems (login loops, WebSocket failures, database locks, worker crashes) and their solutions. For performance tuning at scale, see [Optimization, Performance & RAM Usage](/troubleshooting/performance).

From b6dff0e88b2ed4b0391895cba6f4a11719b945e7 Mon Sep 17 00:00:00 2001
From: Ankit Sharma <ankitsm08@gmail.com>
Date: Sun, 7 Jun 2026 14:03:15 +0530
Subject: [PATCH 3/3] fix: fix terminal typo

- change "Termainal" to "Terminal"
---
 docs/getting-started/quick-start/connect-an-agent/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/getting-started/quick-start/connect-an-agent/index.md b/docs/getting-started/quick-start/connect-an-agent/index.md
index b6bead9bc..da43647db 100644
--- a/docs/getting-started/quick-start/connect-an-agent/index.md
+++ b/docs/getting-started/quick-start/connect-an-agent/index.md
@@ -45,7 +45,7 @@ Regardless of which agent you connect, the architecture is the same:
 flowchart LR
     A["Open WebUI<br/>(frontend)"]
     B["Agent Gateway<br/>(API server)"]
-    C["Termainal,<br/>Files, Web"]
+    C["Terminal,<br/>Files, Web"]
 
     A -- HTTP --> B
     B -- Tools --> C