mcp-inflight 0.2.3 → 0.3.0

package/README.md

@@ -49,7 +49,39 @@ The MCP server provides these tools:
 
 ## Supported Projects
 
-Next.js, Vite, Create React App, Node.js, and static HTML.
+- **Next.js** (App Router and Pages Router)
+- **Vite** (React, Vue, Svelte, etc.)
+- **Create React App**
+- **Node.js**
+- **Static HTML**
+
+## Features
+
+### Binary File Support
+
+The MCP server automatically handles binary files including:
+
+- **Images**: PNG, JPG, JPEG, GIF, WebP, ICO, SVG, BMP, TIFF, AVIF
+- **Fonts**: WOFF, WOFF2, TTF, EOT, OTF
+- **Media**: MP3, MP4, WebM, OGG, WAV
+- **Other**: PDF, ZIP
+
+Binary files are base64 encoded during upload and properly decoded in the sandbox, ensuring your `/public` folder assets work correctly.
+
+### Monorepo Support
+
+Automatically detects and bundles workspace dependencies for monorepo projects using pnpm, npm, or yarn workspaces.
+
+### Automatic Patching
+
+The server automatically patches configuration files for CodeSandbox compatibility:
+
+- **Vite**: Adds `allowedHosts` for CodeSandbox domains
+- **Next.js**: Configures CSP headers to allow iframe embedding
+
+### Large Project Support
+
+Projects over 3MB are automatically chunked into smaller uploads to handle Vercel's serverless function body size limits.
 
 ## Slash Commands (Optional)
 
