From 0494032fb5184048e68c31b9e8d00da65295c79a Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 4 Nov 2025 12:35:56 +0000
Subject: [PATCH] Convert ASCII diagrams to Mermaid.js format

Co-authored-by: eliandoran <21236836+eliandoran@users.noreply.github.com>
---
 docs/ARCHITECTURE.md    | 125 +++++++++++++++++++++-------------------
 docs/DATABASE.md        |  42 +++++++-------
 docs/SYNCHRONIZATION.md |  36 +++++-------
 3 files changed, 99 insertions(+), 104 deletions(-)

diff --git a/docs/ARCHITECTURE.md b/docs/ARCHITECTURE.md
index 44d4f99fd..53f35dbd2 100644
--- a/docs/ARCHITECTURE.md
+++ b/docs/ARCHITECTURE.md
@@ -53,30 +53,30 @@ Trilium Notes is a hierarchical note-taking application built as a TypeScript mo
 
 Trilium follows a **client-server architecture** even in desktop mode, where Electron runs both the backend server and frontend client within the same process.
 
-```
-┌─────────────────────────────────────────────────────────────┐
-│                         Frontend                             │
-│  ┌────────────┐  ┌────────────┐  ┌────────────┐            │
-│  │  Widgets   │  │   Froca    │  │   UI       │            │
-│  │  System    │  │   Cache    │  │  Services  │            │
-│  └────────────┘  └────────────┘  └────────────┘            │
-│                         │                                    │
-│                    WebSocket / REST API                      │
-│                         │                                    │
-└─────────────────────────┼────────────────────────────────────┘
-                          │
-┌─────────────────────────┼────────────────────────────────────┐
-│                    Backend Server                            │
-│  ┌────────────┐  ┌────────────┐  ┌────────────┐            │
-│  │  Express   │  │   Becca    │  │   Script   │            │
-│  │  Routes    │  │   Cache    │  │   Engine   │            │
-│  └────────────┘  └────────────┘  └────────────┘            │
-│                         │                                    │
-│                    ┌────┴─────┐                             │
-│                    │  SQLite  │                             │
-│                    │ Database │                             │
-│                    └──────────┘                             │
-└─────────────────────────────────────────────────────────────┘
+```mermaid
+graph TB
+    subgraph Frontend
+        Widgets[Widgets<br/>System]
+        Froca[Froca<br/>Cache]
+        UIServices[UI<br/>Services]
+    end
+    
+    subgraph Backend["Backend Server"]
+        Express[Express<br/>Routes]
+        Becca[Becca<br/>Cache]
+        ScriptEngine[Script<br/>Engine]
+        Database[(SQLite<br/>Database)]
+    end
+    
+    Widgets -.-> API[WebSocket / REST API]
+    Froca -.-> API
+    UIServices -.-> API
+    API -.-> Express
+    API -.-> Becca
+    API -.-> ScriptEngine
+    Becca --> Database
+    Express --> Database
+    ScriptEngine --> Database
 ```
 
 ### Deployment Modes
@@ -225,30 +225,24 @@ Located at: `apps/server/src/share/`
 
 Trilium's data model is based on five core entities:
 
-```
-┌──────────────────────────────────────────────────────────┐
-│                      Note Tree                           │
-│                                                          │
-│    ┌─────────┐                                          │
-│    │  Note   │                                          │
-│    │ (BNote) │                                          │
-│    └────┬────┘                                          │
-│         │                                               │
-│         │ linked by                                     │
-│         ▼                                               │
-│    ┌──────────┐         ┌─────────────┐               │
-│    │ Branch   │◄────────│  Attribute  │               │
-│    │(BBranch) │         │ (BAttribute)│               │
-│    └──────────┘         └─────────────┘               │
-│         │                                               │
-│         │ creates                                       │
-│         ▼                                               │
-│    ┌──────────┐         ┌─────────────┐               │
-│    │ Revision │         │ Attachment  │               │
-│    │(BRevision│         │(BAttachment)│               │
-│    └──────────┘         └─────────────┘               │
-│                                                          │
-└──────────────────────────────────────────────────────────┘
+```mermaid
+graph TD
+    Note[Note<br/>BNote]
+    Branch[Branch<br/>BBranch]
+    Attribute[Attribute<br/>BAttribute]
+    Revision[Revision<br/>BRevision]
+    Attachment[Attachment<br/>BAttachment]
+    
+    Note -->|linked by| Branch
+    Note -.->|metadata| Attribute
+    Branch -->|creates| Revision
+    Note -->|has| Attachment
+    
+    style Note fill:#e1f5ff
+    style Branch fill:#fff4e1
+    style Attribute fill:#ffe1f5
+    style Revision fill:#f5ffe1
+    style Attachment fill:#ffe1e1
 ```
 
 #### Entity Definitions
@@ -514,18 +508,29 @@ Key services:
 ### UI Components
 
 **Main Layout:**
-```
-┌──────────────────────────────────────────────────────┐
-│                    Title Bar                          │
-├──────────┬────────────────────────┬──────────────────┤
-│          │                        │                  │
-│   Note   │    Note Detail         │  Right Panel    │
-│   Tree   │    Editor              │  (Info, Links)  │
-│          │                        │                  │
-│          │                        │                  │
-├──────────┴────────────────────────┴──────────────────┤
-│                  Status Bar                          │
-└──────────────────────────────────────────────────────┘
+
+```mermaid
+graph TD
+    subgraph TriliumUI[" "]
+        TitleBar[Title Bar]
+        
+        subgraph MainArea[" "]
+            NoteTree[Note Tree]
+            NoteDetail[Note Detail<br/>Editor]
+            RightPanel[Right Panel<br/>Info, Links]
+        end
+        
+        StatusBar[Status Bar]
+    end
+    
+    TitleBar -.-> MainArea
+    MainArea -.-> StatusBar
+    
+    style TitleBar fill:#e1f5ff
+    style NoteTree fill:#fff4e1
+    style NoteDetail fill:#f5ffe1
+    style RightPanel fill:#ffe1f5
+    style StatusBar fill:#e1f5ff
 ```
 
 **Component Locations:**
diff --git a/docs/DATABASE.md b/docs/DATABASE.md
index d02452f21..52df42e0b 100644
--- a/docs/DATABASE.md
+++ b/docs/DATABASE.md
@@ -427,27 +427,27 @@ CREATE TABLE etapi_tokens (
 
 ## Data Relationships
 
-```
-                ┌──────────────┐
-                │    Notes     │
-                └───┬──────────┘
-                    │
-        ┌───────────┼───────────┐
-        │           │           │
-        ▼           ▼           ▼
-    ┌────────┐  ┌──────────┐  ┌───────────┐
-    │Branches│  │Attributes│  │Attachments│
-    └────────┘  └──────────┘  └─────┬─────┘
-        │                            │
-        │                            │
-        │       ┌──────────┐         │
-        └──────▶│  Blobs   │◀────────┘
-                └──────────┘
-                     ▲
-                     │
-                ┌────┴─────┐
-                │Revisions │
-                └──────────┘
+```mermaid
+graph TB
+    Notes[Notes]
+    Branches[Branches]
+    Attributes[Attributes]
+    Attachments[Attachments]
+    Blobs[(Blobs)]
+    Revisions[Revisions]
+    
+    Notes --> Branches
+    Notes --> Attributes
+    Notes --> Attachments
+    Notes --> Blobs
+    Notes --> Revisions
+    
+    Branches --> Blobs
+    Attachments --> Blobs
+    Revisions --> Blobs
+    
+    style Notes fill:#e1f5ff
+    style Blobs fill:#ffe1e1
 ```
 
 **Relationships:**
diff --git a/docs/SYNCHRONIZATION.md b/docs/SYNCHRONIZATION.md
index 2f39eee40..0945e533a 100644
--- a/docs/SYNCHRONIZATION.md
+++ b/docs/SYNCHRONIZATION.md
@@ -14,29 +14,19 @@ Trilium implements a sophisticated **bidirectional synchronization system** that
 
 ## Sync Architecture
 
-```
-┌─────────────┐                    ┌─────────────┐
-│  Desktop 1  │                    │  Desktop 2  │
-│  (Client)   │                    │  (Client)   │
-└──────┬──────┘                    └──────┬──────┘
-       │                                  │
-       │  WebSocket/HTTP                  │
-       │                                  │
-       ▼                                  ▼
-┌────────────────────────────────────────────────┐
-│            Sync Server                         │
-│  ┌──────────────────────────────────────┐    │
-│  │     Sync Service                      │    │
-│  │  - Entity Change Management           │    │
-│  │  - Conflict Resolution                │    │
-│  │  - Version Tracking                   │    │
-│  └──────────────────────────────────────┘    │
-│                     │                          │
-│              ┌──────┴───────┐                 │
-│              │   Database   │                 │
-│              │ (entity_changes)│              │
-│              └──────────────┘                 │
-└────────────────────────────────────────────────┘
+```mermaid
+graph TB
+    Desktop1[Desktop 1<br/>Client]
+    Desktop2[Desktop 2<br/>Client]
+    
+    subgraph SyncServer["Sync Server"]
+        SyncService[Sync Service<br/>- Entity Change Management<br/>- Conflict Resolution<br/>- Version Tracking]
+        SyncDB[(Database<br/>entity_changes)]
+    end
+    
+    Desktop1 <-->|WebSocket/HTTP| SyncService
+    Desktop2 <-->|WebSocket/HTTP| SyncService
+    SyncService --> SyncDB
 ```
 
 ## Core Concepts