Skip to main content
Glama

MCP Tools Documentation

A VSCode/Cursor extension that provides an integrated MCP server and UI panel for retrieving and displaying command-line tool documentation. The extension automatically detects tools in your workspace and provides their documentation through a WebView panel.

Core Features

  • πŸ”„ Built-in MCP Server

    • Express + SSE server (ports 54321-54421)

    • Secure origin validation

    • Automatic port selection

    • Connection management and cleanup

    • Real-time event streaming

  • πŸ” Tool Discovery

    • Package scripts (npm, yarn, pnpm)

    • Local binaries (node_modules/.bin)

    • Global tools (git, npm, yarn, pnpm)

    • Monorepo workspace support

  • πŸ“š Documentation Retrieval

    • Help command execution (-h, --help)

    • Version information fetching

    • Secure command validation

    • Error handling

  • πŸ’» VS Code Integration

    • React-based WebView panel

    • Status bar integration

    • Command palette support

    • Workspace path detection

Related MCP server: Nexus MCP Bridge for VSCode

Architecture

1. VS Code Extension (Backend)

Extension Host (src/extension.ts) β”œβ”€β”€ Activates when VS Code starts β”œβ”€β”€ Creates MCP Server β”‚ └── Express + SSE Server (54321-54421 port range) └── Creates WebView Panel

2. MCP Server (Middle Layer)

MCP Server (src/server/*) β”œβ”€β”€ SSE Event Stream β”‚ β”œβ”€β”€ Real-time tool discovery updates β”‚ β”œβ”€β”€ Documentation streaming β”‚ └── Connection state management β”‚ └── Tool Discovery System β”œβ”€β”€ path-scanner.ts β”‚ └── Finds tools in workspace (bin/, node_modules/.bin) └── package-scanner.ts └── Scans package.json for available tools

3. WebView Panel (Frontend)

React WebView (src/panel/*) β”œβ”€β”€ UI Components β”‚ └── Shows available tools and their docs β”‚ └── SSE Client β”œβ”€β”€ Requests available tools └── Streams tool documentation

Project Structure

my-tools-mcp/ β”œβ”€β”€ src/ # Source code β”‚ β”œβ”€β”€ extension.ts # Extension entry point β”‚ β”œβ”€β”€ env.ts # Environment configuration β”‚ β”œβ”€β”€ server/ # Built-in MCP server β”‚ β”‚ β”œβ”€β”€ index.ts # Server setup and SSE handling β”‚ β”‚ └── controllers/ # Tool discovery and execution β”‚ β”‚ β”œβ”€β”€ docs/ # Documentation controllers β”‚ β”‚ β”œβ”€β”€ path-scanner.ts # Tool discovery β”‚ β”‚ └── package-scanner.ts # Package.json scanning β”‚ β”œβ”€β”€ panel/ # WebView UI (React) β”‚ β”‚ β”œβ”€β”€ index.tsx # WebView entry point β”‚ β”‚ β”œβ”€β”€ App.tsx # Main React component β”‚ β”‚ └── components/ # UI components β”‚ β”œβ”€β”€ types/ # Shared TypeScript types β”‚ └── lib/ # Shared utilities β”œβ”€β”€ dist/ # Compiled output └── src/__tests__/ # Test files

Development Setup

  1. Install dependencies:

pnpm install
  1. Start development:

# Start webpack in watch mode pnpm run dev # Or build for production pnpm run build
  1. Launch the extension:

  • Press F5 in VSCode to start debugging

  • The extension will start both the MCP server and WebView panel

Usage

  1. Open the command palette (Cmd/Ctrl + Shift + P)

  2. Type "MCP Tools" and select the command

  3. The WebView panel will open and display available tools

  4. Select a tool to view its documentation

Technical Details

Tool Discovery

  • Package Scripts

    • Automatically detects npm/yarn/pnpm scripts

    • Shows script source and working directory

    • Supports monorepo workspaces

    • Validates script existence

  • Binary Tools

    • Finds tools in node_modules/.bin

    • Detects global tools (git, npm, yarn, pnpm)

    • Validates tool existence and permissions

    • Handles path resolution

Documentation Retrieval

  • Executes help commands (-h, --help)

  • Fetches version information

  • Handles command execution errors

  • Validates tool names and arguments

  • Implements proper timeouts

SSE Communication

  • Real-time tool discovery updates

  • Secure origin validation

  • Connection management and cleanup

  • Error handling and reporting

  • Automatic reconnection support

  • Event-based streaming

  • Bi-directional message passing

Security Features

  • Tool name validation

  • Command injection prevention

  • Origin validation for SSE connections

  • Proper error handling and reporting

  • Resource cleanup

  • Connection state management

Testing

The extension includes comprehensive tests:

  • Integration tests for server functionality

  • VS Code extension tests

  • Tool discovery tests

  • Security validation tests

  • SSE communication tests

License

ISC

-
security - not tested
F
license - not found
-
quality - not tested

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/patelnav/my-tools-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server