diff --git a/client/src/App.tsx b/client/src/App.tsx index deba38d..8f1cbfa 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -7,6 +7,7 @@ import { ReadResourceResultSchema, CallToolResultSchema, ListPromptsResultSchema, + Resource, Tool, ClientRequest, } from "mcp-typescript/types.js"; @@ -34,7 +35,7 @@ import { import ConsoleTab from "./components/ConsoleTab"; import Sidebar from "./components/Sidebar"; import RequestsTab from "./components/RequestsTabs"; -import ResourcesTab, { Resource } from "./components/ResourcesTab"; +import ResourcesTab from "./components/ResourcesTab"; import NotificationsTab from "./components/NotificationsTab"; import PromptsTab, { Prompt } from "./components/PromptsTab"; import ToolsTab from "./components/ToolsTab"; @@ -108,7 +109,7 @@ const App = () => { } }; - const readResource = async (uri: string) => { + const readResource = async (uri: URL) => { const response = await makeRequest( { method: "resources/read" as const, @@ -168,7 +169,6 @@ const App = () => { version: "0.0.1", }); - const clientTransport = new SSEClientTransport(); const backendUrl = new URL("http://localhost:3000/sse"); backendUrl.searchParams.append("transportType", transportType); @@ -179,7 +179,7 @@ const App = () => { backendUrl.searchParams.append("url", url); } - await clientTransport.connect(backendUrl); + const clientTransport = new SSEClientTransport(backendUrl); await client.connect(clientTransport); setMcpClient(client); diff --git a/client/src/components/ResourcesTab.tsx b/client/src/components/ResourcesTab.tsx index 0fca352..e16dd1f 100644 --- a/client/src/components/ResourcesTab.tsx +++ b/client/src/components/ResourcesTab.tsx @@ -2,6 +2,7 @@ import { FileText, ChevronRight, AlertCircle, RefreshCw } from "lucide-react"; import { Button } from "@/components/ui/button"; import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert"; import { TabsContent } from "@/components/ui/tabs"; +import { Resource } from "mcp-typescript/types.js"; import ListPane from "./ListPane"; export type Resource = { @@ -20,7 +21,7 @@ const ResourcesTab = ({ }: { resources: Resource[]; listResources: () => void; - readResource: (uri: string) => void; + readResource: (uri: URL) => void; selectedResource: Resource | null; setSelectedResource: (resource: Resource) => void; resourceContent: string; diff --git a/server/src/index.ts b/server/src/index.ts index 55061a6..a04aaeb 100644 --- a/server/src/index.ts +++ b/server/src/index.ts @@ -25,15 +25,15 @@ const createTransport = async (query: express.Request["query"]) => { const command = query.command as string; const args = (query.args as string).split(","); console.log(`Stdio transport: command=${command}, args=${args}`); - const transport = new StdioClientTransport(); - await transport.spawn({ command, args }); + const transport = new StdioClientTransport({ command, args }); + await transport.start(); console.log("Spawned stdio transport"); return transport; } else if (transportType === "sse") { const url = query.url as string; console.log(`SSE transport: url=${url}`); - const transport = new SSEClientTransport(); - await transport.connect(new URL(url)); + const transport = new SSEClientTransport(new URL(url)); + await transport.start(); console.log("Connected to SSE transport"); return transport; } else { @@ -49,13 +49,13 @@ app.get("/sse", async (req, res) => { console.log("Connected MCP client to backing server transport"); - const webAppTransport = new SSEServerTransport("/message"); + const webAppTransport = new SSEServerTransport("/message", res); console.log("Created web app transport"); webAppTransports.push(webAppTransport); console.log("Created web app transport"); - await webAppTransport.connectSSE(req, res); + await webAppTransport.start(); mcpProxy({ transportToClient: webAppTransport,