Add Mermaid architecture diagrams to README

Author: ericsciple

README.md

@@ -4,6 +4,93 @@ The GitHub Actions extension lets you manage your workflows, view the workflow r
 
 ![](./media/header.png)
 
+## Architecture Overview
+
+<!-- If the Mermaid diagrams below aren't rendering in VS Code preview, install the "Markdown Preview Mermaid Support" extension -->
+
+```mermaid
+graph TB
+    subgraph "VS Code Extension"
+        EXT[Extension Host]
+        TV[Tree Views]
+        CMD[Commands]
+        TRACK[Workspace Tracker]
+    end
+    
+    subgraph "Language Support"
+        LC[Language Client]
+        LS[Language Server]
+        WP[Workflow Parser]
+        EE[Expression Engine]
+    end
+    
+    subgraph "External Services"
+        GH[GitHub API]
+        REPO[Git Repository]
+    end
+    
+    EXT --> LC
+    EXT --> TV
+    EXT --> CMD
+    EXT --> TRACK
+    
+    LC <--> LS
+    LS --> WP
+    LS --> EE
+    WP --> EE
+    
+    TV --> GH
+    CMD --> GH
+    TRACK --> REPO
+    LS --> GH
+    
+    style EXT fill:#2ea44f
+    style LS fill:#0969da
+    style GH fill:#8250df
+```
+
+### Key Components
+
+```mermaid
+graph LR
+    subgraph "User Interface"
+        WF[Workflows View]
+        CB[Current Branch View]
+        SET[Settings View]
+        EDITOR[Workflow Editor]
+    end
+    
+    subgraph "Core Features"
+        AUTH[Authentication]
+        MANAGE[Workflow Management]
+        LOGS[Log Viewing]
+        VALID[Validation & Completion]
+    end
+    
+    subgraph "Data Management"
+        STORE[Run Store]
+        SECRETS[Secrets/Variables]
+        PIN[Pinned Workflows]
+    end
+    
+    WF --> MANAGE
+    WF --> PIN
+    CB --> MANAGE
+    SET --> SECRETS
+    EDITOR --> VALID
+    
+    MANAGE --> STORE
+    MANAGE --> AUTH
+    LOGS --> STORE
+    VALID --> AUTH
+    SECRETS --> AUTH
+    PIN --> MANAGE
+    
+    style AUTH fill:#fd8c73
+    style MANAGE fill:#58a6ff
+    style VALID fill:#3fb950
+```
+
 ## Features
 
 ### Manage workflows and runs