nitrostack 1.0.15 → 1.0.17

package/src/studio/app/api/chat/route.ts

@@ -18,7 +18,10 @@ export async function POST(request: NextRequest) {
       provider, 
       messagesCount: messages?.length,
       messages: JSON.stringify(messages),
-      hasApiKey: !!apiKey 
+      hasApiKey: !!apiKey,
+      hasJwtToken: !!jwtToken,
+      hasMcpApiKey: !!mcpApiKey,
+      jwtTokenPreview: jwtToken ? jwtToken.substring(0, 20) + '...' : null
     });
 
     if (!provider || !messages || !apiKey) {
@@ -38,11 +41,79 @@ export async function POST(request: NextRequest) {
     // Get available tools from MCP server
     const client = getMcpClient();
     const toolsList = await client.listTools();
-    const tools = toolsList.tools?.map((tool: any) => ({
+    const mcpTools = toolsList.tools?.map((tool: any) => ({
       name: tool.name,
       description: tool.description || '',
       inputSchema: tool.inputSchema || {},
     })) || [];
+    
+    // Add synthetic tools for prompts and resources
+    const promptsList = await client.listPrompts().catch(() => ({ prompts: [] }));
+    const resourcesList = await client.listResources().catch(() => ({ resources: [] }));
+    
+    const syntheticTools = [];
+    
+    // Add a tool to list available prompts
+    if (promptsList.prompts && promptsList.prompts.length > 0) {
+      syntheticTools.push({
+        name: 'list_prompts',
+        description: 'List all available MCP prompts with their names, descriptions, and required arguments. Call this when user asks what prompts are available. After calling this, present the complete list of prompts to the user.',
+        inputSchema: {
+          type: 'object',
+          properties: {},
+        },
+      });
+      
+      // Add a tool to execute prompts
+      syntheticTools.push({
+        name: 'execute_prompt',
+        description: 'Execute an MCP prompt with given arguments. Returns the prompt result. After calling this, display the result to the user.',
+        inputSchema: {
+          type: 'object',
+          properties: {
+            name: {
+              type: 'string',
+              description: 'The name of the prompt to execute',
+            },
+            arguments: {
+              type: 'object',
+              description: 'Arguments to pass to the prompt (key-value pairs)',
+            },
+          },
+          required: ['name'],
+        },
+      });
+    }
+    
+    // Add a tool to list available resources
+    if (resourcesList.resources && resourcesList.resources.length > 0) {
+      syntheticTools.push({
+        name: 'list_resources',
+        description: 'List all available MCP resources with their URIs, names, descriptions, and mime types. Call this when user asks to see what resources are available. After calling this, present the complete list of resources to the user.',
+        inputSchema: {
+          type: 'object',
+          properties: {},
+        },
+      });
+      
+      // Add a tool to read resources
+      syntheticTools.push({
+        name: 'read_resource',
+        description: 'Read the contents of an MCP resource by its URI. Returns the full resource content. After calling this, display the resource content to the user.',
+        inputSchema: {
+          type: 'object',
+          properties: {
+            uri: {
+              type: 'string',
+              description: 'The URI of the resource to read (e.g., "widget://examples", "config://settings")',
+            },
+          },
+          required: ['uri'],
+        },
+      });
+    }
+    
+    const tools = [...mcpTools, ...syntheticTools];
 
     // Call LLM
     const response = await llmService.chat(provider, messages, tools, apiKey);
@@ -53,35 +124,89 @@ export async function POST(request: NextRequest) {
 
       for (const toolCall of response.toolCalls) {
         try {
-          // Inject auth tokens into tool arguments if available
-          const toolArgs = { ...toolCall.arguments };
-          if (jwtToken || mcpApiKey) {
-            toolArgs._meta = {
-              ...(toolArgs._meta || {}),
-            };
-            
-            if (jwtToken) {
-              toolArgs._meta._jwt = jwtToken;
-              toolArgs._meta.authorization = `Bearer ${jwtToken}`;
+          let result: any;
+          let toolContent = '';
+          
+          // Handle synthetic tools
+          if (toolCall.name === 'list_prompts') {
+            const prompts = await client.listPrompts();
+            const formattedPrompts = prompts.prompts?.map((p: any) => ({
+              name: p.name,
+              description: p.description,
+              arguments: p.arguments,
+            })) || [];
+            toolContent = JSON.stringify(formattedPrompts, null, 2);
+            console.log('📝 list_prompts result:', toolContent);
+          } else if (toolCall.name === 'execute_prompt') {
+            const promptResult = await client.getPrompt(
+              toolCall.arguments.name,
+              toolCall.arguments.arguments || {}
+            );
+            toolContent = JSON.stringify(promptResult.messages || promptResult, null, 2);
+            console.log('▶️ execute_prompt result:', toolContent.substring(0, 200) + '...');
+          } else if (toolCall.name === 'list_resources') {
+            const resources = await client.listResources();
+            const formattedResources = resources.resources?.map((r: any) => ({
+              uri: r.uri,
+              name: r.name,
+              description: r.description,
+              mimeType: r.mimeType,
+            })) || [];
+            toolContent = JSON.stringify(formattedResources, null, 2);
+            console.log('📋 list_resources result:', toolContent);
+          } else if (toolCall.name === 'read_resource') {
+            const resource = await client.readResource(toolCall.arguments.uri);
+            // Extract the actual content from the resource
+            let resourceContent = resource;
+            if (resource.contents && Array.isArray(resource.contents)) {
+              // If it's an array of contents, extract text from each
+              resourceContent = resource.contents.map((c: any) => {
+                if (c.text) return c.text;
+                if (c.blob) return `[Binary data: ${c.mimeType || 'unknown type'}]`;
+                return JSON.stringify(c);
+              }).join('\n\n');
             }
-            
-            if (mcpApiKey) {
-              toolArgs._meta.apiKey = mcpApiKey;
-              toolArgs._meta['x-api-key'] = mcpApiKey;
+            toolContent = typeof resourceContent === 'string' ? resourceContent : JSON.stringify(resourceContent, null, 2);
+            console.log('📖 read_resource result:', toolContent.substring(0, 200) + '...');
+          } else {
+            // Regular MCP tool execution
+            // Inject auth tokens into tool arguments if available
+            const toolArgs = { ...toolCall.arguments };
+            if (jwtToken || mcpApiKey) {
+              toolArgs._meta = {
+                ...(toolArgs._meta || {}),
+              };
+              
+              if (jwtToken) {
+                toolArgs._meta._jwt = jwtToken;
+                toolArgs._meta.authorization = `Bearer ${jwtToken}`;
+              }
+              
+              if (mcpApiKey) {
+                toolArgs._meta.apiKey = mcpApiKey;
+                toolArgs._meta['x-api-key'] = mcpApiKey;
+              }
+              
+              console.log(`🔐 Executing tool "${toolCall.name}" with auth:`, {
+                hasJwt: !!jwtToken,
+                hasMcpApiKey: !!mcpApiKey,
+                metaKeys: Object.keys(toolArgs._meta)
+              });
+            } else {
+              console.log(`⚠️ Executing tool "${toolCall.name}" WITHOUT auth tokens`);
             }
-          }
 
-          // Execute tool via MCP client
-          const result = await client.executeTool(toolCall.name, toolArgs);
+            // Execute tool via MCP client
+            result = await client.executeTool(toolCall.name, toolArgs);
 
-          // Extract content from MCP result
-          let toolContent = '';
-          if (result.content && Array.isArray(result.content)) {
-            toolContent = result.content
-              .map((c: any) => c.text || JSON.stringify(c))
-              .join('\n');
-          } else {
-            toolContent = JSON.stringify(result);
+            // Extract content from MCP result
+            if (result.content && Array.isArray(result.content)) {
+              toolContent = result.content
+                .map((c: any) => c.text || JSON.stringify(c))
+                .join('\n');
+            } else {
+              toolContent = JSON.stringify(result);
+            }
           }
 
           // Store tool result with both ID and NAME (Gemini needs the name!)
@@ -92,9 +217,11 @@ export async function POST(request: NextRequest) {
             toolName: toolCall.name, // Add tool name for Gemini function responses
           });
         } catch (error: any) {
+          console.error(`❌ Error executing tool "${toolCall.name}":`, error);
+          const errorMessage = `Error executing ${toolCall.name}: ${error.message}`;
           toolResults.push({
             role: 'tool',
-            content: JSON.stringify({ error: error.message }),
+            content: JSON.stringify({ error: error.message, message: errorMessage }),
             toolCallId: toolCall.id,
             toolName: toolCall.name, // Add tool name for Gemini function responses
           });

package/src/studio/app/api/init/route.ts

@@ -24,11 +24,33 @@ function loadEnvFile(projectPath: string): Record<string, string> {
   return envVars;
 }
 
-export async function POST() {
+export async function POST(request: Request) {
   try {
     const client = getMcpClient();
 
-    // Get MCP server config from environment
+    // Parse request body to get transport configuration
+    const body = await request.json().catch(() => ({}));
+    const transportType = body.transport || 'stdio'; // Default to stdio for backward compatibility
+
+    if (!client.isConnected()) {
+      if (transportType === 'http') {
+        // HTTP Transport Configuration
+        const baseUrl = body.baseUrl || process.env.MCP_HTTP_URL || 'http://localhost:3000';
+        const basePath = body.basePath || '/mcp';
+        const headers = body.headers || {};
+
+        console.log(`🌐 Connecting via HTTP transport to ${baseUrl}${basePath}`);
+
+        await client.connect({
+          type: 'http',
+          baseUrl,
+          basePath,
+          headers,
+        });
+
+        console.log('✅ MCP client connected successfully via HTTP');
+      } else {
+        // STDIO Transport Configuration (default)
     const command = process.env.MCP_COMMAND || 'node';
     const argsString = process.env.MCP_ARGS || '';
     
@@ -44,7 +66,6 @@ export async function POST() {
       }
     }
 
-    if (!client.isConnected()) {
       // Get project directory from the MCP server path
       // If using wrapper, the actual server path is the second argument
       const serverPath = args.length > 1 ? args[1] : args[0];
@@ -59,6 +80,7 @@ export async function POST() {
       console.log(`📝 Command: ${command} ${args.join(' ')}`);
       
       await client.connect({
+          type: 'stdio',
         command,
         args,
         env: {
@@ -68,12 +90,14 @@ export async function POST() {
         cwd: projectPath, // Set working directory to project root
       });
       
-      console.log('✅ MCP client connected successfully');
+        console.log('✅ MCP client connected successfully via STDIO');
+      }
     }
 
     return NextResponse.json({
       success: true,
       message: 'MCP client connected',
+      transport: client.getTransportType(),
     });
   } catch (error: any) {
     console.error('Failed to connect MCP client:', error);

package/src/studio/app/auth/page.tsx

@@ -166,21 +166,23 @@ export default function AuthPage() {
   };
 
   return (
-    <div className="min-h-screen bg-background p-8">
-      {/* Header */}
-      <div className="mb-8">
-        <div className="flex items-center gap-3 mb-4">
-          <div className="w-12 h-12 rounded-lg bg-gradient-to-br from-violet-500 to-purple-500 flex items-center justify-center">
-            <Shield className="w-6 h-6 text-white" />
+    <div className="fixed inset-0 flex flex-col bg-background" style={{ left: 'var(--sidebar-width, 15rem)' }}>
+      {/* Sticky Header */}
+      <div className="sticky top-0 z-10 border-b border-border/50 px-6 py-3 flex items-center justify-between bg-card/80 backdrop-blur-md shadow-sm">
+        <div className="flex items-center gap-3">
+          <div className="w-8 h-8 rounded-lg bg-gradient-to-br from-violet-500 to-purple-500 flex items-center justify-center shadow-md">
+            <Shield className="w-5 h-5 text-white" strokeWidth={2.5} />
           </div>
           <div>
-            <h1 className="text-3xl font-bold text-foreground">Authentication</h1>
-            <p className="text-muted-foreground mt-1">OAuth 2.1 / JWT / API Key authentication</p>
+            <h1 className="text-lg font-bold text-foreground">OAuth 2.1</h1>
           </div>
         </div>
       </div>
 
-      <div className="max-w-4xl mx-auto space-y-6">
+      {/* Content - ONLY this scrolls */}
+      <div className="flex-1 overflow-y-auto overflow-x-hidden">
+        <div className="max-w-4xl mx-auto px-6 py-6">
+        <div className="space-y-6">
         {/* JWT Token Management */}
         <div className="card card-hover p-6">
           <h2 className="text-xl font-semibold text-foreground mb-4 flex items-center gap-2">
@@ -537,6 +539,8 @@ export default function AuthPage() {
             </div>
           </div>
         </div>
+        </div>
+        </div>
       </div>
     </div>
   );