AG-UI Demo Workspace

A demo application showcasing the AG-UI (Agent-User Interface) protocol with CopilotKit — featuring a .NET 9 backend and Next.js frontend with 4 AI agent scenarios powered by Azure OpenAI.

This is NOT 4 separate servers. It is a single .NET backend exposing 4 AG-UI endpoints, consumed by a single Next.js frontend through CopilotKit.

Architecture

                        User (Browser)
                             |
                             v
┌─────────────────────────────────────────────────────────┐
│  Next.js Frontend (port 3000)                           │
│                                                         │
│  ┌───────────────────────────────────────────────────┐  │
│  │ React Pages                                       │  │
│  │  /time-tracker    → <CopilotKit agent="time_tracker">│
│  │  /calendar        → <CopilotKit agent="calendar">   │
│  │  /knowledge-base  → <CopilotKit agent="knowledge_base">│
│  │  /security-issues → <CopilotKit agent="security_issues">│
│  │                                                   │  │
│  │  Each page wraps <CopilotChat> for the chat UI    │  │
│  └───────────────────────┬───────────────────────────┘  │
│                          │                              │
│  ┌───────────────────────▼───────────────────────────┐  │
│  │ API Route: /api/copilotkit                        │  │
│  │  CopilotRuntime + ExperimentalEmptyAdapter        │  │
│  │  Routes to 4 HttpAgent instances (from @ag-ui/client)│
│  └───────────────────────┬───────────────────────────┘  │
└──────────────────────────┼──────────────────────────────┘
                           │
                  HTTP POST + SSE Response
                  (AG-UI Protocol over SSE)
                           │
┌──────────────────────────▼──────────────────────────────┐
│  .NET 9 Backend (port 5018)                             │
│                                                         │
│  ┌───────────────────────────────────────────────────┐  │
│  │ ASP.NET Core Pipeline                             │  │
│  │  builder.Services.AddAGUI()                       │  │
│  │  app.MapAGUI("/time_tracker",    agent)            │  │
│  │  app.MapAGUI("/calendar",        agent)            │  │
│  │  app.MapAGUI("/knowledge_base",  agent)            │  │
│  │  app.MapAGUI("/security_issues", agent)            │  │
│  └───────────────────────┬───────────────────────────┘  │
│                          │                              │
│  ┌───────────────────────▼───────────────────────────┐  │
│  │ ChatClientAgent (per endpoint)                    │  │
│  │  - System prompt (Instructions)                   │  │
│  │  - Domain tools (AIFunctionFactory.Create)        │  │
│  │  - Source-gen JSON (McpAguiSerializerContext)      │  │
│  └───────────────────────┬───────────────────────────┘  │
│                          │                              │
│  ┌───────────────────────▼───────────────────────────┐  │
│  │ Azure OpenAI (GPT-4.1-mini)                       │  │
│  │  - Receives user message + tool definitions       │  │
│  │  - Returns tool calls or text completions         │  │
│  └───────────────────────────────────────────────────┘  │
│                                                         │
│  ┌───────────────────────────────────────────────────┐  │
│  │ In-Memory Data Stores (Singletons)                │  │
│  │  TimeEntryStore   → 30 days of seed entries       │  │
│  │  CalendarStore    → Recurring + scattered events  │  │
│  │  KnowledgeArticleStore → 21 seeded articles       │  │
│  │  SecurityIssueStore    → 24 seeded issues         │  │
│  └───────────────────────────────────────────────────┘  │
└─────────────────────────────────────────────────────────┘

How the AG-UI Protocol Works

AG-UI (Agent-User Interface) is an event-driven protocol that standardizes how AI agents communicate with frontends. It uses Server-Sent Events (SSE) over HTTP as the transpor

... View full README on GitHub