Model Context Protocol (MCP)
The Model Context Protocol (MCP) provides a standardized way to define, validate, and interact with AI model contexts across the Zopio codebase. It enables seamless communication between different parts of the application and AI models by providing a consistent interface for context management.
Key Features
- Standardized Resource Format: Consistent structure for all AI context resources
- Schema Validation: Type-safe validation using Zod schemas
- Server/Client Architecture: Flexible architecture for hosting and consuming resources
- Built-in Resource Types: Pre-defined schemas for common resource types (packages, components, APIs, models)
- Utility Functions: Helper functions for working with MCP resources
Core Components
Protocol
The core protocol implementation provides the foundation for resource validation and creation:
import { validateResource, createResource } from '@repo/mcp';
// Create a new resource
const userResource = createResource({
id: 'user-123',
type: 'user',
attributes: {
name: 'John Doe',
email: 'john@example.com'
}
});
// Validate a resource against its schema
const isValid = validateResource(userResource, userSchema);
Server
The MCP server hosts resources that can be consumed by clients:
import { MCPServer } from '@repo/mcp';
import { z } from 'zod';
// Define resource schemas
const userSchema = z.object({
id: z.string(),
type: z.literal('user'),
attributes: z.object({
name: z.string(),
email: z.string().email(),
role: z.enum(['admin', 'user', 'guest'])
}).optional()
});
// Create server configuration
const serverConfig = {
name: 'UserService',
description: 'Provides user context for AI models',
resources: {
user: MCPServer.createResourceDefinition(userSchema, {
description: 'User resource',
examples: [{
id: 'user-123',
type: 'user',
attributes: {
name: 'John Doe',
email: 'john@example.com',
role: 'admin'
}
}]
})
}
};
// Initialize server
const server = new MCPServer(serverConfig);
// Register resources
server.registerResource({
id: 'user-123',
type: 'user',
attributes: {
name: 'John Doe',
email: 'john@example.com',
role: 'admin'
}
});
Client
The MCP client consumes resources from servers:
import { MCPClient } from '@repo/mcp';
// Initialize client
const client = new MCPClient({
serverUrl: 'https://mcp-server.example.com'
});
// List available resources
const resources = await client.listResources();
// Read a specific resource
const user = await client.readResource('user', 'user-123');
Resource Schemas
MCP provides pre-defined schemas for common resource types:
Package Schema
import { packageSchema, createPackageResource } from '@repo/mcp';
const packageResource = createPackageResource({
id: 'my-package',
attributes: {
name: '@repo/my-package',
version: '1.0.0',
description: 'My awesome package',
dependencies: {
'zod': '^3.25.0'
}
}
});
Component Schema
import { componentSchema, createComponentResource } from '@repo/mcp';
const componentResource = createComponentResource({
id: 'button',
attributes: {
name: 'Button',
props: {
variant: {
type: 'string',
enum: ['primary', 'secondary', 'outline'],
default: 'primary'
},
size: {
type: 'string',
enum: ['sm', 'md', 'lg'],
default: 'md'
}
}
}
});
API Schema
import { apiSchema, createApiResource } from '@repo/mcp';
const apiResource = createApiResource({
id: 'get-users',
attributes: {
path: '/api/users',
method: 'GET',
parameters: {
page: {
type: 'number',
default: 1,
description: 'Page number'
},
limit: {
type: 'number',
default: 10,
description: 'Number of items per page'
}
},
responses: {
'200': {
description: 'List of users',
content: {
'application/json': {
schema: {
type: 'array',
items: {
type: 'object',
properties: {
id: { type: 'string' },
name: { type: 'string' },
email: { type: 'string' }
}
}
}
}
}
}
}
}
});
Model Schema
import { modelSchema, createModelResource } from '@repo/mcp';
const modelResource = createModelResource({
id: 'user',
attributes: {
name: 'User',
properties: {
id: {
type: 'string',
description: 'Unique identifier'
},
name: {
type: 'string',
description: 'User name'
},
email: {
type: 'string',
format: 'email',
description: 'User email address'
},
role: {
type: 'string',
enum: ['admin', 'user', 'guest'],
default: 'user',
description: 'User role'
}
},
required: ['id', 'name', 'email']
}
});
Integration with AI Features
MCP can be integrated with AI features to provide context for AI models:
import { MCPClient, createResource } from '@repo/mcp';
import { generateText } from '@repo/ai';
// Create a client to fetch context
const mcpClient = new MCPClient({
serverUrl: '/api/mcp'
});
// Fetch user context for AI
const userContext = await mcpClient.readResource('user', userId);
// Use context in AI request
const aiResponse = await generateText({
model: models.chat,
prompt: 'Generate a personalized greeting',
context: {
user: userContext
}
});
Installation
# From the root of your Zopio project
pnpm add @repo/mcp
Development Guidelines
- All resources must implement the
Resource
interface
- Use Zod schemas for validation
- Follow the resource-based architecture pattern
- Maintain backward compatibility when updating schemas