Implement improved auto-reconnect logic and fix TypeScript errors

## Features
- Add proactive health check monitoring for MCP connections (30s intervals)
- Implement automatic reconnection on health check failures
- Add proper cleanup of health check intervals on disconnect

## Fixes
- Resolve OAuth type compatibility issues with MCP SDK
- Fix naming collision between InferenceProvider class and React component
- Remove unused React imports across all components (new JSX transform)
- Clean up unused type imports and variables
- Remove unused handleOAuthAuthentication function

## Technical Details
- Health checks use lightweight listTools() calls to verify connection state
- Automatic reconnection triggers when health checks fail
- Maintains existing exponential backoff retry logic
- All TypeScript compilation errors resolved

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

src/components/ChatInterface.tsx

@@ -1,6 +1,6 @@
 // Main chat interface with message display and input
 
-import React, { useState, useRef, useEffect } from 'react';
+import { useState, useRef, useEffect } from 'react';
 import { useConversation } from '@/contexts/ConversationContext';
 import { useInference } from '@/contexts/InferenceContext';
 import { MessageList } from './MessageList';
@@ -16,7 +16,7 @@ export function ChatInterface() {
     getAgentLoopState,
   } = useConversation();
   
-  const { provider: currentProvider, isAuthenticated } = useInference();
+  const { provider: currentProvider } = useInference();
   const [isLoading, setIsLoading] = useState(false);
   const messagesEndRef = useRef<HTMLDivElement>(null);
 

src/components/ConversationApp.tsx

@@ -1,6 +1,6 @@
 // Main conversation application with sidebar and chat interface
 
-import React, { useState } from 'react';
+import { useState } from 'react';
 import { ConversationProvider } from '@/contexts/ConversationContext';
 import { ConversationSidebar } from './ConversationSidebar';
 import { ChatInterface } from './ChatInterface';

src/components/ConversationSidebar.tsx

@@ -1,6 +1,5 @@
 // Conversation sidebar with conversation list and management
 
-import React from 'react';
 import { useConversation } from '@/contexts/ConversationContext';
 
 export function ConversationSidebar() {
@@ -91,10 +90,11 @@ export function ConversationSidebar() {
                     </p>
                     {conversation.messages.length > 0 && (
                       <p className="text-xs text-gray-600 dark:text-gray-300 mt-1 truncate">
-                        {conversation.messages[conversation.messages.length - 1]?.content?.[0]?.type === 'text' 
-                          ? conversation.messages[conversation.messages.length - 1].content[0].text
-                          : 'Tool interaction'
-                        }
+                        {(() => {
+                          const lastMessage = conversation.messages[conversation.messages.length - 1];
+                          const firstBlock = lastMessage?.content?.[0];
+                          return firstBlock?.type === 'text' ? firstBlock.text : 'Tool interaction';
+                        })()}
                       </p>
                     )}
                   </div>

src/components/InferenceLogin.tsx

@@ -1,6 +1,6 @@
 // Inference provider login component for inline authentication
 
-import React, { useState, useMemo } from 'react';
+import { useState, useMemo } from 'react';
 import { useInference } from '@/contexts/InferenceContext';
 import { OpenRouterApiProvider } from '@/providers/openrouter/api-provider';
 import { OpenRouterOAuthProvider } from '@/providers/openrouter/oauth-provider';

src/components/InferenceTest.tsx

@@ -1,6 +1,6 @@
 // Test UI for inference provider functionality
 
-import React, { useState, useCallback } from 'react';
+import { useState, useCallback } from 'react';
 import { useInference } from '@/contexts/InferenceContext';
 import { OpenRouterApiProvider, OpenRouterOAuthProvider } from '@/providers/openrouter';
 import type { ChatMessage, InferenceRequest } from '@/types/inference';

src/components/MCPStatus.tsx

@@ -1,6 +1,5 @@
 // MCP status display for the conversation sidebar
 
-import React from 'react';
 import { useMCP } from '@/contexts/MCPContext';
 
 export function MCPStatus() {

src/components/MCPTest.tsx

@@ -1,6 +1,6 @@
 // Test UI for MCP provider functionality
 
-import React, { useState, useCallback } from 'react';
+import { useState, useCallback } from 'react';
 import { useMCP } from '@/contexts/MCPContext';
 import type { MCPServerConfig } from '@/types/mcp';
 

src/components/MessageList.tsx

@@ -1,7 +1,6 @@
 // Message list component to display conversation messages with tool calls
 
-import React from 'react';
-import type { ConversationMessage, ToolUseBlock, ToolResultBlock } from '@/types/conversation';
+import type { ConversationMessage } from '@/types/conversation';
 
 interface MessageListProps {
   messages: ConversationMessage[];

src/components/OAuthCallback.tsx

@@ -1,6 +1,6 @@
 // OAuth callback handler for popup-based OAuth flows
 
-import React, { useEffect } from 'react';
+import { useEffect } from 'react';
 
 interface OAuthCallbackProps {
   type: 'inference' | 'mcp';