agentgateway for VS Code

The developer interface for agentgateway
Chat with any LLM. Test MCP tools. Browse resources. Run A2A agents.
All from your editor sidebar.

Why?

agentgateway is an open-source AI agent communication proxy — routing to any LLM provider, orchestrating MCP tools, and enabling agent-to-agent collaboration.

This extension brings all of that into your editor. Instead of switching between terminals, curl commands, and web UIs to test your gateway setup, you get a native VS Code experience with streaming chat, interactive tool testing, and live resource browsing.

One extension. Every provider. Every tool. Every agent.

Highlights

Talk to any LLM — OpenAI, Anthropic, Google, Mistral, local models — whatever your gateway routes to. Stream responses in real time with full markdown rendering and syntax highlighting.

Test MCP tools without writing code — The playground auto-generates forms from tool schemas. Fill in parameters, hit execute, see results. No curl, no scripts.

Switch gateways instantly — Dev, staging, production — configure multiple agentgateway instances and switch between them from the chat toolbar. No restart needed.

Track what you spend — Per-message and per-conversation token counts, right in the chat. Know exactly how many tokens each interaction costs.

Send code to chat — Select code in your editor, hit Cmd+L, and it appears as a dismissible context chip in the chat. Ask the LLM about it, get explanations, request changes.

Agentic tool loops — The LLM doesn't just respond — it can invoke MCP tools, get results, and continue reasoning. Full agentic loop, visible in the chat with collapsible tool call cards.

Features at a Glance

Chat

Tools & Resources

Configuration

Quick Start

1. Start agentgateway

# Local
agentgateway -f agw-config.yaml

# Or via Kubernetes
kubectl port-forward svc/agentgateway 8080:8080 -n <namespace>

2. Install the Extension

git clone https://github.com/sebastianmaniak/agw-vscode-extension.git
cd agw-vscode-extension
npm install && npm run compile
npx @vscode/vsce package --no-dependencies --allow-missing-repository
code --install-extension agw-vscode-0.2.0.vsix

3. Configure

Open Settings (Cmd+,) and search for agw:

{
  "agw.llmEndpoint": "http://localhost:8080/openai",
  "agw.mcpEndpoint": "http://localhost:8080/mcp",
  "agw.apiKey": "your-api-key",       // optional
  "agw.defaultModel": "gpt-4o"        // optional
}

4. Go

Click the agentgateway icon in the Activity Bar. Start chatting.

Multi-Gateway Profiles

Running multiple gateways? Configure them all and switch instantly:

{
  // Default gateway (always available)
  "agw.llmEndpoint": "http://localhost:8080/openai",
  "agw.mcpEndpoint": "http://localhost:8080/mcp",

  // Additional gateways
  "agw.gateways": [
    {
      "name": "Production",
      "llmEndpoint": "https://prod-gw.example.com/openai",
      "mcpEndpoint": "https://prod-gw.example.com/mcp",
      "apiKey": "prod-key"
    },
    {
      "name": "Anthropic",
      "llmEndpoint": "http://localhost:8080/anthropic",
      "mcpEndpoint": "http://localhost:8080/mcp"
    }
  ]
}

A gateway dropdown appears in the input toolbar. Switching reconnects automatically — new models, new tools, zero friction.

Keyboard Shortcuts

Development

npm run watch        # Auto-rebuild on changes
npm run check-types  # Type checking
npm test             # Run tests
npm run test:watch   # Watch mode

Press F5 to launch an Extension Development Host with the extension loaded.

src/
├── extension.ts                # Entry point, activation, handler wiring
├── types.ts                    # Shared types (config, API, messages)
├── gateway/
│   ├── client.ts               # HTTP client with health check fallback
│   ├── chat.ts                 # SSE streaming + token usage capture
│   ├── models.ts               # Model listing with graceful fallback
│   ├── mcp.ts                  # MCP JSON-RPC over Streamable HTTP
│   └── a2a.ts                  # A2A protocol (agent cards + tasks)
├── state/
│   └── conversation.ts         # Chat history + globalState persistence
├── providers/
│   ├── chatViewProvider.ts     # Webview provider + agentic completion loop
│   └── toolTreeProvider.ts     # Sidebar tree view for MCP tools
└── webview/
    ├── index.ts                # Preact app (4 tabs + overlay system)
    ├── styles.css              # VS Code theme-aware styles
    └── components/
        ├── ChatPanel.ts        # Cursor-style input bar + action menu
        ├── MessageBubble.ts    # Markdown rendering + Copy/Insert actions
        ├── McpPlayground.ts    # Tool testing with dynamic forms
        ├── ResourceBrowser.ts  # MCP resource viewer
        ├── A2aPlayground.ts    # A2A agent card + task sender
        ├── ConversationList.ts # History browser
        ├── SystemPromptEditor.ts
        ├── PromptTemplates.ts
        └── ToolCallCard.ts     # Collapsible tool call/result cards

Compatibility

Install via .vsix in any VS Code-compatible editor.

Built by SebbyCorp · agentgateway.dev · Apache-2.0