@myatkyawthu/mcp-connect 0.2.0 → 0.3.0

package/package.json

@@ -1,63 +1,59 @@
-{
-  "name": "@myatkyawthu/mcp-connect",
-  "version": "0.2.0",
-  "description": "Dead simple MCP (Model Context Protocol) server for exposing your app functions to AI agents",
-  "type": "module",
-  "main": "./src/index.js",
-  "module": "./src/index.js",
-  "exports": {
-    ".": {
-      "import": "./src/index.js",
-      "require": "./src/index.js"
-    }
-  },
-  "bin": {
-    "mcp-connect": "./src/cli.js"
-  },
-  "files": [
-    "src",
-    "README.md",
-    "LICENSE"
-  ],
-  "scripts": {
-    "start": "node src/cli.js",
-    "dev": "nodemon src/cli.js",
-    "test": "node --test",
-    "test:unit": "node --test tests/unit",
-    "test:integration": "node --test tests/integration",
-    "lint": "eslint src/",
-    "format": "prettier --write src/"
-  },
-  "keywords": [
-    "mcp",
-    "model-context-protocol",
-    "ai",
-    "agents",
-    "tools",
-    "claude",
-    "gpt",
-    "javascript",
-    "nodejs"
-  ],
-  "author": "myat-kyaw-thu",
-  "license": "MIT",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/myat-kyaw-thu/MCP_Indigration_Package-NPM.git"
-  },
-  "bugs": {
-    "url": "https://github.com/myat-kyaw-thu/MCP_Indigration_Package-NPM/issues"
-  },
-  "homepage": "https://github.com/myat-kyaw-thu/MCP_Indigration_Package-NPM#readme",
-  "engines": {
-    "node": ">=18.0.0"
-  },
-  "dependencies": {
-    "@modelcontextprotocol/sdk": "^0.5.0"
-  },
-  "devDependencies": {
-    "nodemon": "^3.0.0",
-    "eslint": "^8.0.0",
-    "prettier": "^3.0.0"
-  }
-}
+{
+  "name": "@myatkyawthu/mcp-connect",
+  "version": "0.3.0",
+  "description": "Dead simple MCP (Model Context Protocol) server for exposing your app functions to AI agents",
+  "type": "module",
+  "main": "./src/index.js",
+  "exports": {
+    ".": "./src/index.js"
+  },
+  "bin": {
+    "mcp-connect": "./src/cli.js"
+  },
+  "files": [
+    "src",
+    "README.md",
+    "LICENSE"
+  ],
+  "scripts": {
+    "start": "node src/cli.js",
+    "dev": "nodemon src/cli.js",
+    "test": "node --test",
+    "test:unit": "node --test tests/unit/*.test.js",
+    "test:integration": "node --test tests/integration",
+    "lint": "eslint src/",
+    "format": "prettier --write src/"
+  },
+  "keywords": [
+    "mcp",
+    "model-context-protocol",
+    "ai",
+    "agents",
+    "tools",
+    "claude",
+    "gpt",
+    "javascript",
+    "nodejs"
+  ],
+  "author": "myat-kyaw-thu",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/myat-kyaw-thu/MCP_Indigration_Package-NPM.git"
+  },
+  "bugs": {
+    "url": "https://github.com/myat-kyaw-thu/MCP_Indigration_Package-NPM/issues"
+  },
+  "homepage": "https://github.com/myat-kyaw-thu/MCP_Indigration_Package-NPM#readme",
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "dependencies": {
+    "@modelcontextprotocol/sdk": "^1.29.0"
+  },
+  "devDependencies": {
+    "eslint": "^8.0.0",
+    "nodemon": "^3.0.0",
+    "prettier": "^3.0.0"
+  }
+}

package/src/cli.js

@@ -5,9 +5,6 @@ import { resolve } from 'path';
 import { defineMCP } from './defineMCP.js';
 import { MCPConnectServer } from './server/mcpServer.js';
 
