@mcp-weave/webui 0.1.1 → 0.2.0

package/README.md

@@ -68,19 +68,19 @@ mcp-weave webui --port 3000 --title "My Dashboard"
 
 ```typescript
 interface McpWebUIOptions {
-  port?: number;         // Default: 3000
-  host?: string;         // Default: 'localhost'
-  title?: string;        // Dashboard title
-  theme?: 'light' | 'dark';  // UI theme
-  enableLogs?: boolean;  // Show server logs
+  port?: number; // Default: 3000
+  host?: string; // Default: 'localhost'
+  title?: string; // Dashboard title
+  theme?: 'light' | 'dark'; // UI theme
+  enableLogs?: boolean; // Show server logs
 }
 
 class McpWebUI {
   constructor(serverClass: any, options?: McpWebUIOptions);
-  
+
   start(): Promise<void>;
   stop(): Promise<void>;
-  
+
   getUrl(): string;
 }
 ```

package/dist/index.d.mts

@@ -1,4 +1,5 @@
 import { EventEmitter } from 'events';
+import { McpAuthOptions } from '@mcp-weave/nestjs';
 
 /**
  * Web UI configuration options
@@ -14,6 +15,8 @@ interface McpWebUIOptions {
     theme?: 'light' | 'dark';
     /** Enable server logs panel */
     enableLogs?: boolean;
+    /** Authentication options */
+    auth?: McpAuthOptions;
 }
 /**
  * Server information for the dashboard
@@ -70,6 +73,7 @@ interface CallHistoryEntry {
     error?: string;
     timestamp: Date;
     duration: number;
+    clientId?: string;
 }
 /**
  * McpWebUI - Web dashboard for testing MCP servers
@@ -82,6 +86,7 @@ declare class McpWebUI extends EventEmitter {
     private serverInfo;
     private callHistory;
     private logs;
+    private authMiddleware;
     constructor(serverClass: new (...args: unknown[]) => unknown, options?: McpWebUIOptions);
     /**
      * Initialize server instance and extract metadata

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import { EventEmitter } from 'events';
+import { McpAuthOptions } from '@mcp-weave/nestjs';
 
 /**
  * Web UI configuration options
@@ -14,6 +15,8 @@ interface McpWebUIOptions {
     theme?: 'light' | 'dark';
     /** Enable server logs panel */
     enableLogs?: boolean;
+    /** Authentication options */
+    auth?: McpAuthOptions;
 }
 /**
  * Server information for the dashboard
@@ -70,6 +73,7 @@ interface CallHistoryEntry {
     error?: string;
     timestamp: Date;
     duration: number;
+    clientId?: string;
 }
 /**
  * McpWebUI - Web dashboard for testing MCP servers
@@ -82,6 +86,7 @@ declare class McpWebUI extends EventEmitter {
     private serverInfo;
     private callHistory;
     private logs;
+    private authMiddleware;
     constructor(serverClass: new (...args: unknown[]) => unknown, options?: McpWebUIOptions);
     /**
      * Initialize server instance and extract metadata

package/dist/index.js

@@ -1139,6 +1139,7 @@ var McpWebUI = class extends import_events.EventEmitter {
   serverInfo = null;
   callHistory = [];
   logs = [];
+  authMiddleware;
   constructor(serverClass, options = {}) {
     super();
     if (!(0, import_nestjs.isMcpServer)(serverClass)) {
@@ -1150,8 +1151,10 @@ var McpWebUI = class extends import_events.EventEmitter {
       host: options.host ?? "localhost",
       title: options.title ?? "MCP Server Dashboard",
       theme: options.theme ?? "dark",
-      enableLogs: options.enableLogs ?? true
+      enableLogs: options.enableLogs ?? true,
+      auth: options.auth
     };
+    this.authMiddleware = (0, import_nestjs.createAuthMiddleware)(options.auth);
   }
   /**
    * Initialize server instance and extract metadata
@@ -1256,12 +1259,12 @@ var McpWebUI = class extends import_events.EventEmitter {
   /**
    * Handle HTTP requests
    */
-  handleRequest(req, res) {
+  async handleRequest(req, res) {
     const parsedUrl = url.parse(req.url ?? "/", true);
     const pathname = parsedUrl.pathname ?? "/";
     res.setHeader("Access-Control-Allow-Origin", "*");
     res.setHeader("Access-Control-Allow-Methods", "GET, POST, OPTIONS");
-    res.setHeader("Access-Control-Allow-Headers", "Content-Type");
+    res.setHeader("Access-Control-Allow-Headers", "Content-Type, Authorization, X-Api-Key");
     if (req.method === "OPTIONS") {
       res.writeHead(200);
       res.end();
@@ -1269,7 +1272,19 @@ var McpWebUI = class extends import_events.EventEmitter {
     }
     if (pathname === "/" && req.method === "GET") {
       this.serveDashboard(res);
-    } else if (pathname === "/api/info" && req.method === "GET") {
+      return;
+    }
+    if (pathname.startsWith("/api/")) {
+      const authResult = await this.authMiddleware(req, res);
+      if (!authResult) return;
+      if (this.options.auth?.enabled) {
+        this.log(
+          `[${authResult.requestId}] ${authResult.auth.clientName ?? authResult.auth.clientId} - ${req.method} ${pathname}`
+        );
+      }
+      res.setHeader("X-Request-Id", authResult.requestId);
+    }
+    if (pathname === "/api/info" && req.method === "GET") {
       this.serveServerInfo(res);
     } else if (pathname === "/api/tools" && req.method === "GET") {
       this.serveTools(res);
@@ -1305,7 +1320,12 @@ var McpWebUI = class extends import_events.EventEmitter {
    */
   serveServerInfo(res) {
     res.writeHead(200, { "Content-Type": "application/json" });
-    res.end(JSON.stringify(this.serverInfo));
+    res.end(
+      JSON.stringify({
+        ...this.serverInfo,
+        authEnabled: this.options.auth?.enabled ?? false
+      })
+    );
   }
   /**
    * Serve tools list