MCP Connector

Connect to and Manage LLMs via Desktop App

An Electron desktop chat app implementing MCP to test multiple LLMs and MCP servers, now superseded by its restructured successor TUUI.

Works with openaielectron

91
Spark score
out of 100
Updated 10 months ago
Version 1.0.0
Models
universal

Add to Favorites

Why it matters

Interact with various Large Language Models (LLMs) through a unified, cross-platform desktop application. This tool simplifies LLM management and configuration, enabling flexible integration with different AI services.

Outcomes

What it gets done

01

Configure and connect to multiple LLM servers using MCP.

02

Manage LLM API keys and settings for services like GPT, Qwen, and DeepInfra.

03

Utilize a clean, minimalist interface for dynamic LLM interaction.

04

Debug and customize LLM configurations for various applications.

Install

Add it to your toolbox

Run in your project directory:

curl -fsSL https://spark.entire.vc/get/vb-chatmcp | bash

Overview

ChatMCP

A cross-platform Electron desktop chat app implementing MCP as a minimal reference client for testing multiple LLM backends and MCP servers side by side. Use to quickly test different LLM backends and MCP servers together, or study a straightforward MCP reference implementation - its successor TUUI is the actively developed option for new work.

What it does

Delivers a cross-platform Electron desktop chat interface that connects to various LLMs through the Model Context Protocol, built as a clean, minimalistic codebase meant to make MCP's core principles easy to understand and to quickly test multiple servers and LLM backends. It works with any OpenAI SDK-compatible LLM, configured dynamically through preset or manual JSON configs, for example:

{
    "chatbotStore": {
        "apiKey": "",
        "url": "https://dashscope.aliyuncs.com/compatible-mode",
        "path": "/v1/chat/completions",
        "model": "qwen-turbo",
        "max_tokens_value": "",
        "mcp": true
    },
    "defaultChoiceStore": {
        "model": ["qwen-turbo", "qwen-plus", "qwen-max"]
    }
}

Other presets cover OpenAI's own gpt-4o-mini/gpt-4o/gpt-4/gpt-4-turbo lineup and DeepInfra-hosted Llama 3.1 models, and the app manages multiple clients connecting to multiple MCP servers through a single MCP config. The UI itself is built to be extractable for web use, so the same interaction logic and ecosystem carries across both the desktop and web versions.

The project originated as a modified version of Chat-UI, adopted specifically for its minimalist approach to core MCP functionality for educational purposes. Community feedback pushing for a new architecture without third-party CDN dependencies and with a clearer modular structure led to a full restructure named TUUI (Tool Unitary User Interface), which is now the actively developed successor - this original repository's refactoring is largely complete with a pre-release available, and TUUI itself uses strict linting and formatting to keep AI-assisted contributions on standard.

When to use - and when NOT to

Use it to quickly test different LLM backends and MCP servers together in one cross-platform desktop client, or to study a straightforward MCP reference implementation. Running it locally means cloning the repo, editing the MCP server command and path values in config.json under src/main, confirming Node.js is installed, then npm install and npm start; a custom desktop build is produced with npm run build-app, with artifacts landing in the /artifacts directory. Known troubleshooting covers a Windows-specific spawn npx ENOENT failure worked around by using node directly in config.json instead of npx, slow or stalled Electron downloads during npm install fixed by pointing the ELECTRON_MIRROR environment variable at an accessible mirror, and electron-builder packaging timeouts resolved by clearing its Windows cache directories and using the default shell terminal rather than an IDE-embedded one. By default it installs server-everything, server-filesystem, and server-puppeteer for testing, with additional server libraries installable as needed.

Capabilities

Cross-platform desktop chat across Linux, macOS, and Windows with dynamic LLM backend switching for any OpenAI SDK-compatible provider, multi-client and multi-server MCP configuration, multimodal input, LaTeX-rendered reasoning output, and visualized MCP tool calls and prompt templates.

How to install

Clone the repository, edit config.json in src/main with valid MCP server commands and paths, confirm Node.js is installed, then run npm install followed by npm start; package a distributable build with npm run build-app.

Who it's for

Developers and researchers who want to quickly test multiple LLMs and MCP servers side by side in a minimal, understandable reference client, noting the project's own architecture has been superseded by TUUI for anyone starting new development.

Source README

MCP Chat Desktop App

A Cross-Platform Interface for LLMs

This desktop application utilizes the MCP (Model Context Protocol) to seamlessly connect and interact with various Large Language Models (LLMs). Built on Electron, the app ensures full cross-platform compatibility, enabling smooth operation across different operating systems.

The primary objective of this project is to deliver a clean, minimalistic codebase that simplifies understanding the core principles of MCP. Additionally, it provides a quick and efficient way to test multiple servers and LLMs, making it an ideal tool for developers and researchers alike.

News

This project originated as a modified version of Chat-UI, initially adopting a minimalist code approach to implement core MCP functionality for educational purposes.

Through iterative updates to MCP, I received community feedback advocating for a completely new architecture - one that eliminates third-party CDN dependencies and establishes clearer modular structure to better support derivative development and debugging workflows.

This led to the creation of Tool Unitary User Interface, a restructured desktop application optimized for AI-powered development. Building upon the original foundation, TUUI serves as a practical AI-assisted development paradigm, if you're interested, you can also leverage AI to develop new features for TUUI. The platform employs a strict linting and formatting system to ensure AI-generated code adheres to coding standards.