-/**
- * Handle init command - create sample config file
- */
 async function handleInitCommand() {
   const configPath = resolve(process.cwd(), 'mcp.config.js');
 
@@ -26,7 +23,7 @@ export default defineMCP({
   tools: [
     // Simple tuple format: [name, handler]
     ["hello", async ({ name = "World" }) => \`Hello \${name}!\`],
-    
+
     // Object format with schema validation
     {
       name: "echo",
@@ -68,27 +65,40 @@ export default defineMCP({
   }
 }
 
-/**
- * CLI entry point for mcp-connect
- * Uses MCP SDK with STDIO transport or Express.js for HTTP transport
- */
 async function main() {
   try {
-    // Handle init command
     if (process.argv[2] === 'init') {
       await handleInitCommand();
       return;
     }
 
+    if (process.argv[2] === 'relay') {
+      const portIndex = process.argv.indexOf('--port');
+      const relayPort = portIndex !== -1 ? parseInt(process.argv[portIndex + 1], 10) : 4000;
+      const { MCPRelayServer } = await import('./server/relay.js');
+      const relay = new MCPRelayServer();
+      await relay.start(relayPort);
+      return;
+    }
+
     console.error('Starting MCP-Connect CLI...');
 
-    // Check if config file path is provided as argument
-    const configArg = process.argv[2];
-    /** @type {string|null} */
+    // Parse --port flag
+    let port = null;
+    const portIndex = process.argv.indexOf('--port');
+    if (portIndex !== -1) {
+      port = parseInt(process.argv[portIndex + 1], 10);
+      if (!port || port < 1 || port > 65535) {
+        console.error('Invalid port. Usage: mcp-connect --port 3000');
+        process.exit(1);
+      }
+    }
+
+    // Find config path (skip flags)
     let configPath = null;
+    const configArg = process.argv.find((a, i) => i >= 2 && !a.startsWith('--') && process.argv[i - 1] !== '--port' && a !== 'relay');
 
     if (configArg) {
-      // Config file path provided as argument
       const fullPath = resolve(configArg);
       if (existsSync(fullPath)) {
         configPath = fullPath;
@@ -97,7 +107,6 @@ async function main() {
         process.exit(1);
       }
     } else {
-      // Look for config file in current directory (prioritize .js and .mjs)
       const configPaths = ['mcp.config.js', 'mcp.config.mjs', 'mcp.config.ts'];
 
       for (const path of configPaths) {
@@ -134,7 +143,6 @@ export default defineMCP({
 
     let configModule;
     try {
-      // Handle TypeScript config files
       if (configPath.endsWith('.ts')) {
         console.error('TypeScript config detected. For Node.js compatibility:');
         console.error('1. Rename mcp.config.ts to mcp.config.js and convert to JavaScript');
@@ -157,7 +165,6 @@ export default defineMCP({
         process.exit(1);
       }
 
-      // Import config file using Node.js ES modules
       const fileUrl = configPath.startsWith('/')
         ? `file://${configPath}`
         : `file:///${configPath.replace(/\\/g, '/')}`;
@@ -172,7 +179,7 @@ export default defineMCP({
           error.message.includes('Cannot resolve') ||
           error.message.includes('MODULE_NOT_FOUND')
         ) {
-          console.error("Make sure 'mcp-connect' is installed: npm install mcp-connect");
+          console.error('Make sure \'@myatkyawthu/mcp-connect\' is installed: npm install mcp-connect');
         } else if (error.message.includes('SyntaxError')) {
           console.error('Config file has syntax errors. Check your JavaScript syntax.');
         } else if (error.message.includes('ERR_MODULE_NOT_FOUND')) {
@@ -190,7 +197,6 @@ export default defineMCP({
       process.exit(1);
     }
 
-    // Validate config using defineMCP (in case user didn't use it)
     let validatedConfig;
     try {
       validatedConfig = typeof config === 'function' ? config : defineMCP(config);
@@ -199,11 +205,25 @@ export default defineMCP({
       process.exit(1);
     }
 
-    // Create and start MCP server
     const server = new MCPConnectServer(validatedConfig);
-    await server.start();
 
-    // Handle graceful shutdown
+    const finalPort = port || validatedConfig.server?.port;
+    const useSSE = !!finalPort || validatedConfig.server?.transport === 'sse' || validatedConfig.server?.transport === 'hybrid';
+    const useTunnel = process.argv.includes('--tunnel') || !!validatedConfig.server?.tunnel?.enabled;
+    const relayUrl = process.env.MCP_RELAY_URL || validatedConfig.server?.tunnel?.relayUrl || 'http://localhost:4000';
+
+    if (useSSE) {
+      await server.startSSE(finalPort || 3000);
+    } else {
+      await server.start();
+    }
+
+    if (useTunnel) {
+      server.startTunnel(relayUrl).catch((err) => {
+        console.error('Tunnel failed to start:', err.message);
+      });
+    }
+
     process.on('SIGINT', async () => {
       console.error('Shutting down...');
       try {
@@ -229,8 +249,6 @@ export default defineMCP({
   }
 }
 
-// Run CLI if this file is executed directly
-// Multiple checks to ensure main() runs when CLI is executed
 const isMainModule =
   process.argv[1] &&
   (import.meta.url === `file://${process.argv[1]}` ||

package/src/defineMCP.js

@@ -1,21 +1,7 @@
 import { formatValidationErrors, validateConfig } from './utils/configValidation.js';
 import { logger } from './utils/logger.js';
 
-/**
- * Define MCP configuration with tools and server settings
- * This is the main user-facing API that converts simple tool definitions
- * into MCP-compliant format with comprehensive validation
- *
- * @param {Object} config - Configuration object
- * @param {string} config.name - Server name
- * @param {string} config.version - Server version
- * @param {string} [config.description] - Server description
- * @param {import('./types/mcp.js').ToolDefinition[]} config.tools - Tool definitions
- * @returns {import('./types/mcp.js').MCPConfig} MCP configuration object
- * @throws {Error} If configuration is invalid
- */
 export function defineMCP(config) {
-  // Comprehensive configuration validation
   const validationResult = validateConfig(config);
 
   if (!validationResult.isValid) {
@@ -24,7 +10,6 @@ export function defineMCP(config) {
     throw new Error(`Invalid MCP configuration:\n${errorMessage}`);
   }
 
-  // Log warnings if any
   if (validationResult.warnings.length > 0) {
     const warningMessage = formatValidationErrors({
       isValid: true,
@@ -34,11 +19,8 @@ export function defineMCP(config) {
     logger.warn('Configuration warnings', warningMessage);
   }
 
-  // Convert validated tool definitions to MCP format
-  /** @type {import('./types/mcp.js').MCPTool[]} */
   const mcpTools = config.tools.map((tool) => {
     if (Array.isArray(tool)) {
-      // Handle [name, function] format
       const [name, handler] = tool;
       return {
         name: name.trim(),
@@ -51,8 +33,7 @@ export function defineMCP(config) {
         handler,
       };
     } else {
-      // Handle object format
-      const { name, handler, description, schema } = tool;
+      const { name, handler, description, schema, confirm } = tool;
       return {
         name: name.trim(),
         description: description || `Tool: ${name}`,
@@ -62,15 +43,16 @@ export function defineMCP(config) {
           additionalProperties: true,
         },
         handler,
+        confirm: !!confirm,
       };
     }
   });
 
-  // Return MCP-compliant config
   return {
     name: config.name,
     version: config.version,
     description: config.description,
+    server: config.server || {},
     tools: mcpTools,
   };
 }

package/src/index.js

@@ -1,33 +1,5 @@
-/**
- * MCP-Connect - Dead simple MCP (Model Context Protocol) server for exposing your app functions to AI agents
- *
- * Main entry point - exports public API
- *
- * @example
- * ```javascript
- * import { defineMCP } from 'mcp-connect';
- *
- * export default defineMCP({
- *   name: 'My App',
- *   version: '1.0.0',
- *   tools: [
- *     ['hello', async ({ name }) => `Hello ${name}!`]
- *   ]
- * });
- * ```
- */
-
-// Main API exports
 export { defineMCP } from './defineMCP.js';
 export { MCPConnectServer } from './server/mcpServer.js';
-
-// Type validation utilities (for runtime type checking)
+export { MCPRelayServer } from './server/relay.js';
+export { encrypt, decrypt } from './utils/crypto.js';
 export { isValidMCPConfig, isValidMCPTool, isValidToolDefinition } from './types/mcp.js';
-
-/**
- * @typedef {import('./types/mcp.js').MCPConfig} MCPConfig
- * @typedef {import('./types/mcp.js').MCPTool} MCPTool
- * @typedef {import('./types/mcp.js').ToolDefinition} ToolDefinition
- * @typedef {import('./types/mcp.js').MCPServerOptions} MCPServerOptions
- * @typedef {import('./types/mcp.js').ToolFunction} ToolFunction
- */

package/src/server/dashboard.js

@@ -0,0 +1,212 @@
+/**
+ * Returns the inspector dashboard HTML.
+ * Self-contained: inline CSS + JS, no external deps.
+ */
+export function getDashboardHTML(serverName, tools) {
+  const toolListJSON = JSON.stringify(tools.map(t => ({
+    name: t.name,
+    description: t.description,
+    inputSchema: t.inputSchema,
+  })));
+
+  return `<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>${serverName} — MCP Inspector</title>
+<style>
+  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+  :root {
+    --bg: #0f1117; --surface: #1a1d27; --border: #2a2d3a;
+    --text: #e1e4ed; --text-dim: #8b8fa3; --accent: #6c63ff;
+    --green: #34d399; --red: #f87171; --yellow: #fbbf24;
+    --font: 'SF Mono', 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
+  }
+  body { font-family: var(--font); background: var(--bg); color: var(--text); font-size: 13px; height: 100vh; display: flex; flex-direction: column; }
+  header { padding: 12px 20px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 12px; background: var(--surface); }
+  header h1 { font-size: 14px; font-weight: 600; }
+  header .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); animation: pulse 2s infinite; }
+  @keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .4; } }
+  header .meta { margin-left: auto; color: var(--text-dim); font-size: 11px; }
+
+  .container { display: flex; flex: 1; overflow: hidden; }
+
+  /* Sidebar */
+  .sidebar { width: 280px; border-right: 1px solid var(--border); display: flex; flex-direction: column; background: var(--surface); }
+  .sidebar h2 { padding: 12px 16px 8px; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: var(--text-dim); }
+  .tool-list { flex: 1; overflow-y: auto; }
+  .tool-item { padding: 10px 16px; border-bottom: 1px solid var(--border); cursor: pointer; transition: background .15s; }
+  .tool-item:hover { background: rgba(108,99,255,.1); }
+  .tool-item .name { font-weight: 600; font-size: 13px; }
+  .tool-item .desc { color: var(--text-dim); font-size: 11px; margin-top: 2px; }
+
+  /* Main panel */
+  .main { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
+  .tabs { display: flex; border-bottom: 1px solid var(--border); background: var(--surface); }
+  .tab { padding: 10px 20px; cursor: pointer; font-size: 12px; color: var(--text-dim); border-bottom: 2px solid transparent; transition: all .15s; }
+  .tab.active { color: var(--accent); border-bottom-color: var(--accent); }
+
+  /* Logs panel */
+  .logs { flex: 1; overflow-y: auto; padding: 0; }
+  .log-entry { display: flex; align-items: center; gap: 12px; padding: 8px 16px; border-bottom: 1px solid var(--border); font-size: 12px; cursor: pointer; transition: background .1s; }
+  .log-entry:hover { background: rgba(108,99,255,.05); }
+  .log-entry.selected { background: rgba(108,99,255,.1); }
+  .log-time { color: var(--text-dim); white-space: nowrap; }
+  .log-method { background: var(--accent); color: #fff; padding: 2px 8px; border-radius: 3px; font-size: 10px; font-weight: 600; }
+  .log-tool { font-weight: 600; }
+  .log-duration { color: var(--text-dim); margin-left: auto; white-space: nowrap; }
+  .log-status { width: 8px; height: 8px; border-radius: 50%; }
+  .log-status.ok { background: var(--green); }
+  .log-status.err { background: var(--red); }
+  .empty-state { display: flex; align-items: center; justify-content: center; flex: 1; color: var(--text-dim); font-size: 14px; }
+
+  /* Detail panel */
+  .detail { border-top: 1px solid var(--border); max-height: 40%; overflow-y: auto; padding: 16px; background: var(--surface); display: none; }
+  .detail.visible { display: block; }
+  .detail h3 { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: var(--text-dim); margin-bottom: 8px; }
+  .detail pre { background: var(--bg); padding: 12px; border-radius: 6px; overflow-x: auto; font-size: 12px; margin-bottom: 16px; white-space: pre-wrap; word-break: break-all; }
+
+  /* Test panel */
+  .test-panel { flex: 1; padding: 20px; overflow-y: auto; display: none; }
+  .test-panel.visible { display: block; }
+  .test-panel label { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: var(--text-dim); margin-bottom: 6px; }
+  .test-panel select, .test-panel textarea { width: 100%; background: var(--bg); border: 1px solid var(--border); color: var(--text); font-family: var(--font); font-size: 13px; padding: 10px; border-radius: 6px; margin-bottom: 16px; outline: none; }
+  .test-panel select:focus, .test-panel textarea:focus { border-color: var(--accent); }
+  .test-panel textarea { min-height: 100px; resize: vertical; }
+  .test-btn { background: var(--accent); color: #fff; border: none; padding: 10px 24px; border-radius: 6px; font-family: var(--font); font-size: 13px; font-weight: 600; cursor: pointer; transition: opacity .15s; }
+  .test-btn:hover { opacity: .85; }
+  .test-btn:disabled { opacity: .5; cursor: not-allowed; }
+  .test-result { margin-top: 16px; }
+  .test-result pre { background: var(--bg); padding: 12px; border-radius: 6px; font-size: 12px; white-space: pre-wrap; word-break: break-all; }
+  .counter { background: var(--border); color: var(--text-dim); padding: 2px 8px; border-radius: 10px; font-size: 10px; margin-left: 6px; }
+</style>
+</head>
+<body>
+<header>
+  <div class="dot"></div>
+  <h1>${serverName}</h1>
+  <span class="meta">MCP Inspector</span>
+</header>
+<div class="container">
+  <div class="sidebar">
+    <h2>Tools</h2>
+    <div class="tool-list" id="toolList"></div>
+  </div>
+  <div class="main">
+    <div class="tabs">
+      <div class="tab active" data-tab="logs">Logs <span class="counter" id="logCount">0</span></div>
+      <div class="tab" data-tab="test">Test Tool</div>
+    </div>
+    <div class="logs" id="logsPanel">
+      <div class="empty-state" id="emptyState">Waiting for requests…</div>
+    </div>
+    <div class="detail" id="detailPanel"></div>
+    <div class="test-panel" id="testPanel">
+      <label for="toolSelect">Tool</label>
+      <select id="toolSelect"></select>
+      <label for="argsInput">Arguments (JSON)</label>
+      <textarea id="argsInput">{}</textarea>
+      <button class="test-btn" id="testBtn" onclick="runTest()">Execute</button>
+      <div class="test-result" id="testResult"></div>
+    </div>
+  </div>
+</div>
+<script>
+const TOOLS = ${toolListJSON};
+let logs = [];
+let selectedLogIndex = -1;
+
+// Render tool sidebar
+const toolList = document.getElementById('toolList');
+TOOLS.forEach(t => {
+  const el = document.createElement('div');
+  el.className = 'tool-item';
+  el.innerHTML = '<div class="name">' + esc(t.name) + '</div><div class="desc">' + esc(t.description || '') + '</div>';
+  el.onclick = () => { document.getElementById('toolSelect').value = t.name; switchTab('test'); };
+  toolList.appendChild(el);
+});
+
+// Render tool select
+const sel = document.getElementById('toolSelect');
+TOOLS.forEach(t => { const o = document.createElement('option'); o.value = t.name; o.textContent = t.name; sel.appendChild(o); });
+sel.onchange = () => {
+  const tool = TOOLS.find(t => t.name === sel.value);
+  if (tool && tool.inputSchema && tool.inputSchema.properties) {
+    const example = {};
+    for (const [k, v] of Object.entries(tool.inputSchema.properties)) { example[k] = v.type === 'number' ? 0 : ''; }
+    document.getElementById('argsInput').value = JSON.stringify(example, null, 2);
+  }
+};
+if (TOOLS.length) sel.dispatchEvent(new Event('change'));
+
+// Tabs
+document.querySelectorAll('.tab').forEach(tab => tab.onclick = () => switchTab(tab.dataset.tab));
+function switchTab(name) {
+  document.querySelectorAll('.tab').forEach(t => t.classList.toggle('active', t.dataset.tab === name));
+  document.getElementById('logsPanel').style.display = name === 'logs' ? '' : 'none';
+  document.getElementById('detailPanel').style.display = name === 'logs' && selectedLogIndex >= 0 ? 'block' : 'none';
+  document.getElementById('testPanel').style.display = name === 'test' ? 'block' : 'none';
+}
+
+// SSE log stream
+const evtSrc = new EventSource('/api/events');
+evtSrc.onmessage = (e) => {
+  const entry = JSON.parse(e.data);
+  logs.push(entry);
+  document.getElementById('logCount').textContent = logs.length;
+  document.getElementById('emptyState')?.remove();
+  appendLogRow(entry, logs.length - 1);
+};
+
+function appendLogRow(entry, index) {
+  const panel = document.getElementById('logsPanel');
+  const row = document.createElement('div');
+  row.className = 'log-entry';
+  const time = new Date(entry.timestamp).toLocaleTimeString();
+  row.innerHTML =
+    '<span class="log-time">' + time + '</span>' +
+    '<span class="log-method">CALL</span>' +
+    '<span class="log-tool">' + esc(entry.tool) + '</span>' +
+    '<span class="log-duration">' + entry.duration + 'ms</span>' +
+    '<div class="log-status ' + (entry.error ? 'err' : 'ok') + '"></div>';
+  row.onclick = () => showDetail(index, row);
+  panel.appendChild(row);
+  panel.scrollTop = panel.scrollHeight;
+}
+
+function showDetail(index, rowEl) {
+  selectedLogIndex = index;
+  const entry = logs[index];
+  document.querySelectorAll('.log-entry').forEach(r => r.classList.remove('selected'));
+  if (rowEl) rowEl.classList.add('selected');
+  const detail = document.getElementById('detailPanel');
+  detail.className = 'detail visible';
+  detail.innerHTML =
+    '<h3>Request</h3><pre>' + esc(JSON.stringify(entry.args, null, 2)) + '</pre>' +
+    '<h3>' + (entry.error ? 'Error' : 'Response') + '</h3><pre>' + esc(entry.error || entry.response || 'null') + '</pre>';
+}
+
+// Test tool execution
+async function runTest() {
+  const btn = document.getElementById('testBtn');
+  const resultDiv = document.getElementById('testResult');
+  const tool = document.getElementById('toolSelect').value;
+  let args;
+  try { args = JSON.parse(document.getElementById('argsInput').value); } catch { resultDiv.innerHTML = '<pre style="color:var(--red)">Invalid JSON</pre>'; return; }
+  btn.disabled = true; btn.textContent = 'Running…';
+  try {
+    const res = await fetch('/api/test', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ tool, args }) });
+    const data = await res.json();
+    resultDiv.innerHTML = '<pre>' + esc(JSON.stringify(data, null, 2)) + '</pre>';
+  } catch (err) {
+    resultDiv.innerHTML = '<pre style="color:var(--red)">' + esc(err.message) + '</pre>';
+  }
+  btn.disabled = false; btn.textContent = 'Execute';
+}
+
+function esc(s) { const d = document.createElement('div'); d.textContent = String(s ?? ''); return d.innerHTML; }
+</script>
+</body>
+</html>`;
+}