<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AI Workspace MCP Server</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
}
.container {
background: white;
border-radius: 12px;
box-shadow: 0 20px 60px rgba(0,0,0,0.3);
max-width: 800px;
width: 100%;
padding: 40px;
}
h1 {
color: #333;
margin-bottom: 10px;
font-size: 2em;
}
.status {
display: inline-block;
background: #10b981;
color: white;
padding: 4px 12px;
border-radius: 20px;
font-size: 0.85em;
font-weight: 600;
margin-bottom: 20px;
}
.description {
color: #666;
margin-bottom: 30px;
line-height: 1.6;
}
.endpoints {
background: #f8fafc;
border-radius: 8px;
padding: 20px;
margin-bottom: 30px;
}
.endpoints h2 {
color: #333;
font-size: 1.2em;
margin-bottom: 15px;
}
.endpoint {
background: white;
border: 1px solid #e2e8f0;
border-radius: 6px;
padding: 12px 16px;
margin-bottom: 10px;
display: flex;
align-items: center;
gap: 10px;
}
.method {
background: #667eea;
color: white;
padding: 4px 8px;
border-radius: 4px;
font-size: 0.75em;
font-weight: 700;
min-width: 50px;
text-align: center;
}
.method.post {
background: #f59e0b;
}
.path {
font-family: 'Monaco', 'Courier New', monospace;
color: #333;
font-weight: 500;
}
.desc {
color: #64748b;
font-size: 0.9em;
margin-left: auto;
}
.tools {
margin-top: 20px;
}
.tools h2 {
color: #333;
font-size: 1.2em;
margin-bottom: 15px;
}
.tool-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 10px;
}
.tool {
background: #f1f5f9;
border: 1px solid #e2e8f0;
border-radius: 6px;
padding: 12px;
font-size: 0.9em;
}
.tool-name {
color: #667eea;
font-weight: 600;
margin-bottom: 4px;
}
.tool-desc {
color: #64748b;
font-size: 0.85em;
}
.example {
background: #1e293b;
color: #e2e8f0;
border-radius: 8px;
padding: 20px;
margin-top: 30px;
font-family: 'Monaco', 'Courier New', monospace;
font-size: 0.85em;
overflow-x: auto;
}
.example pre {
margin: 0;
white-space: pre-wrap;
}
.keyword {
color: #f472b6;
}
.string {
color: #a78bfa;
}
.footer {
margin-top: 30px;
padding-top: 20px;
border-top: 1px solid #e2e8f0;
text-align: center;
color: #64748b;
font-size: 0.9em;
}
a {
color: #667eea;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<div class="container">
<h1>🤖 AI Workspace MCP Server</h1>
<span class="status">● RUNNING</span>
<p class="description">
A Model Context Protocol server providing AI with secure file management and Python execution capabilities.
Deploy on Vercel for serverless AI workspace operations.
</p>
<div class="endpoints">
<h2>📡 API Endpoints</h2>
<div class="endpoint">
<span class="method">GET</span>
<span class="path">/</span>
<span class="desc">Server info</span>
</div>
<div class="endpoint">
<span class="method">GET</span>
<span class="path">/health</span>
<span class="desc">Health check</span>
</div>
<div class="endpoint">
<span class="method">GET</span>
<span class="path">/tools</span>
<span class="desc">List available tools</span>
</div>
<div class="endpoint">
<span class="method post">POST</span>
<span class="path">/execute</span>
<span class="desc">Execute a tool</span>
</div>
</div>
<div class="tools">
<h2>🛠️ Available Tools</h2>
<div class="tool-grid">
<div class="tool">
<div class="tool-name">create_file</div>
<div class="tool-desc">Create new files</div>
</div>
<div class="tool">
<div class="tool-name">read_file</div>
<div class="tool-desc">Read file contents</div>
</div>
<div class="tool">
<div class="tool-name">update_file</div>
<div class="tool-desc">Update existing files</div>
</div>
<div class="tool">
<div class="tool-name">delete_file</div>
<div class="tool-desc">Delete files</div>
</div>
<div class="tool">
<div class="tool-name">list_files</div>
<div class="tool-desc">List directory contents</div>
</div>
<div class="tool">
<div class="tool-name">execute_python</div>
<div class="tool-desc">Run Python scripts</div>
</div>
<div class="tool">
<div class="tool-name">create_directory</div>
<div class="tool-desc">Create directories</div>
</div>
</div>
</div>
<div class="example">
<pre><span class="keyword">curl</span> -X POST <span class="string">https://your-project.vercel.app/execute</span> \
-H <span class="string">"Content-Type: application/json"</span> \
-d <span class="string">'{
"tool": "create_file",
"arguments": {
"filepath": "hello.py",
"content": "print(\"Hello AI!\")"
}
}'</span></pre>
</div>
<div class="footer">
<p>Built for AI • Deployed on Vercel • <a href="https://github.com" target="_blank">Documentation</a></p>
</div>
</div>
</body>
</html>
