What Are MCP Servers in Tambo AI? A Complete Technical Guide

MCP servers in Tambo AI are remote JSON-RPC services that provide prompts, resources, and tools to React applications through a normalized, prefixed naming scheme like linear:issue-create.

MCP (Model Context Protocol) servers act as the back-end infrastructure for AI-augmented assets in the Tambo AI ecosystem. When building applications with the Tambo React SDK, you register these servers to expose external capabilities—such as prompt templates, file resources, and tool handlers—directly within your components.

Understanding MCP Servers in Tambo AI

The Model Context Protocol Foundation

MCP servers implement the Model Context Protocol JSON-RPC API, a standardized interface for AI systems to discover and invoke remote capabilities. In react-sdk/src/model/mcp-server-info.ts, the SDK defines the MCPTransport enum distinguishing between SSE (Server-Sent Events for streaming) and HTTP (standard request-response) transport mechanisms.

These servers function as authoritative sources for three primary asset types:

• Prompts: Pre-defined templates for AI interactions
• Resources: Files, images, or data blobs accessible via URI
• Tools: Executable handlers for sampling or elicitation tasks

Server Registration via TamboProvider

You register MCP servers through the mcpServers prop on TamboProvider or TamboRegistryProvider. Each entry follows the McpServerInfo interface, which the SDK internally normalizes to NormalizedMcpServerInfo to ensure consistent handling.

import { TamboProvider, MCPTransport } from "@tambo-ai/react";

<TamboProvider
  mcpServers={[
    {
      url: "https://mcp.linear.app/mcp",
      // serverKey derived automatically as "linear"
    },
    {
      url: "https://my-custom-mcp.com",
      serverKey: "custom",
      transport: MCPTransport.SSE,
      customHeaders: { Authorization: "Bearer xyz" },
    },
  ]}
/>

Configuring MCP Servers

Transport Protocols

The Tambo SDK supports two transport mechanisms defined in react-sdk/src/model/mcp-server-info.ts:

• MCPTransport.HTTP: Standard JSON-RPC over HTTP for simple request-response patterns
• MCPTransport.SSE: Server-Sent Events for streaming real-time updates or long-running operations

When omitted, the SDK defaults to HTTP transport.

Normalization and Deduplication

Before establishing connections, the SDK processes server configurations through utilities in react-sdk/src/util/mcp-server-utils.ts:

1. Normalization: The normalizeServerInfo function converts string URLs or partial McpServerInfo objects into NormalizedMcpServerInfo with guaranteed serverKey and transport values. If no serverKey is provided, the SDK derives one from the URL hostname (e.g., linear from https://mcp.linear.app/mcp).

2. Deduplication: The deduplicateMcpServers function ensures only one client exists per unique URL/transport/header combination. When duplicates are detected, the SDK auto-suffixes keys (linear-2, linear-3) to prevent collisions while maintaining access to all configured endpoints.

import {
  normalizeServerInfo,
  deduplicateMcpServers,
} from "@tambo-ai/react/util/mcp-server-utils";

const rawConfigs = [
  { url: "https://mcp.linear.app/mcp" },
  "https://mcp.linear.app/mcp", // duplicate entry
];

const normalized = rawConfigs.map(s => normalizeServerInfo(s));
const unique = deduplicateMcpServers(normalized);
// Results in unique keys: "linear", "linear-2"

Accessing Prompts and Resources

Listing MCP Prompts

The useTamboMcpPromptList hook in react-sdk/src/mcp/mcp-hooks.ts aggregates available prompts from all registered MCP servers. It automatically prefixes each prompt name with its originating serverKey (e.g., linear:issue-create), allowing you to distinguish between identically named prompts from different servers.

import { useTamboMcpPromptList } from "@tambo-ai/react/mcp";

function PromptCatalog({ search }: { search?: string }) {
  const { data: prompts, isLoading } = useTamboMcpPromptList(search);

  if (isLoading) return <Spinner />;
  return (
    <ul>
      {prompts?.map(p => (
        <li key={p.prompt.name}>
          {p.prompt.name} (from {p.server.serverKey})
        </li>
      ))}
    </ul>
  );
}

Fetching Specific Prompts

To retrieve a specific prompt template, use useTamboMcpPrompt with the prefixed identifier. The hook resolves the correct MCP server by parsing the serverKey prefix, then routes the request to the appropriate client.

const { data: promptResult } = useTamboMcpPrompt(
  "linear:issue-create",
  { title: "Bug report", description: "Application crashes on startup" }
);

The prefix-stripping logic and server resolution occur in react-sdk/src/mcp/mcp-hooks.ts at lines 56-68.

Resolving Resources

For accessing files, images, or binary data exposed by MCP servers, the SDK provides useTamboMcpResource and useTamboMcpResourceList. These hooks handle URI-based resource resolution, automatically routing requests to the correct server based on the serverKey prefix embedded in the resource URI.

import { useTamboMcpResource } from "@tambo-ai/react/mcp";

function ImageViewer({ uri }: { uri: string }) {
  const { data: resource } = useTamboMcpResource(uri);
  
  return resource?.type === "image" ? (
    <img src={resource.url} alt={resource.name} />
  ) : null;
}

The underlying resolution logic resides in react-sdk/src/util/resource-content-resolver.ts, which coordinates between registry and MCP-based resource providers.

Core Implementation Files

The MCP server functionality in Tambo AI is implemented across these key source files:

File	Purpose
react-sdk/src/model/mcp-server-info.ts	Defines MCPTransport enum, McpServerInfo interface, and NormalizedMcpServerInfo type
react-sdk/src/util/mcp-server-utils.ts	Contains normalizeServerInfo and deduplicateMcpServers utilities for processing configurations
react-sdk/src/mcp/mcp-hooks.ts	Implements React hooks: useTamboMcpPromptList, useTamboMcpPrompt, useTamboMcpResourceList, useTamboMcpResource
react-sdk/src/util/resource-content-resolver.ts	Client-side resolver for fetching MCP resources by URI
react-sdk/src/v1/index.ts	Public export surface for McpServerInfo, NormalizedMcpServerInfo, and MCPTransport

Summary

• MCP servers in Tambo AI are remote JSON-RPC services that expose prompts, resources, and tools to React applications via the Model Context Protocol.
• Configuration occurs through the mcpServers prop on TamboProvider, supporting both HTTP and SSE transports with optional custom headers.
• Normalization ensures every server has a stable serverKey (derived from URL or explicitly provided), while deduplication prevents connection collisions by auto-suffixing duplicate keys.
• React hooks like useTamboMcpPrompt and useTamboMcpResource automatically handle server routing via prefixed identifiers (e.g., linear:issue-create), abstracting the underlying JSON-RPC complexity.

Frequently Asked Questions

What does MCP stand for in Tambo AI?

MCP stands for Model Context Protocol. It is an open JSON-RPC protocol that standardizes how AI systems discover and interact with remote servers providing prompts, resources, and tool capabilities. In Tambo AI, MCP servers act as back-end services that extend your application's AI capabilities without requiring custom API integrations.

How do I configure multiple MCP servers in a Tambo AI application?

You configure multiple MCP servers by passing an array to the mcpServers prop on TamboProvider. Each server can specify a url, optional serverKey, transport type (MCPTransport.HTTP or MCPTransport.SSE), and customHeaders. The SDK automatically normalizes these configurations and deduplicates any servers pointing to the same endpoint, assigning unique keys like linear-2 or linear-3 when necessary.

What is the difference between SSE and HTTP transport for MCP servers?

HTTP transport (MCPTransport.HTTP) uses standard request-response JSON-RPC over HTTP, suitable for simple stateless operations. SSE transport (MCPTransport.SSE) uses Server-Sent Events, enabling streaming real-time updates and long-running connections from the server to the client. You specify the transport in your McpServerInfo configuration, and the SDK handles the underlying connection management appropriately.

How does Tambo AI handle naming conflicts between MCP servers?

Tambo AI prevents naming conflicts through a two-step process defined in react-sdk/src/util/mcp-server-utils.ts. First, normalization derives a serverKey from the URL hostname if not explicitly provided (e.g., linear from https://mcp.linear.app/mcp). Second, deduplication detects servers with identical URL/transport/header combinations and auto-suffixes duplicate keys with incremental numbers (linear-2, linear-3), ensuring each server maintains a unique identifier for prefixed resource naming.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}