Add standalone MCP gateway with web UI for dynamic server management

[Copilot]

This PR implements a complete standalone MCP gateway with a modern web-based user interface for dynamic server management, addressing the need for a UI-driven approach to managing MCP servers with real-time configuration capabilities.

Overview

The standalone gateway provides a comprehensive solution for managing MCP servers through an intuitive web interface, enabling users to:

• Dynamically add and remove MCP servers without restart
• Generate configuration files for Claude Desktop and LLM Studio
• Browse and search the complete Docker MCP catalog
• Deploy production-ready MCP gateway instances

Key Features

🎛️ Modern Web Interface

• Responsive design with tabbed navigation (Servers, Configuration, Export Config, Settings)
• Real-time server status indicators with visual feedback
• Interactive server cards showing metadata, tools, and configuration options
• Search and filtering capabilities for server discovery

🔄 Dynamic Server Management

• Add/remove servers on the fly using the complete Docker MCP catalog
• Server configuration management with secrets and environment variables
• Status monitoring with green/red indicators for active/inactive servers
• Integration with existing dynamic management tools (mcp-add, mcp-remove, mcp-find)

📋 Configuration Export

• Claude Desktop: Generates proper mcp.json files with STDIO command configurations
• LLM Studio: Provides SSE endpoint configurations for remote connections
• Docker Compose: Complete deployment configurations with volume mounts and networking

🌐 Remote Operations

• REST API endpoints for programmatic server management
• Remote gateway connection settings for multi-instance management
• CORS-enabled for cross-origin web client access

Implementation Details

Web UI (ui/)

• index.html: Modern responsive interface with CSS Grid layout and smooth animations
• app.js: JavaScript application with API integration and real-time updates
• Embedded directly into the Go binary for zero-dependency deployment

Standalone Gateway Server (cmd/standalone-gateway/)

• HTTP server serving embedded UI files and REST API endpoints
• Integration with existing MCP gateway architecture
• Production-ready with Docker containerization support

Docker Deployment

• Dockerfile.standalone: Multi-stage build with embedded UI
• compose.standalone.yaml: One-command deployment configuration
• Production-ready with proper volume mounts and networking

Usage

Quick Start

# Deploy with Docker Compose
docker compose -f compose.standalone.yaml up -d

# Or build and run locally
go build -o standalone-gateway ./cmd/standalone-gateway
./standalone-gateway

# Access UI at http://localhost:3000

Generated Configurations

Claude Desktop (mcp.json):

{
  "mcpServers": {
    "MCP_GATEWAY": {
      "command": "docker",
      "args": ["mcp", "gateway", "run", "--servers=filesystem,duckduckgo"],
      "env": {}
    }
  }
}

Docker Compose:

services:
  gateway:
    image: docker/mcp-gateway
    command:
      - --servers=filesystem,duckduckgo
      - --transport=sse
      - --port=8811
    ports:
      - "8811:8811"
    volumes:
      - /var/run/docker.sock:/var/run/docker.sock

API Endpoints

• GET /api/servers - List available servers with status
• POST /api/servers/add - Add server to gateway
• POST /api/servers/remove - Remove server from gateway
• GET /api/export/{claude|llmstudio|docker-compose} - Export configurations

Testing

The implementation includes sample MCP servers (filesystem, duckduckgo, github, postgres, slack) with realistic configurations, secrets requirements, and tool definitions. The UI has been tested with:

• Server addition/removal workflows
• Configuration export functionality
• Search and filtering capabilities
• Responsive design across different screen sizes

This provides a complete solution for standalone MCP gateway management with an intuitive web interface that integrates seamlessly with the existing MCP ecosystem while enabling dynamic server configuration using the complete Docker MCP catalog.

Original prompt

i want to create a standalone mcp gateway . i want a UI to interact with a dynamic mcpserver based on @https://deepwiki.com/docker/mcp-gateway/3.1-dynamic-server-management#dynamic-server-management the app needs to set up the mcp.json file for claude desktop and llmstudio i need the ui to update the mcpservers on the fly using complete docker mcp catalog i want the option of tools and running as a client on remote machine.
The following is a snapshot of a chat conversation between a user and an AI coding assistant. Prioritize later messages in the conversation.
User: i want to build a standalone mcp
AI: To build a standalone MCP (Model Context Protocol) using the provided examples, you should:

1. Choose the relevant example folder for your use case (e.g., custom-catalog, remote_mcp, minimal-compose, or config).
2. Use the compose.yaml file in that folder to start the MCP service with Docker Compose.
3. If you want a minimal standalone MCP, use the
   AI: for the simplest setup.

Would you like instructions for running the minimal standalone MCP, or do you want a more feature-rich setup (e.g., with custom catalog, secrets, or health checks)? Please specify your requirements.
User: i want to create a standalone mcp gateway . i want a UI to interact with a dynamic mcpserver based on @https://deepwiki.com/docker/mcp-gateway/3.1-dynamic-server-management#dynamic-server-management the app needs to set up the mcp.json file for claude desktop and llmstudio i need the ui to update the mcpservers on the fly using complete docker mcp catalog i want the option of tools and running as a client on remote machine.

TITLE: Building a Standalone MCP Gateway with Dynamic Server Management

USER INTENT: The user aims to create a standalone MCP (Model Context Protocol) gateway that includes a user interface (UI) for interacting with a dynamic MCP server, specifically tailored for applications like Claude Desktop and LLM Studio.

TASK DESCRIPTION: The user requires a UI that can dynamically update the mcp.json configuration file for the MCP server. The application should utilize the complete Docker MCP catalog and provide options for tools and the ability to run as a client on a remote machine.

EXISTING: The user has identified the need for a standalone MCP gateway and referenced a specific resource for dynamic server management. They have also mentioned the requirement for a UI to facilitate interaction with the MCP server.

PENDING: The user needs guidance on how to implement the UI for the MCP gateway, including how to set up the mcp.json file and ensure it can update the MCP servers dynamically. They also need to clarify the integration with the complete Docker MCP catalog and the tools required for remote operation.

CODE STATE: No specific code snippets or files have been discussed yet, but the user will likely need to reference or create a mcp.json file and utilize Docker configurations.

RELEVANT CODE/DOCUMENTATION SNIPPETS: The user referenced the following URL for dynamic server management: Dynamic Server Management Documentation.

OTHER NOTES: The user is looking for a comprehensive solution that not only sets up the MCP gateway but also allows for real-time updates and management of the MCP servers. Further clarification on the specific tools and features they want to include in the UI may be necessary for more targeted assistance.

Created from VS Code via the [GitHub Pull Request](https://marketplace.visualstudio.com/items?itemName=GitHub.vscode-pull-request-github) extension.

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[davesbits]

after agent

[davesbits]

WIP 1

[davesbits]

ok