fix types, eliminate client/server

Author: ashwin-ant

client/src/App.tsx

@@ -7,6 +7,8 @@ import {
   ReadResourceResultSchema,
   CallToolResultSchema,
   ListPromptsResultSchema,
+  Tool,
+  ClientRequest,
 } from "mcp-typescript/types.js";
 import { useState } from "react";
 import {
@@ -28,8 +30,9 @@ import RequestsTab from "./components/RequestsTabs";
 import ResourcesTab, { Resource } from "./components/ResourcesTab";
 import NotificationsTab from "./components/NotificationsTab";
 import PromptsTab, { Prompt } from "./components/PromptsTab";
-import ToolsTab, { Tool as ToolType } from "./components/ToolsTab";
+import ToolsTab from "./components/ToolsTab";
 import History from "./components/History";
+import { AnyZodObject } from "node_modules/zod/lib";
 
 const App = () => {
   const [connectionStatus, setConnectionStatus] = useState<
@@ -39,7 +42,7 @@ const App = () => {
   const [resourceContent, setResourceContent] = useState<string>("");
   const [prompts, setPrompts] = useState<Prompt[]>([]);
   const [promptContent, setPromptContent] = useState<string>("");
-  const [tools, setTools] = useState<ToolType[]>([]);
+  const [tools, setTools] = useState<Tool[]>([]);
   const [toolResult, setToolResult] = useState<string>("");
   const [error, setError] = useState<string | null>(null);
   const [command, setCommand] = useState<string>(
@@ -57,7 +60,7 @@ const App = () => {
     null,
   );
   const [selectedPrompt, setSelectedPrompt] = useState<Prompt | null>(null);
-  const [selectedTool, setSelectedTool] = useState<ToolType | null>(null);
+  const [selectedTool, setSelectedTool] = useState<Tool | null>(null);
 
   const pushHistory = (request: object, response: object) => {
     setRequestHistory((prev) => [
@@ -66,10 +69,10 @@ const App = () => {
     ]);
   };
 
-  const makeRequest = async (
-    request: Parameters<Client["request"]>[0],
-    schema: Parameters<Client["request"]>[1],
-  ): Promise<ReturnType<Client["request"]>> => {
+  const makeRequest = async <T extends AnyZodObject>(
+    request: ClientRequest,
+    schema: T,
+  ) => {
     if (!mcpClient) {
       throw new Error("MCP client not connected");
     }
@@ -114,9 +117,7 @@ const App = () => {
       },
       ListPromptsResultSchema,
     );
-    if (response.prompts) {
-      setPrompts(response.prompts);
-    }
+    setPrompts(response.prompts);
   };
 
   const getPrompt = async (name: string, args: Record<string, string> = {}) => {
@@ -137,9 +138,7 @@ const App = () => {
       },
       ListToolsResultSchema,
     );
-    if (response.tools) {
-      setTools(response.tools);
-    }
+    setTools(response.tools);
   };
 
   const callTool = async (name: string, params: Record<string, unknown>) => {

client/src/components/ToolsTab.tsx

@@ -3,19 +3,11 @@ import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Send, AlertCircle } from "lucide-react";
 import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
+import { Tool } from "mcp-typescript/types.js";
 import { useState } from "react";
 import { Label } from "@/components/ui/label";
 import ListPane from "./ListPane";
 
-export type Tool = {
-  name: string;
-  description?: string | undefined;
-  inputSchema: {
-    type: string;
-    properties?: Record<string, { type: string; description: string }>;
-  };
-};
-
 const ToolsTab = ({
   tools,
   listTools,

server/src/index.ts

@@ -1,58 +1,40 @@
 import cors from "cors";
 
-import { Server } from "mcp-typescript/server/index.js";
 import { SSEServerTransport } from "mcp-typescript/server/sse.js";
 import express from "express";
-import { Client } from "mcp-typescript/client/index.js";
 import { StdioClientTransport } from "mcp-typescript/client/stdio.js";
 import mcpProxy from "./mcpProxy.js";
 
 const app = express();
 app.use(cors());
 
-let servers: Server[] = [];
+let transports: SSEServerTransport[] = [];
 
 app.get("/sse", async (req, res) => {
   console.log("New SSE connection");
   const command = decodeURIComponent(req.query.command as string);
   const args = decodeURIComponent(req.query.args as string).split(",");
-  const mcpClient = new Client({ name: "MyApp", version: "1.0.0" });
   const backingServerTransport = new StdioClientTransport();
   await backingServerTransport.spawn({ command, args });
-  await mcpClient.connect(backingServerTransport);
 
   const webAppTransport = new SSEServerTransport("/message");
-  const server = new Server({
-    name: "mcp-server-inspector",
-    version: "0.0.1",
-  });
-  servers.push(server);
-
-  server.onclose = async () => {
-    console.log("SSE connection closed");
-    servers = servers.filter((s) => s !== server);
-    await mcpClient.close();
-  };
+  transports.push(webAppTransport);
 
   await webAppTransport.connectSSE(req, res);
-  await server.connect(webAppTransport);
 
   mcpProxy({
     transportToClient: webAppTransport,
     transportToServer: backingServerTransport,
     onerror: (error) => {
       console.error(error);
-      server.close();
     },
   });
 });
 
 app.post("/message", async (req, res) => {
   console.log("Received message");
 
-  const transport = servers
-    .map((s) => s.transport as SSEServerTransport)
-    .find((t) => true);
+  const transport = transports.find((t) => true);
   if (!transport) {
     res.status(404).send("Session not found");
     return;