@@ -80,6 +112,31 @@ cp packages/mcp-inflight/commands/*.md ~/.claude/commands/
 | `/share` | Share a project to InFlight (shortcut for the share tool) |
 | `/inflight` | Menu for managing prototypes: list, sync, delete, login, logout |
 
+## Troubleshooting
+
+### Server Startup Timeout
+
+If you see "Timeout: Waiting for server to start took longer than 120s", this usually means:
+
+1. The project is large and takes a while to start
+2. There's an error in the dev server startup
+
+The deployment logs will show the exact command being used. Try running it locally to verify it works.
+
+### Missing Images or Assets
+
+If images from your `/public` folder aren't loading, ensure:
+
+1. The file extension is in the supported binary file list
+2. The file path is correct (paths are relative to project root)
+
+### Authentication Issues
+
+If you're getting authentication errors:
+
+1. Run the `login` tool to re-authenticate
+2. Check that your InFlight account is active
+
 ## License
 
 MIT

package/dist/index.js

@@ -496,6 +496,52 @@ function detectProjectType(projectPath) {
 // src/utils/file-utils.ts
 import * as fs2 from "fs";
 import * as path2 from "path";
+var BINARY_EXTENSIONS = [
+  // Images
+  ".png",
+  ".jpg",
+  ".jpeg",
+  ".gif",
+  ".webp",
+  ".ico",
+  ".svg",
+  ".bmp",
+  ".tiff",
+  ".avif",
+  // Fonts
+  ".woff",
+  ".woff2",
+  ".ttf",
+  ".eot",
+  ".otf",
+  // Other binary
+  ".pdf",
+  ".zip",
+  ".mp3",
+  ".mp4",
+  ".webm",
+  ".ogg",
+  ".wav"
+];
+function isBinaryFile(filename) {
+  const ext = path2.extname(filename).toLowerCase();
+  return BINARY_EXTENSIONS.includes(ext);
+}
+function getFileContent(file) {
+  return typeof file === "string" ? file : file.content;
+}
+function getFileSize(file) {
+  return getFileContent(file).length;
+}
+function getTextContent(file) {
+  if (typeof file === "string") {
+    return file;
+  }
+  if (file.encoding === "utf-8") {
+    return file.content;
+  }
+  return void 0;
+}
 var ALWAYS_IGNORE = [
   "node_modules",
   ".git",
@@ -536,8 +582,15 @@ function readProjectFiles(projectPath, relativePath = "", includeEnvFiles = fals
     } else if (entry.isFile()) {
       const filePath = path2.join(projectPath, entryRelativePath);
       try {
-        const content = fs2.readFileSync(filePath, "utf-8");
-        files[entryRelativePath] = content;
+        if (isBinaryFile(entry.name)) {
+          const buffer = fs2.readFileSync(filePath);
+          const content = buffer.toString("base64");
+          console.log(`[MCP] Read binary file: ${entryRelativePath}, original size=${buffer.length}, base64 length=${content.length}`);
+          files[entryRelativePath] = { content, encoding: "base64" };
+        } else {
+          const content = fs2.readFileSync(filePath, "utf-8");
+          files[entryRelativePath] = content;
+        }
       } catch {
       }
     }
@@ -547,7 +600,7 @@ function readProjectFiles(projectPath, relativePath = "", includeEnvFiles = fals
 var MAX_CHUNK_SIZE = 2 * 1024 * 1024;
 var CHUNK_THRESHOLD = 3 * 1024 * 1024;
 function calculateTotalSize(files) {
-  return Object.values(files).reduce((sum, content) => sum + content.length, 0);
+  return Object.values(files).reduce((sum, file) => sum + getFileSize(file), 0);
 }
 function needsChunkedUpload(files) {
   return calculateTotalSize(files) > CHUNK_THRESHOLD;
@@ -556,16 +609,16 @@ function chunkFiles(files, maxChunkSize = MAX_CHUNK_SIZE) {
   const chunks = [];
   let currentChunk = {};
   let currentSize = 0;
-  const entries = Object.entries(files).sort((a, b) => a[1].length - b[1].length);
-  for (const [filePath, content] of entries) {
-    const fileSize = content.length;
+  const entries = Object.entries(files).sort((a, b) => getFileSize(a[1]) - getFileSize(b[1]));
+  for (const [filePath, file] of entries) {
+    const fileSize = getFileSize(file);
     if (fileSize > maxChunkSize) {
       if (Object.keys(currentChunk).length > 0) {
         chunks.push(currentChunk);
         currentChunk = {};
         currentSize = 0;
       }
-      chunks.push({ [filePath]: content });
+      chunks.push({ [filePath]: file });
       continue;
     }
     if (currentSize + fileSize > maxChunkSize && Object.keys(currentChunk).length > 0) {
@@ -573,7 +626,7 @@ function chunkFiles(files, maxChunkSize = MAX_CHUNK_SIZE) {
       currentChunk = {};
       currentSize = 0;
     }
-    currentChunk[filePath] = content;
+    currentChunk[filePath] = file;
     currentSize += fileSize;
   }
   if (Object.keys(currentChunk).length > 0) {
@@ -933,7 +986,8 @@ async function deployProject(files, options, log) {
       vmTier: options.vmTier || "Micro",
       projectName: options.projectName,
       workspaceId: options.workspaceId || auth.defaultWorkspaceId,
-      gitInfo: options.gitInfo
+      gitInfo: options.gitInfo,
+      diffSummary: options.diffSummary
     })
   });
   if (!response.ok && !response.headers.get("content-type")?.includes("text/event-stream")) {
@@ -1125,7 +1179,7 @@ async function uploadChunk(sandboxId, files, chunkIndex, totalChunks, log) {
     throw new NotAuthenticatedError();
   }
   const fileCount = Object.keys(files).length;
-  const chunkSize = Object.values(files).reduce((sum, content) => sum + content.length, 0);
+  const chunkSize = calculateTotalSize(files);
   await log(`Uploading chunk ${chunkIndex + 1}/${totalChunks} (${fileCount} files, ${(chunkSize / 1024).toFixed(1)} KB)...`);
   const response = await fetch(`${INFLIGHT_API}/api/mcp/sandbox/${sandboxId}/upload`, {
     method: "POST",
@@ -1174,7 +1228,8 @@ async function finalizeSandbox(sandboxId, options, log) {
       port: options.port,
       projectName: options.projectName,
       workspaceId: options.workspaceId,
-      gitInfo: options.gitInfo
+      gitInfo: options.gitInfo,
+      diffSummary: options.diffSummary
     })
   });
   if (!response.ok && !response.headers.get("content-type")?.includes("text/event-stream")) {
@@ -1231,7 +1286,8 @@ async function deployProjectChunked(fileChunks, options, log) {
       port: options.port,
       projectName: options.projectName,
       workspaceId,
-      gitInfo: options.gitInfo
+      gitInfo: options.gitInfo,
+      diffSummary: options.diffSummary
     },
     log
   );
@@ -1384,8 +1440,30 @@ function checkMiddleware(content, filePath) {
     configFile: filePath
   };
 }
+function configAllowsCodeSandbox(content) {
+  const literalRegex = /['"`](https?:\/\/[^\s'"`]+|[^'"`\s]+)['"`]/g;
+  let match;
+  while ((match = literalRegex.exec(content)) !== null) {
+    const literal = match[1];
+    let hostname = "";
+    try {
+      if (/^https?:\/\//i.test(literal)) {
+        const url = new URL(literal);
+        hostname = url.hostname.toLowerCase();
+      } else {
+        hostname = literal.toLowerCase();
+      }
+    } catch {
+      hostname = literal.toLowerCase();
+    }
+    if (hostname === "csb.app" || hostname === "codesandbox.io" || hostname.endsWith(".csb.app") || hostname.endsWith(".codesandbox.io")) {
+      return true;
+    }
+  }
+  return false;
+}
 function checkViteConfig(content, filePath) {
-  if (content.includes(".csb.app") || content.includes(".codesandbox.io")) {
+  if (configAllowsCodeSandbox(content)) {
     return { canEmbed: true, issues: [], configFile: filePath };
   }
   const issues = [];
@@ -1579,7 +1657,11 @@ function patchFilesForEmbed(files) {
   const patchedFiles = [];
   const remainingIssues = [];
   const result = { ...files };
-  for (const [filePath, content] of Object.entries(files)) {
+  for (const [filePath, file] of Object.entries(files)) {
+    const content = getTextContent(file);
+    if (content === void 0) {
+      continue;
+    }
     const fileName = filePath.split("/").pop() || "";
     let patched = null;
     if (isMiddlewareFile(filePath)) {
@@ -1641,7 +1723,11 @@ function patchFilesForEmbed(files) {
 }
 function checkEmbedCompatibility(files) {
   const allIssues = [];
-  for (const [filePath, content] of Object.entries(files)) {
+  for (const [filePath, file] of Object.entries(files)) {
+    const content = getTextContent(file);
+    if (content === void 0) {
+      continue;
+    }
     const fileName = filePath.split("/").pop() || "";
     if (fileName === "next.config.js" || fileName === "next.config.mjs" || fileName === "next.config.ts") {
       const result = checkNextConfig(content, filePath);
@@ -1843,6 +1929,9 @@ async function deployPrototype(args, log) {
     const dirtyMarker = gitInfo.isDirty ? " (modified)" : "";
     await log(`Git: ${gitInfo.branch}@${gitInfo.commitShort}${dirtyMarker}`);
   }
+  if (args.diffSummary) {
+    await log(`Diff summary provided: ${args.diffSummary.keyChanges.length} key changes`);
+  }
   if (!projectInfo.compatibility.canDeploy) {
     throw new Error(
       `Project cannot be deployed: ${projectInfo.compatibility.issues.join(", ")}`
@@ -1912,126 +2001,76 @@ async function deployPrototype(args, log) {
       }
     }
   }
-  const totalSize = Object.values(files).reduce((sum, content) => sum + content.length, 0);
+  const totalSize = calculateTotalSize(files);
   await log(`Found ${fileCount} files (${(totalSize / 1024 / 1024).toFixed(1)} MB)`);
-  let existingSandbox;
-  try {
-    const sandboxes = await listSandboxes();
-    const projectName = path5.basename(projectPath);
-    existingSandbox = sandboxes.find(
-      (s) => s.projectName === projectName && s.status === "running"
-    );
-  } catch {
-  }
   let result;
-  if (existingSandbox) {
-    await log(`Found existing sandbox: ${existingSandbox.sandboxId}`);
-    await log("Syncing files...");
-    try {
-      const syncResult = await syncProject(
-        existingSandbox.sandboxId,
-        files,
-        {
-          restartServer: true,
-          startCommand: projectInfo.startCommand,
-          port: projectInfo.port,
-          gitInfo: gitInfo || void 0
-        },
-        log
-      );
-      const inflightUrl = existingSandbox.inflightUrl || "";
-      const inflightVersionId = existingSandbox.inflightVersionId || "";
-      result = {
-        url: syncResult.sandboxUrl,
-        sandboxId: existingSandbox.sandboxId,
-        projectType: projectInfo.type,
-        synced: true,
-        inflightUrl,
-        inflightVersionId,
-        startCommand: projectInfo.startCommand,
-        port: projectInfo.port,
-        packageManager: projectInfo.detectedPackageManager,
-        isMonorepo: projectInfo.isMonorepo,
-        vmTier: projectInfo.sizing.recommendedTier,
-        embedCheck
-      };
-      const elapsed = ((Date.now() - startTime) / 1e3).toFixed(1);
-      await log(`Sync complete in ${elapsed}s`);
-    } catch (syncError) {
-      const errorMsg = syncError instanceof Error ? syncError.message : String(syncError);
-      await log(`Sync failed, creating new sandbox: ${errorMsg}`, "warning");
-      existingSandbox = void 0;
-    }
-  }
-  if (!existingSandbox) {
-    const useChunkedUpload = needsChunkedUpload(files);
-    if (useChunkedUpload) {
-      const totalSize2 = calculateTotalSize(files);
-      await log(`Large project detected (${(totalSize2 / 1024 / 1024).toFixed(1)} MB), using chunked upload...`);
-      const fileChunks = chunkFiles(files);
-      await log(`Split into ${fileChunks.length} chunks`);
-      const deployResult = await deployProjectChunked(
-        fileChunks,
-        {
-          projectType: projectInfo.type,
-          installCommand: projectInfo.installCommand || void 0,
-          startCommand: projectInfo.startCommand,
-          port: projectInfo.port,
-          vmTier: projectInfo.sizing.recommendedTier,
-          projectName: path5.basename(projectPath),
-          workspaceId: args.workspaceId,
-          gitInfo: gitInfo || void 0
-        },
-        log
-      );
-      result = {
-        url: deployResult.sandboxUrl,
-        sandboxId: deployResult.sandboxId,
+  const useChunkedUpload = needsChunkedUpload(files);
+  if (useChunkedUpload) {
+    const totalSize2 = calculateTotalSize(files);
+    await log(`Large project detected (${(totalSize2 / 1024 / 1024).toFixed(1)} MB), using chunked upload...`);
+    const fileChunks = chunkFiles(files);
+    await log(`Split into ${fileChunks.length} chunks`);
+    const deployResult = await deployProjectChunked(
+      fileChunks,
+      {
         projectType: projectInfo.type,
-        synced: false,
-        inflightUrl: deployResult.inflightUrl,
-        inflightVersionId: deployResult.versionId,
+        installCommand: projectInfo.installCommand || void 0,
         startCommand: projectInfo.startCommand,
         port: projectInfo.port,
-        packageManager: projectInfo.detectedPackageManager,
-        isMonorepo: projectInfo.isMonorepo,
         vmTier: projectInfo.sizing.recommendedTier,
-        embedCheck
-      };
-    } else {
-      await log("Deploying via InFlight API...");
-      const deployResult = await deployProject(
-        files,
-        {
-          projectType: projectInfo.type,
-          installCommand: projectInfo.installCommand || void 0,
-          startCommand: projectInfo.startCommand,
-          port: projectInfo.port,
-          vmTier: projectInfo.sizing.recommendedTier,
-          projectName: path5.basename(projectPath),
-          workspaceId: args.workspaceId,
-          gitInfo: gitInfo || void 0
-        },
-        log
-      );
-      result = {
-        url: deployResult.sandboxUrl,
-        sandboxId: deployResult.sandboxId,
+        projectName: path5.basename(projectPath),
+        workspaceId: args.workspaceId,
+        gitInfo: gitInfo || void 0,
+        diffSummary: args.diffSummary || void 0
+      },
+      log
+    );
+    result = {
+      url: deployResult.sandboxUrl,
+      sandboxId: deployResult.sandboxId,
+      projectType: projectInfo.type,
+      inflightUrl: deployResult.inflightUrl,
+      inflightVersionId: deployResult.versionId,
+      startCommand: projectInfo.startCommand,
+      port: projectInfo.port,
+      packageManager: projectInfo.detectedPackageManager,
+      isMonorepo: projectInfo.isMonorepo,
+      vmTier: projectInfo.sizing.recommendedTier,
+      embedCheck
+    };
+  } else {
+    await log("Deploying via InFlight API...");
+    const deployResult = await deployProject(
+      files,
+      {
         projectType: projectInfo.type,
-        synced: false,
-        inflightUrl: deployResult.inflightUrl,
-        inflightVersionId: deployResult.versionId,
+        installCommand: projectInfo.installCommand || void 0,
         startCommand: projectInfo.startCommand,
         port: projectInfo.port,
-        packageManager: projectInfo.detectedPackageManager,
-        isMonorepo: projectInfo.isMonorepo,
         vmTier: projectInfo.sizing.recommendedTier,
-        embedCheck
-      };
-    }
-    const elapsed = ((Date.now() - startTime) / 1e3).toFixed(1);
-    await log(`Deploy complete in ${elapsed}s`);
+        projectName: path5.basename(projectPath),
+        workspaceId: args.workspaceId,
+        gitInfo: gitInfo || void 0,
+        diffSummary: args.diffSummary || void 0
+      },
+      log
+    );
+    result = {
+      url: deployResult.sandboxUrl,
+      sandboxId: deployResult.sandboxId,
+      projectType: projectInfo.type,
+      inflightUrl: deployResult.inflightUrl,
+      inflightVersionId: deployResult.versionId,
+      startCommand: projectInfo.startCommand,
+      port: projectInfo.port,
+      packageManager: projectInfo.detectedPackageManager,
+      isMonorepo: projectInfo.isMonorepo,
+      vmTier: projectInfo.sizing.recommendedTier,
+      embedCheck
+    };
   }
+  const elapsed = ((Date.now() - startTime) / 1e3).toFixed(1);
+  await log(`Deploy complete in ${elapsed}s`);
   if (hadUncommittedChanges && result.inflightVersionId) {
     const newCommit = autoCommitForShare(projectPath, result.inflightVersionId);
     if (newCommit) {
@@ -2105,6 +2144,27 @@ function createServer2() {
               workspaceId: {
                 type: "string",
                 description: "InFlight workspace ID to create the version in. If not provided, uses the last-used workspace or the user's first workspace."
+              },
+              diffSummary: {
+                type: "object",
+                description: "Claude-generated summary of git changes for review question generation. Provide this when sharing a feature branch with commits.",
+                properties: {
+                  summary: {
+                    type: "string",
+                    description: "A 2-3 sentence product-focused summary of the changes. Focus on user-visible changes, not internal code details."
+                  },
+                  keyChanges: {
+                    type: "array",
+                    items: { type: "string" },
+                    description: "List of key user-visible changes (e.g., 'Added dark mode toggle', 'Redesigned checkout flow')"
+                  },
+                  affectedAreas: {
+                    type: "array",
+                    items: { type: "string" },
+                    description: "UI/feature areas affected by the changes (e.g., 'Settings page', 'Navigation', 'Forms')"
+                  }
+                },
+                required: ["summary", "keyChanges"]
               }
             },
             required: ["path"]
@@ -2179,7 +2239,7 @@ function createServer2() {
       if (name === "share") {
         const deployArgs = args;
         const result = await deployPrototype(deployArgs, log);
-        const message = result.synced ? `Files synced. InFlight: ${result.inflightUrl}` : `Project shared successfully. InFlight: ${result.inflightUrl}`;
+        const message = `Project shared successfully. InFlight: ${result.inflightUrl}`;
         return {
           content: [
             {
@@ -2198,7 +2258,6 @@ function createServer2() {
                   },
                   // Embed check results - shows if there are iframe embedding issues
                   embedCheck: result.embedCheck,
-                  synced: result.synced ?? false,
                   inflightUrl: result.inflightUrl,
                   inflightVersionId: result.inflightVersionId,
                   message

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mcp-inflight",
-  "version": "0.2.3",
+  "version": "0.3.0",
   "description": "MCP server for sharing prototypes via InFlight",
   "author": "InFlight <hello@inflight.co>",
   "homepage": "https://github.com/inflight/mcp-inflight",
@@ -13,11 +13,6 @@
   "bin": {
     "mcp-inflight": "dist/index.js"
   },
-  "scripts": {
-    "build": "tsup",
-    "dev": "tsup --watch",
-    "typecheck": "tsc --noEmit"
-  },
   "dependencies": {
     "@modelcontextprotocol/sdk": "^1.0.0"
   },
@@ -36,5 +31,10 @@
     "share",
     "deploy"
   ],
-  "license": "MIT"
-}
+  "license": "MIT",
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "typecheck": "tsc --noEmit"
+  }
+}