📢 Update: June 2025
The current project refactoring has been largely completed, and a pre-release version is now available. Please refer to the following documentation for details:

Features

  • Cross-Platform Compatibility: Supports Linux, macOS, and Windows.

  • Flexible Apache-2.0 License: Allows easy modification and building of your own desktop applications.

  • Dynamic LLM Configuration: Compatible with all OpenAI SDK-supported LLMs, enabling quick testing of multiple backends through manual or preset configurations.

  • Multi-Client Management: Configure and manage multiple clients to connect to multiple servers using MCP config.

  • UI Adaptability: The UI can be directly extracted for web use, ensuring consistent ecosystem and interaction logic across web and desktop versions.

Architecture

Adopted a straightforward architecture consistent with the MCP documentation to facilitate a clear understanding of MCP principles by:

DeepWiki

How to use

After cloning or downloading this repository:

  1. Please modify the config.json file located in src/main.
    Ensure that the command and path specified in the args are valid.

  2. Please ensure that Node.js is installed on your system.
    You can verify this by running node -v and npm -v in your terminal to check their respective versions.

  3. npm install

  4. npm start

Configuration

Create a .json file and paste the following content into it. This file can then be provided as the interface configuration for the Chat UI.

  • gtp-api.json

    {
        "chatbotStore": {
            "apiKey": "",
            "url": "https://api.aiql.com",
            "path": "/v1/chat/completions",
            "model": "gpt-4o-mini",
            "max_tokens_value": "",
            "mcp": true
        },
        "defaultChoiceStore": {
            "model": [
                "gpt-4o-mini",
                "gpt-4o",
                "gpt-4",
                "gpt-4-turbo"
            ]
        }
    }
    

You can replace the 'url' if you have direct access to the OpenAI API.

Alternatively, you can also use another API endpoint that supports function calls:

  • qwen-api.json

    {
        "chatbotStore": {
            "apiKey": "",
            "url": "https://dashscope.aliyuncs.com/compatible-mode",
            "path": "/v1/chat/completions",
            "model": "qwen-turbo",
            "max_tokens_value": "",
            "mcp": true
        },
        "defaultChoiceStore": {
            "model": [
                "qwen-turbo",
                "qwen-plus",
                "qwen-max"
            ]
        }
    }
    
  • deepinfra.json

    {
        "chatbotStore": {
            "apiKey": "",
            "url": "https://api.deepinfra.com",
            "path": "/v1/openai/chat/completions",
            "model": "meta-llama/Meta-Llama-3.1-70B-Instruct",
            "max_tokens_value": "32000",
            "mcp": true
        },
        "defaultChoiceStore": {
            "model": [
                "meta-llama/Meta-Llama-3.1-70B-Instruct",
                "meta-llama/Meta-Llama-3.1-405B-Instruct",
                "meta-llama/Meta-Llama-3.1-8B-Instruct"
            ]
        }
    }
    

Build Application

You can build your own desktop application by:

npm run build-app

This CLI helps you build and package your application for your current OS, with artifacts stored in the /artifacts directory.

For Debian/Ubuntu users experiencing RPM build issues, try one of the following solutions:

  • Edit package.json to skip the RPM build step. Or

  • Install rpm using sudo apt-get install rpm (You may need to run sudo apt update to ensure your package list is up-to-date)

Troubleshooting

Error: spawn npx ENOENT - ISSUE 40

Modify the config.json in src/main

On windows, npx may not work, please refer my workaround: ISSUE 101

  • Or you can use node in config.json:
    {
        "mcpServers": {
            "filesystem": {
            "command": "node",
            "args": [
                "node_modules/@modelcontextprotocol/server-filesystem/dist/index.js",
                "D:/Github/mcp-test"
            ]
            }
        }
    }
    

Please ensure that the provided path is valid, especially if you are using a relative path. It is highly recommended to provide an absolute path for better clarity and accuracy.

By default, I will install server-everything, server-filesystem, and server-puppeteer for test purposes. However, you can install additional server libraries or use npx to utilize other server libraries as needed.

Installation timeout

Generally, after executing npm install for the entire project, the total size of files in the node_modules directory typically exceeds 500MB.

If the installation process stalls at less than 300MB and the progress bar remains static, it is likely due to a timeout during the installation of the latter part, specifically Electron.

This issue often arises because the download speed from Electron's default server is excessively slow or even inaccessible in certain regions. To resolve this, you can modify the environment or global variable ELECTRON_MIRROR to switch to an Electron mirror site that is accessible from your location.

Electron builder timeout

When using electron-builder to package files, it automatically downloads several large release packages from GitHub. If the network connection is unstable, this process may be interrupted or timeout.

On Windows, you may need to clear the cache located under the electron and electron-builder directories within C:\Users\YOURUSERNAME\AppData\Local before attempting to retry.

Due to potential terminal permission issues, it is recommended to use the default shell terminal instead of VSCode's built-in terminal.

Demo

Multimodal Support

Reasoning and Latex Support

MCP Tools Visualization

MCP Toolcall Process Overview

MCP Prompts Template

Dynamic LLM Config

DevTool Troubleshooting

FAQ

Common questions

Discussion

Questions & comments · 0

Sign In Sign in to leave a comment.