feat: Show initialize request/response in History panel (modelcontextprotocol#269)

- Add logging for initialize request and response in useConnection.connect
- Include server capabilities, version, and instructions in history

Author: leoshimo

client/src/lib/hooks/__tests__/useConnection.test.tsx

@@ -17,6 +17,8 @@ const mockClient = {
   connect: jest.fn().mockResolvedValue(undefined),
   close: jest.fn(),
   getServerCapabilities: jest.fn(),
+  getServerVersion: jest.fn(),
+  getInstructions: jest.fn(),
   setNotificationHandler: jest.fn(),
   setRequestHandler: jest.fn(),
 };

client/src/lib/hooks/useConnection.ts

@@ -335,8 +335,19 @@ export function useConnection({
         );
       }
 
+      let capabilities;
       try {
         await client.connect(clientTransport);
+
+        capabilities = client.getServerCapabilities();
+        const initializeRequest = {
+          method: "initialize",
+        };
+        pushHistory(initializeRequest, {
+          capabilities,
+          serverInfo: client.getServerVersion(),
+          instructions: client.getInstructions(),
+        });
       } catch (error) {
         console.error(
           `Failed to connect to MCP Server via the MCP Inspector Proxy: ${mcpProxyServerUrl}:`,
@@ -353,8 +364,6 @@ export function useConnection({
         }
         throw error;
       }
-
-      const capabilities = client.getServerCapabilities();
       setServerCapabilities(capabilities ?? null);
       setCompletionsSupported(true); // Reset completions support on new connection