haitham/open-lovable
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Revert "Vercel sandbox support"

Browse Source
This commit is contained in:
Developers Digest
2025-09-02 18:27:04 -04:00
committed by GitHub
parent d7ae41ba9d
commit 8996e717df
22 changed files with 1662 additions and 1065 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env.example
+16 -16
View File
@@ -1,20 +1,20 @@
# Required
FIRECRAWL_API_KEY=your_firecrawl_api_key # Get from https://firecrawl.dev (Web scraping)
# REQUIRED - Sandboxes for code execution
# Get yours at https://e2b.dev
E2B_API_KEY=your_e2b_api_key_here
# Vercel Sandbox Authentication (choose one method)
# See: https://vercel.com/docs/vercel-sandbox#authentication
# REQUIRED - Web scraping for cloning websites
# Get yours at https://firecrawl.dev
FIRECRAWL_API_KEY=your_firecrawl_api_key_here
# Method 1: OIDC Token (recommended for development)
# Run `vercel link` then `vercel env pull` to get VERCEL_OIDC_TOKEN automatically
# VERCEL_OIDC_TOKEN=auto_generated_by_vercel_env_pull
# OPTIONAL - AI Providers (need at least one)
# Get yours at https://console.anthropic.com
ANTHROPIC_API_KEY=your_anthropic_api_key_here
# Method 2: Personal Access Token (for production or when OIDC unavailable)
# VERCEL_TEAM_ID=team_xxxxxxxxx # Your Vercel team ID
# VERCEL_PROJECT_ID=prj_xxxxxxxxx # Your Vercel project ID
# VERCEL_TOKEN=vercel_xxxxxxxxxxxx # Personal access token from Vercel dashboard
# Get yours at https://platform.openai.com
OPENAI_API_KEY=your_openai_api_key_here
# Optional (need at least one AI provider)
ANTHROPIC_API_KEY=your_anthropic_api_key # Get from https://console.anthropic.com
OPENAI_API_KEY=your_openai_api_key # Get from https://platform.openai.com (GPT-5)
GEMINI_API_KEY=your_gemini_api_key # Get from https://aistudio.google.com/app/apikey
GROQ_API_KEY=your_groq_api_key # Get from https://console.groq.com (Fast inference - Kimi K2 recommended)
# Get yours at https://aistudio.google.com/app/apikey
GEMINI_API_KEY=your_gemini_api_key_here
# Get yours at https://console.groq.com
GROQ_API_KEY=your_groq_api_key_here
.gitignore
-1
View File
@@ -56,4 +56,3 @@ e2b-template-*
*.temp
repomix-output.txt
bun.lockb
.env*.local
README.md
+1 -13
View File
@@ -16,23 +16,11 @@ npm install
```
2. **Add `.env.local`**
```env
# Required
E2B_API_KEY=your_e2b_api_key # Get from https://e2b.dev (Sandboxes)
FIRECRAWL_API_KEY=your_firecrawl_api_key # Get from https://firecrawl.dev (Web scraping)
# Vercel Sandbox Authentication (choose one method)
# See: https://vercel.com/docs/vercel-sandbox#authentication
# Method 1: OIDC Token (recommended for development)
# Run `vercel link` then `vercel env pull` to get VERCEL_OIDC_TOKEN automatically
# VERCEL_OIDC_TOKEN=auto_generated_by_vercel_env_pull
# Method 2: Personal Access Token (for production or when OIDC unavailable)
# VERCEL_TEAM_ID=team_xxxxxxxxx # Your Vercel team ID
# VERCEL_PROJECT_ID=prj_xxxxxxxxx # Your Vercel project ID
# VERCEL_TOKEN=vercel_xxxxxxxxxxxx # Personal access token from Vercel dashboard
# Optional (need at least one AI provider)
ANTHROPIC_API_KEY=your_anthropic_api_key # Get from https://console.anthropic.com
OPENAI_API_KEY=your_openai_api_key # Get from https://platform.openai.com (GPT-5)
app/api/apply-ai-code-stream/route.ts
+24 -35
View File
@@ -1,5 +1,5 @@
import { NextRequest, NextResponse } from 'next/server';
import { Sandbox } from '@vercel/sandbox';
import { Sandbox } from '@e2b/code-interpreter';
import type { SandboxState } from '@/types/sandbox';
import type { ConversationState } from '@/types/conversation';
@@ -525,6 +525,7 @@ export async function POST(request: NextRequest) {
normalizedPath = 'src/' + normalizedPath;
}
const fullPath = `/home/user/app/${normalizedPath}`;
const isUpdate = global.existingFiles.has(normalizedPath);
// Remove any CSS imports from JSX/JS files (we're using Tailwind)
@@ -533,20 +534,19 @@ export async function POST(request: NextRequest) {
fileContent = fileContent.replace(/import\s+['"]\.\/[^'"]+\.css['"];?\s*\n?/g, '');
}
// Create directory if needed
const dirPath = normalizedPath.includes('/') ? normalizedPath.substring(0, normalizedPath.lastIndexOf('/')) : '';
if (dirPath) {
await sandboxInstance.runCommand({
cmd: 'mkdir',
args: ['-p', dirPath]
});
}
// Write the file using Python (code-interpreter SDK)
const escapedContent = fileContent
.replace(/\\/g, '\\\\')
.replace(/"""/g, '\\"\\"\\"')
.replace(/\$/g, '\\$');
// Write the file using Vercel Sandbox writeFiles
await sandboxInstance.writeFiles([{
path: normalizedPath,
content: Buffer.from(fileContent)
}]);
await sandboxInstance.runCode(`
import os
os.makedirs(os.path.dirname("${fullPath}"), exist_ok=True)
with open("${fullPath}", 'w') as f:
f.write("""${escapedContent}""")
print(f"File written: ${fullPath}")
`);
// Update file cache
if (global.sandboxState?.fileCache) {
@@ -599,38 +599,27 @@ export async function POST(request: NextRequest) {
action: 'executing'
});
// Parse command and arguments for Vercel Sandbox
const commandParts = cmd.trim().split(/\s+/);
const cmdName = commandParts[0];
const args = commandParts.slice(1);
// Use Vercel Sandbox runCommand
const result = await sandboxInstance.runCommand({
cmd: cmdName,
args
});
// Get command output
const stdout = await result.stdout();
const stderr = await result.stderr();
if (stdout) {
// Use E2B commands.run() for cleaner execution
const result = await sandboxInstance.commands.run(cmd, {
cwd: '/home/user/app',
timeout: 60,
on_stdout: async (data: string) => {
await sendProgress({
type: 'command-output',
command: cmd,
output: stdout,
output: data,
stream: 'stdout'
});
}
if (stderr) {
},
on_stderr: async (data: string) => {
await sendProgress({
type: 'command-output',
command: cmd,
output: stderr,
output: data,
stream: 'stderr'
});
}
});
if (results.commandsExecuted) {
results.commandsExecuted.push(cmd);
app/api/apply-ai-code/route.ts
+25 -30
View File
@@ -432,12 +432,15 @@ function App() {
export default App;`;
try {
await global.activeSandbox.writeFiles([{
path: 'src/App.jsx',
content: Buffer.from(appContent)
}]);
await global.activeSandbox.runCode(`
file_path = "/home/user/app/src/App.jsx"
file_content = """${appContent.replace(/"/g, '\\"').replace(/\n/g, '\\n')}"""
console.log('Auto-generated: src/App.jsx');
with open(file_path, 'w') as f:
f.write(file_content)
print(f"Auto-generated: {file_path}")
`);
results.filesCreated.push('src/App.jsx (auto-generated)');
} catch (error) {
results.errors.push(`Failed to create App.jsx: ${(error as Error).message}`);
@@ -456,7 +459,9 @@ export default App;`;
if (!isEdit && !indexCssInParsed && !indexCssExists) {
try {
const indexCssContent = `@tailwind base;
await global.activeSandbox.runCode(`
file_path = "/home/user/app/src/index.css"
file_content = """@tailwind base;
@tailwind components;
@tailwind utilities;
@@ -478,14 +483,13 @@ body {
margin: 0;
min-width: 320px;
min-height: 100vh;
}`;
}"""
await global.activeSandbox.writeFiles([{
path: 'src/index.css',
content: Buffer.from(indexCssContent)
}]);
with open(file_path, 'w') as f:
f.write(file_content)
console.log('Auto-generated: src/index.css');
print(f"Auto-generated: {file_path}")
`);
results.filesCreated.push('src/index.css (with Tailwind)');
} catch (error) {
results.errors.push('Failed to create index.css with Tailwind');
@@ -496,24 +500,15 @@ body {
// Execute commands
for (const cmd of parsed.commands) {
try {
// Parse command and arguments
const commandParts = cmd.trim().split(/\s+/);
const cmdName = commandParts[0];
const args = commandParts.slice(1);
// Execute command using Vercel Sandbox
const result = await global.activeSandbox.runCommand({
cmd: cmdName,
args
});
console.log(`Executed: ${cmd}`);
const stdout = await result.stdout();
const stderr = await result.stderr();
if (stdout) console.log(stdout);
if (stderr) console.log(`Errors: ${stderr}`);
await global.activeSandbox.runCode(`
import subprocess
os.chdir('/home/user/app')
result = subprocess.run(${JSON.stringify(cmd.split(' '))}, capture_output=True, text=True)
print(f"Executed: ${cmd}")
print(result.stdout)
if result.stderr:
print(f"Errors: {result.stderr}")
`);
results.commandsExecuted.push(cmd);
} catch (error) {
results.errors.push(`Failed to execute ${cmd}: ${(error as Error).message}`);
app/api/create-ai-sandbox/route.ts
+176 -138
View File
@@ -1,5 +1,5 @@
import { NextResponse } from 'next/server';
import { Sandbox } from '@vercel/sandbox';
import { Sandbox } from '@e2b/code-interpreter';
import type { SandboxState } from '@/types/sandbox';
import { appConfig } from '@/config/app.config';
@@ -15,15 +15,15 @@ export async function POST() {
let sandbox: any = null;
try {
console.log('[create-ai-sandbox] Creating Vercel sandbox...');
console.log('[create-ai-sandbox] Creating base sandbox...');
// Kill existing sandbox if any
if (global.activeSandbox) {
console.log('[create-ai-sandbox] Stopping existing sandbox...');
console.log('[create-ai-sandbox] Killing existing sandbox...');
try {
await global.activeSandbox.stop();
await global.activeSandbox.kill();
} catch (e) {
console.error('Failed to stop existing sandbox:', e);
console.error('Failed to close existing sandbox:', e);
}
global.activeSandbox = null;
}
@@ -35,79 +35,39 @@ export async function POST() {
global.existingFiles = new Set<string>();
}
// Create Vercel sandbox with flexible authentication
console.log(`[create-ai-sandbox] Creating Vercel sandbox with ${appConfig.vercelSandbox.timeoutMinutes} minute timeout...`);
// Create base sandbox - we'll set up Vite ourselves for full control
console.log(`[create-ai-sandbox] Creating base E2B sandbox with ${appConfig.e2b.timeoutMinutes} minute timeout...`);
sandbox = await Sandbox.create({
apiKey: process.env.E2B_API_KEY,
timeoutMs: appConfig.e2b.timeoutMs
});
// Prepare sandbox configuration
const sandboxConfig: any = {
timeout: appConfig.vercelSandbox.timeoutMs,
runtime: appConfig.vercelSandbox.runtime,
ports: [appConfig.vercelSandbox.devPort]
};
const sandboxId = (sandbox as any).sandboxId || Date.now().toString();
const host = (sandbox as any).getHost(appConfig.e2b.vitePort);
// Add authentication parameters if using personal access token
if (process.env.VERCEL_TOKEN && process.env.VERCEL_TEAM_ID && process.env.VERCEL_PROJECT_ID) {
console.log('[create-ai-sandbox] Using personal access token authentication');
sandboxConfig.teamId = process.env.VERCEL_TEAM_ID;
sandboxConfig.projectId = process.env.VERCEL_PROJECT_ID;
sandboxConfig.token = process.env.VERCEL_TOKEN;
} else if (process.env.VERCEL_OIDC_TOKEN) {
console.log('[create-ai-sandbox] Using OIDC token authentication');
} else {
console.log('[create-ai-sandbox] No authentication found - relying on default Vercel authentication');
}
sandbox = await Sandbox.create(sandboxConfig);
const sandboxId = sandbox.sandboxId;
console.log(`[create-ai-sandbox] Sandbox created: ${sandboxId}`);
console.log(`[create-ai-sandbox] Sandbox host: ${host}`);
// Set up a basic Vite React app
// Set up a basic Vite React app using Python to write files
console.log('[create-ai-sandbox] Setting up Vite React app...');
// First, change to the working directory
await sandbox.runCommand('pwd');
const workDir = appConfig.vercelSandbox.workingDirectory;
// Write all files in a single Python script to avoid multiple executions
const setupScript = `
import os
import json
// Get the sandbox URL using the correct Vercel Sandbox API
const sandboxUrl = sandbox.domain(appConfig.vercelSandbox.devPort);
print('Setting up React app with Vite and Tailwind...')
// Extract the hostname from the sandbox URL for Vite config
const sandboxHostname = new URL(sandboxUrl).hostname;
console.log(`[create-ai-sandbox] Sandbox hostname: ${sandboxHostname}`);
# Create directory structure
os.makedirs('/home/user/app/src', exist_ok=True)
// Create the Vite config content with the proper hostname (using string concatenation)
const viteConfigContent = `import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
// Vercel Sandbox compatible Vite configuration
export default defineConfig({
plugins: [react()],
server: {
host: '0.0.0.0',
port: ${appConfig.vercelSandbox.devPort},
strictPort: true,
hmr: true,
allowedHosts: [
'localhost',
'127.0.0.1',
'` + sandboxHostname + `', // Allow the Vercel Sandbox domain
'.vercel.run', // Allow all Vercel sandbox domains
'.vercel-sandbox.dev' // Fallback pattern
]
}
})`;
// Create the project files (now we have the sandbox hostname)
const projectFiles = [
{
path: 'package.json',
content: Buffer.from(JSON.stringify({
# Package.json
package_json = {
"name": "sandbox-app",
"version": "1.0.0",
"type": "module",
"scripts": {
"dev": "vite --host --port 3000",
"dev": "vite --host",
"build": "vite build",
"preview": "vite preview"
},
@@ -122,15 +82,34 @@ export default defineConfig({
"postcss": "^8.4.31",
"autoprefixer": "^10.4.16"
}
}, null, 2))
},
{
path: 'vite.config.js',
content: Buffer.from(viteConfigContent)
},
{
path: 'tailwind.config.js',
content: Buffer.from(`/** @type {import('tailwindcss').Config} */
}
with open('/home/user/app/package.json', 'w') as f:
json.dump(package_json, f, indent=2)
print('✓ package.json')
# Vite config for E2B - with allowedHosts
vite_config = """import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
// E2B-compatible Vite configuration
export default defineConfig({
plugins: [react()],
server: {
host: '0.0.0.0',
port: 5173,
strictPort: true,
hmr: false,
allowedHosts: ['.e2b.app', 'localhost', '127.0.0.1']
}
})"""
with open('/home/user/app/vite.config.js', 'w') as f:
f.write(vite_config)
print('✓ vite.config.js')
# Tailwind config - standard without custom design tokens
tailwind_config = """/** @type {import('tailwindcss').Config} */
export default {
content: [
"./index.html",
@@ -140,20 +119,26 @@ export default {
extend: {},
},
plugins: [],
}`)
},
{
path: 'postcss.config.js',
content: Buffer.from(`export default {
}"""
with open('/home/user/app/tailwind.config.js', 'w') as f:
f.write(tailwind_config)
print('✓ tailwind.config.js')
# PostCSS config
postcss_config = """export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}`)
},
{
path: 'index.html',
content: Buffer.from(`<!DOCTYPE html>
}"""
with open('/home/user/app/postcss.config.js', 'w') as f:
f.write(postcss_config)
print('✓ postcss.config.js')
# Index.html
index_html = """<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
@@ -164,11 +149,14 @@ export default {
<div id="root"></div>
<script type="module" src="/src/main.jsx"></script>
</body>
</html>`)
},
{
path: 'src/main.jsx',
content: Buffer.from(`import React from 'react'
</html>"""
with open('/home/user/app/index.html', 'w') as f:
f.write(index_html)
print('✓ index.html')
# Main.jsx
main_jsx = """import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App.jsx'
import './index.css'
@@ -177,18 +165,19 @@ ReactDOM.createRoot(document.getElementById('root')).render(
<React.StrictMode>
<App />
</React.StrictMode>,
)`)
},
{
path: 'src/App.jsx',
content: Buffer.from(`function App() {
)"""
with open('/home/user/app/src/main.jsx', 'w') as f:
f.write(main_jsx)
print('✓ src/main.jsx')
# App.jsx with explicit Tailwind test
app_jsx = """function App() {
return (
<div className="min-h-screen bg-gray-900 text-white flex items-center justify-center p-4">
<div className="text-center max-w-2xl">
<h1 className="text-4xl font-bold mb-4 bg-gradient-to-r from-blue-500 to-purple-600 bg-clip-text text-transparent">
Sandbox Ready
</h1>
<p className="text-lg text-gray-400">
Sandbox Ready<br/>
Start building your React app with Vite and Tailwind CSS!
</p>
</div>
@@ -196,11 +185,14 @@ ReactDOM.createRoot(document.getElementById('root')).render(
)
}
export default App`)
},
{
path: 'src/index.css',
content: Buffer.from(`@tailwind base;
export default App"""
with open('/home/user/app/src/App.jsx', 'w') as f:
f.write(app_jsx)
print('✓ src/App.jsx')
# Index.css with explicit Tailwind directives
index_css = """@tailwind base;
@tailwind components;
@tailwind utilities;
@@ -224,53 +216,99 @@ export default App`)
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
background-color: rgb(17 24 39);
}`)
}
];
}"""
// Create directory structure first
await sandbox.runCommand({
cmd: 'mkdir',
args: ['-p', 'src']
});
with open('/home/user/app/src/index.css', 'w') as f:
f.write(index_css)
print('✓ src/index.css')
// Write all files
await sandbox.writeFiles(projectFiles);
console.log('[create-ai-sandbox] ✓ Project files created');
print('\\nAll files created successfully!')
`;
// Execute the setup script
await sandbox.runCode(setupScript);
// Install dependencies
console.log('[create-ai-sandbox] Installing dependencies...');
const installResult = await sandbox.runCommand({
cmd: 'npm',
args: ['install', '--loglevel', 'info']
});
if (installResult.exitCode === 0) {
console.log('[create-ai-sandbox] ✓ Dependencies installed successfully');
} else {
console.log('[create-ai-sandbox] ⚠ Warning: npm install had issues but continuing...');
}
await sandbox.runCode(`
import subprocess
import sys
// Start Vite dev server in detached mode
print('Installing npm packages...')
result = subprocess.run(
['npm', 'install'],
cwd='/home/user/app',
capture_output=True,
text=True
)
if result.returncode == 0:
print('✓ Dependencies installed successfully')
else:
print(f'⚠ Warning: npm install had issues: {result.stderr}')
# Continue anyway as it might still work
`);
// Start Vite dev server
console.log('[create-ai-sandbox] Starting Vite dev server...');
const viteProcess = await sandbox.runCommand({
cmd: 'npm',
args: ['run', 'dev'],
detached: true
});
await sandbox.runCode(`
import subprocess
import os
import time
console.log('[create-ai-sandbox] ✓ Vite dev server started');
os.chdir('/home/user/app')
# Kill any existing Vite processes
subprocess.run(['pkill', '-f', 'vite'], capture_output=True)
time.sleep(1)
# Start Vite dev server
env = os.environ.copy()
env['FORCE_COLOR'] = '0'
process = subprocess.Popen(
['npm', 'run', 'dev'],
stdout=subprocess.PIPE,
stderr=subprocess.PIPE,
env=env
)
print(f'✓ Vite dev server started with PID: {process.pid}')
print('Waiting for server to be ready...')
`);
// Wait for Vite to be fully ready
await new Promise(resolve => setTimeout(resolve, appConfig.vercelSandbox.devServerStartupDelay));
await new Promise(resolve => setTimeout(resolve, appConfig.e2b.viteStartupDelay));
// Force Tailwind CSS to rebuild by touching the CSS file
await sandbox.runCode(`
import os
import time
# Touch the CSS file to trigger rebuild
css_file = '/home/user/app/src/index.css'
if os.path.exists(css_file):
os.utime(css_file, None)
print('✓ Triggered CSS rebuild')
# Also ensure PostCSS processes it
time.sleep(2)
print('✓ Tailwind CSS should be loaded')
`);
// Store sandbox globally
global.activeSandbox = sandbox;
global.sandboxData = {
sandboxId,
url: sandboxUrl,
viteProcess
url: `https://${host}`
};
// Set extended timeout on the sandbox instance if method available
if (typeof sandbox.setTimeout === 'function') {
sandbox.setTimeout(appConfig.e2b.timeoutMs);
console.log(`[create-ai-sandbox] Set sandbox timeout to ${appConfig.e2b.timeoutMinutes} minutes`);
}
// Initialize sandbox state
global.sandboxState = {
fileCache: {
@@ -281,7 +319,7 @@ body {
sandbox,
sandboxData: {
sandboxId,
url: sandboxUrl
url: `https://${host}`
}
};
@@ -295,13 +333,13 @@ body {
global.existingFiles.add('tailwind.config.js');
global.existingFiles.add('postcss.config.js');
console.log('[create-ai-sandbox] Sandbox ready at:', sandboxUrl);
console.log('[create-ai-sandbox] Sandbox ready at:', `https://${host}`);
return NextResponse.json({
success: true,
sandboxId,
url: sandboxUrl,
message: 'Vercel sandbox created and Vite React app initialized'
url: `https://${host}`,
message: 'Sandbox created and Vite React app initialized'
});
} catch (error) {
@@ -310,9 +348,9 @@ body {
// Clean up on error
if (sandbox) {
try {
await sandbox.stop();
await sandbox.kill();
} catch (e) {
console.error('Failed to stop sandbox on error:', e);
console.error('Failed to close sandbox on error:', e);
}
}
app/api/create-zip/route.ts
+31 -30
View File
@@ -15,37 +15,41 @@ export async function POST(request: NextRequest) {
console.log('[create-zip] Creating project zip...');
// Create zip file in sandbox using standard commands
const zipResult = await global.activeSandbox.runCommand({
cmd: 'bash',
args: ['-c', `zip -r /tmp/project.zip . -x "node_modules/*" ".git/*" ".next/*" "dist/*" "build/*" "*.log"`]
});
// Create zip file in sandbox
const result = await global.activeSandbox.runCode(`
import zipfile
import os
import json
if (zipResult.exitCode !== 0) {
const error = await zipResult.stderr();
throw new Error(`Failed to create zip: ${error}`);
}
os.chdir('/home/user/app')
const sizeResult = await global.activeSandbox.runCommand({
cmd: 'bash',
args: ['-c', `ls -la /tmp/project.zip | awk '{print $5}'`]
});
# Create zip file
with zipfile.ZipFile('/tmp/project.zip', 'w', zipfile.ZIP_DEFLATED) as zipf:
for root, dirs, files in os.walk('.'):
# Skip node_modules and .git
dirs[:] = [d for d in dirs if d not in ['node_modules', '.git', '.next', 'dist']]
const fileSize = await sizeResult.stdout();
console.log(`[create-zip] Created project.zip (${fileSize.trim()} bytes)`);
for file in files:
file_path = os.path.join(root, file)
arcname = os.path.relpath(file_path, '.')
zipf.write(file_path, arcname)
# Get file size
file_size = os.path.getsize('/tmp/project.zip')
print(f" Created project.zip ({file_size} bytes)")
`);
// Read the zip file and convert to base64
const readResult = await global.activeSandbox.runCommand({
cmd: 'base64',
args: ['/tmp/project.zip']
});
const readResult = await global.activeSandbox.runCode(`
import base64
if (readResult.exitCode !== 0) {
const error = await readResult.stderr();
throw new Error(`Failed to read zip file: ${error}`);
}
with open('/tmp/project.zip', 'rb') as f:
content = f.read()
encoded = base64.b64encode(content).decode('utf-8')
print(encoded)
`);
const base64Content = (await readResult.stdout()).trim();
const base64Content = readResult.logs.stdout.join('').trim();
// Create a data URL for download
const dataUrl = `data:application/zip;base64,${base64Content}`;
@@ -53,18 +57,15 @@ export async function POST(request: NextRequest) {
return NextResponse.json({
success: true,
dataUrl,
fileName: 'vercel-sandbox-project.zip',
fileName: 'e2b-project.zip',
message: 'Zip file created successfully'
});
} catch (error) {
console.error('[create-zip] Error:', error);
return NextResponse.json(
{
return NextResponse.json({
success: false,
error: (error as Error).message
},
{ status: 500 }
);
}, { status: 500 });
}
}
app/api/detect-and-install-packages/route.ts
+128 -56
View File
@@ -64,7 +64,15 @@ export async function POST(request: NextRequest) {
const builtins = ['fs', 'path', 'http', 'https', 'crypto', 'stream', 'util', 'os', 'url', 'querystring', 'child_process'];
if (builtins.includes(imp)) return false;
// Extract package name (handle scoped packages and subpaths)
const parts = imp.split('/');
if (imp.startsWith('@')) {
// Scoped package like @vitejs/plugin-react
return true;
} else {
// Regular package, return just the first part
return true;
}
});
// Extract just the package names (without subpaths)
@@ -93,89 +101,153 @@ export async function POST(request: NextRequest) {
}
// Check which packages are already installed
const installed: string[] = [];
const missing: string[] = [];
const checkResult = await global.activeSandbox.runCode(`
import os
import json
for (const packageName of uniquePackages) {
try {
const checkResult = await global.activeSandbox.runCommand({
cmd: 'test',
args: ['-d', `node_modules/${packageName}`]
});
installed = []
missing = []
if (checkResult.exitCode === 0) {
installed.push(packageName);
} else {
missing.push(packageName);
}
} catch (error) {
// If test command fails, assume package is missing
missing.push(packageName);
}
}
packages = ${JSON.stringify(uniquePackages)}
console.log('[detect-and-install-packages] Package status:', { installed, missing });
for package in packages:
# Handle scoped packages
if package.startswith('@'):
package_path = f"/home/user/app/node_modules/{package}"
else:
package_path = f"/home/user/app/node_modules/{package}"
if (missing.length === 0) {
if os.path.exists(package_path):
installed.append(package)
else:
missing.append(package)
result = {
'installed': installed,
'missing': missing
}
print(json.dumps(result))
`);
const status = JSON.parse(checkResult.logs.stdout.join(''));
console.log('[detect-and-install-packages] Package status:', status);
if (status.missing.length === 0) {
return NextResponse.json({
success: true,
packagesInstalled: [],
packagesAlreadyInstalled: installed,
packagesAlreadyInstalled: status.installed,
message: 'All packages already installed'
});
}
// Install missing packages
console.log('[detect-and-install-packages] Installing packages:', missing);
console.log('[detect-and-install-packages] Installing packages:', status.missing);
const installResult = await global.activeSandbox.runCommand({
cmd: 'npm',
args: ['install', '--save', ...missing]
});
const installResult = await global.activeSandbox.runCode(`
import subprocess
import os
import json
const stdout = await installResult.stdout();
const stderr = await installResult.stderr();
os.chdir('/home/user/app')
packages_to_install = ${JSON.stringify(status.missing)}
console.log('[detect-and-install-packages] Install stdout:', stdout);
if (stderr) {
console.log('[detect-and-install-packages] Install stderr:', stderr);
}
# Join packages into a single install command
packages_str = ' '.join(packages_to_install)
cmd = f'npm install {packages_str} --save'
// Verify installation
const finalInstalled: string[] = [];
const failed: string[] = [];
print(f"Running: {cmd}")
for (const packageName of missing) {
# Run npm install with explicit save flag
result = subprocess.run(['npm', 'install', '--save'] + packages_to_install,
capture_output=True,
text=True,
cwd='/home/user/app',
timeout=60)
print("stdout:", result.stdout)
if result.stderr:
print("stderr:", result.stderr)
# Verify installation
installed = []
failed = []
for package in packages_to_install:
# Handle scoped packages correctly
if package.startswith('@'):
# For scoped packages like @heroicons/react
package_path = f"/home/user/app/node_modules/{package}"
else:
package_path = f"/home/user/app/node_modules/{package}"
if os.path.exists(package_path):
installed.append(package)
print(f"✓ Verified installation of {package}")
else:
# Check if it's a submodule of an installed package
base_package = package.split('/')[0]
if package.startswith('@'):
# For @scope/package, the base is @scope/package
base_package = '/'.join(package.split('/')[:2])
base_path = f"/home/user/app/node_modules/{base_package}"
if os.path.exists(base_path):
installed.append(package)
print(f"✓ Verified installation of {package} (via {base_package})")
else:
failed.append(package)
print(f"✗ Failed to verify installation of {package}")
result_data = {
'installed': installed,
'failed': failed,
'returncode': result.returncode
}
print("\\nResult:", json.dumps(result_data))
`, { timeout: 60000 });
// Parse the result more safely
let installStatus;
try {
const verifyResult = await global.activeSandbox.runCommand({
cmd: 'test',
args: ['-d', `node_modules/${packageName}`]
});
if (verifyResult.exitCode === 0) {
finalInstalled.push(packageName);
console.log(`✓ Verified installation of ${packageName}`);
const stdout = installResult.logs.stdout.join('');
const resultMatch = stdout.match(/Result:\s*({.*})/);
if (resultMatch) {
installStatus = JSON.parse(resultMatch[1]);
} else {
failed.push(packageName);
console.log(`✗ Failed to verify installation of ${packageName}`);
// Fallback parsing
const lines = stdout.split('\n');
const resultLine = lines.find((line: string) => line.includes('Result:'));
if (resultLine) {
installStatus = JSON.parse(resultLine.split('Result:')[1].trim());
} else {
throw new Error('Could not find Result in output');
}
} catch (error) {
failed.push(packageName);
console.log(`✗ Error verifying ${packageName}:`, error);
}
} catch (parseError) {
console.error('[detect-and-install-packages] Failed to parse install result:', parseError);
console.error('[detect-and-install-packages] stdout:', installResult.logs.stdout.join(''));
// Fallback to assuming all packages were installed
installStatus = {
installed: status.missing,
failed: [],
returncode: 0
};
}
if (failed.length > 0) {
console.error('[detect-and-install-packages] Failed to install:', failed);
if (installStatus.failed.length > 0) {
console.error('[detect-and-install-packages] Failed to install:', installStatus.failed);
}
return NextResponse.json({
success: true,
packagesInstalled: finalInstalled,
packagesFailed: failed,
packagesAlreadyInstalled: installed,
message: `Installed ${finalInstalled.length} packages`,
logs: stdout
packagesInstalled: installStatus.installed,
packagesFailed: installStatus.failed,
packagesAlreadyInstalled: status.installed,
message: `Installed ${installStatus.installed.length} packages`,
logs: installResult.logs.stdout.join('\n')
});
} catch (error) {
app/api/generate-ai-code-stream/route.ts
+5 -47
View File
@@ -11,9 +11,6 @@ import { FileManifest } from '@/types/file-manifest';
import type { ConversationState, ConversationMessage, ConversationEdit } from '@/types/conversation';
import { appConfig } from '@/config/app.config';
// Force dynamic route to enable streaming
export const dynamic = 'force-dynamic';
const groq = createGroq({
apiKey: process.env.GROQ_API_KEY,
});
@@ -1159,21 +1156,9 @@ CRITICAL: When files are provided in the context:
const isGoogle = model.startsWith('google/');
const isOpenAI = model.startsWith('openai/gpt-5');
const modelProvider = isAnthropic ? anthropic : (isOpenAI ? openai : (isGoogle ? googleGenerativeAI : groq));
// Fix model name transformation for different providers
let actualModel: string;
if (isAnthropic) {
actualModel = model.replace('anthropic/', '');
} else if (model === 'openai/gpt-5') {
actualModel = 'gpt-5';
} else if (isGoogle) {
// Google uses specific model names - convert our naming to theirs
actualModel = model.replace('google/', '');
} else {
actualModel = model;
}
console.log(`[generate-ai-code-stream] Using provider: ${isAnthropic ? 'Anthropic' : isGoogle ? 'Google' : isOpenAI ? 'OpenAI' : 'Groq'}, model: ${actualModel}`);
const actualModel = isAnthropic ? model.replace('anthropic/', '') :
(model === 'openai/gpt-5') ? 'gpt-5' :
(isGoogle ? model.replace('google/', '') : model);
// Make streaming API call with appropriate provider
const streamOptions: any = {
@@ -1258,28 +1243,7 @@ It's better to have 3 complete files than 10 incomplete files.`
};
}
let result;
try {
result = await streamText(streamOptions);
} catch (streamError) {
console.error('[generate-ai-code-stream] Error calling streamText:', streamError);
// Send specific error for debugging
await sendProgress({
type: 'error',
message: `Failed to initialize ${isGoogle ? 'Gemini' : isAnthropic ? 'Claude' : isOpenAI ? 'GPT-5' : 'Groq'} streaming: ${(streamError as Error).message}`
});
// If this is a Google model error, provide helpful info
if (isGoogle) {
await sendProgress({
type: 'info',
message: 'Tip: Make sure your GEMINI_API_KEY is set correctly and has proper permissions.'
});
}
throw streamError;
}
const result = await streamText(streamOptions);
// Stream the response and parse in real-time
let generatedCode = '';
@@ -1751,18 +1715,12 @@ Provide the complete file content without any truncation. Include all necessary
}
})();
// Return the stream with proper headers for streaming support
// Return the stream
return new Response(stream.readable, {
headers: {
'Content-Type': 'text/event-stream',
'Cache-Control': 'no-cache',
'Connection': 'keep-alive',
'Transfer-Encoding': 'chunked',
'Content-Encoding': 'none', // Prevent compression that can break streaming
'X-Accel-Buffering': 'no', // Disable nginx buffering
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'GET, POST, OPTIONS',
'Access-Control-Allow-Headers': 'Content-Type, Authorization',
},
});
app/api/get-sandbox-files/route.ts
+50 -73
View File
@@ -18,81 +18,58 @@ export async function GET() {
console.log('[get-sandbox-files] Fetching and analyzing file structure...');
// Get list of all relevant files
const findResult = await global.activeSandbox.runCommand({
cmd: 'find',
args: [
'.',
'-name', 'node_modules', '-prune', '-o',
'-name', '.git', '-prune', '-o',
'-name', 'dist', '-prune', '-o',
'-name', 'build', '-prune', '-o',
'-type', 'f',
'(',
'-name', '*.jsx',
'-o', '-name', '*.js',
'-o', '-name', '*.tsx',
'-o', '-name', '*.ts',
'-o', '-name', '*.css',
'-o', '-name', '*.json',
')',
'-print'
]
});
// Get all React/JS/CSS files
const result = await global.activeSandbox.runCode(`
import os
import json
if (findResult.exitCode !== 0) {
throw new Error('Failed to list files');
}
def get_files_content(directory='/home/user/app', extensions=['.jsx', '.js', '.tsx', '.ts', '.css', '.json']):
files_content = {}
const fileList = (await findResult.stdout()).split('\n').filter(f => f.trim());
console.log('[get-sandbox-files] Found', fileList.length, 'files');
for root, dirs, files in os.walk(directory):
# Skip node_modules and other unwanted directories
dirs[:] = [d for d in dirs if d not in ['node_modules', '.git', 'dist', 'build']]
// Read content of each file (limit to reasonable sizes)
const filesContent: Record<string, string> = {};
for file in files:
if any(file.endswith(ext) for ext in extensions):
file_path = os.path.join(root, file)
relative_path = os.path.relpath(file_path, '/home/user/app')
for (const filePath of fileList) {
try {
// Check file size first
const statResult = await global.activeSandbox.runCommand({
cmd: 'stat',
args: ['-f', '%z', filePath]
});
try:
with open(file_path, 'r') as f:
content = f.read()
# Only include files under 10KB to avoid huge responses
if len(content) < 10000:
files_content[relative_path] = content
except:
pass
if (statResult.exitCode === 0) {
const fileSize = parseInt(await statResult.stdout());
return files_content
// Only read files smaller than 10KB
if (fileSize < 10000) {
const catResult = await global.activeSandbox.runCommand({
cmd: 'cat',
args: [filePath]
});
# Get the files
files = get_files_content()
if (catResult.exitCode === 0) {
const content = await catResult.stdout();
// Remove leading './' from path
const relativePath = filePath.replace(/^\.\//, '');
filesContent[relativePath] = content;
}
}
}
} catch (error) {
// Skip files that can't be read
continue;
}
}
# Also get the directory structure
structure = []
for root, dirs, files in os.walk('/home/user/app'):
level = root.replace('/home/user/app', '').count(os.sep)
indent = ' ' * 2 * level
structure.append(f"{indent}{os.path.basename(root)}/")
sub_indent = ' ' * 2 * (level + 1)
for file in files:
if not any(skip in root for skip in ['node_modules', '.git', 'dist', 'build']):
structure.append(f"{sub_indent}{file}")
// Get directory structure
const treeResult = await global.activeSandbox.runCommand({
cmd: 'find',
args: ['.', '-type', 'd', '-not', '-path', '*/node_modules*', '-not', '-path', '*/.git*']
});
result = {
'files': files,
'structure': '\\n'.join(structure[:50]) # Limit structure to 50 lines
}
let structure = '';
if (treeResult.exitCode === 0) {
const dirs = (await treeResult.stdout()).split('\n').filter(d => d.trim());
structure = dirs.slice(0, 50).join('\n'); // Limit to 50 lines
}
print(json.dumps(result))
`);
const output = result.logs.stdout.join('');
const parsedResult = JSON.parse(output);
// Build enhanced file manifest
const fileManifest: FileManifest = {
@@ -105,12 +82,12 @@ export async function GET() {
};
// Process each file
for (const [relativePath, content] of Object.entries(filesContent)) {
const fullPath = `/${relativePath}`;
for (const [relativePath, content] of Object.entries(parsedResult.files)) {
const fullPath = `/home/user/app/${relativePath}`;
// Create base file info
const fileInfo: FileInfo = {
content: content,
content: content as string,
type: 'utility',
path: fullPath,
relativePath,
@@ -119,7 +96,7 @@ export async function GET() {
// Parse JavaScript/JSX files
if (relativePath.match(/\.(jsx?|tsx?)$/)) {
const parseResult = parseJavaScriptFile(content, fullPath);
const parseResult = parseJavaScriptFile(content as string, fullPath);
Object.assign(fileInfo, parseResult);
// Identify entry point
@@ -155,9 +132,9 @@ export async function GET() {
return NextResponse.json({
success: true,
files: filesContent,
structure,
fileCount: Object.keys(filesContent).length,
files: parsedResult.files,
structure: parsedResult.structure,
fileCount: Object.keys(parsedResult.files).length,
manifest: fileManifest,
});
app/api/install-packages/route.ts
+215 -117
View File
@@ -1,4 +1,5 @@
import { NextRequest, NextResponse } from 'next/server';
import { Sandbox } from '@e2b/code-interpreter';
declare global {
var activeSandbox: any;
@@ -35,8 +36,23 @@ export async function POST(request: NextRequest) {
console.log(`[install-packages] Cleaned:`, validPackages);
}
// Get active sandbox
const sandbox = global.activeSandbox;
// Try to get sandbox - either from global or reconnect
let sandbox = global.activeSandbox;
if (!sandbox && sandboxId) {
console.log(`[install-packages] Reconnecting to sandbox ${sandboxId}...`);
try {
sandbox = await Sandbox.connect(sandboxId, { apiKey: process.env.E2B_API_KEY });
global.activeSandbox = sandbox;
console.log(`[install-packages] Successfully reconnected to sandbox ${sandboxId}`);
} catch (error) {
console.error(`[install-packages] Failed to reconnect to sandbox:`, error);
return NextResponse.json({
success: false,
error: `Failed to reconnect to sandbox: ${(error as Error).message}`
}, { status: 500 });
}
}
if (!sandbox) {
return NextResponse.json({
@@ -45,7 +61,7 @@ export async function POST(request: NextRequest) {
}, { status: 400 });
}
console.log('[install-packages] Installing packages:', validPackages);
console.log('[install-packages] Installing packages:', packages);
// Create a response stream for real-time updates
const encoder = new TextEncoder();
@@ -67,20 +83,23 @@ export async function POST(request: NextRequest) {
packages: validPackages
});
// Stop any existing development server first
// Kill any existing Vite process first
await sendProgress({ type: 'status', message: 'Stopping development server...' });
try {
// Try to kill any running dev server processes
await sandboxInstance.runCommand({
cmd: 'pkill',
args: ['-f', 'vite']
});
await new Promise(resolve => setTimeout(resolve, 1000)); // Wait a bit
} catch (error) {
// It's OK if no process is found
console.log('[install-packages] No existing dev server found');
}
await sandboxInstance.runCode(`
import subprocess
import os
import signal
# Try to kill any existing Vite process
try:
with open('/tmp/vite-process.pid', 'r') as f:
pid = int(f.read().strip())
os.kill(pid, signal.SIGTERM)
print("Stopped existing Vite process")
except:
print("No existing Vite process found")
`);
// Check which packages are already installed
await sendProgress({
@@ -88,51 +107,70 @@ export async function POST(request: NextRequest) {
message: 'Checking installed packages...'
});
const checkResult = await sandboxInstance.runCode(`
import os
import json
os.chdir('/home/user/app')
# Read package.json to check installed packages
try:
with open('package.json', 'r') as f:
package_json = json.load(f)
dependencies = package_json.get('dependencies', {})
dev_dependencies = package_json.get('devDependencies', {})
all_deps = {**dependencies, **dev_dependencies}
# Check which packages need to be installed
packages_to_check = ${JSON.stringify(validPackages)}
already_installed = []
need_install = []
for pkg in packages_to_check:
# Handle scoped packages
if pkg.startswith('@'):
pkg_name = pkg
else:
# Extract package name without version
pkg_name = pkg.split('@')[0]
if pkg_name in all_deps:
already_installed.append(pkg_name)
else:
need_install.append(pkg)
print(f"Already installed: {already_installed}")
print(f"Need to install: {need_install}")
print(f"NEED_INSTALL:{json.dumps(need_install)}")
except Exception as e:
print(f"Error checking packages: {e}")
print(f"NEED_INSTALL:{json.dumps(packages_to_check)}")
`);
// Parse packages that need installation
let packagesToInstall = validPackages;
// Check if checkResult has the expected structure
if (checkResult && checkResult.results && checkResult.results[0] && checkResult.results[0].text) {
const outputLines = checkResult.results[0].text.split('\n');
for (const line of outputLines) {
if (line.startsWith('NEED_INSTALL:')) {
try {
// Read package.json to check existing dependencies
const catResult = await sandboxInstance.runCommand({
cmd: 'cat',
args: ['package.json']
});
if (catResult.exitCode === 0) {
const packageJsonContent = await catResult.stdout();
const packageJson = JSON.parse(packageJsonContent);
const dependencies = packageJson.dependencies || {};
const devDependencies = packageJson.devDependencies || {};
const allDeps = { ...dependencies, ...devDependencies };
const alreadyInstalled = [];
const needInstall = [];
for (const pkg of validPackages) {
// Handle scoped packages
const pkgName = pkg.startsWith('@') ? pkg : pkg.split('@')[0];
if (allDeps[pkgName]) {
alreadyInstalled.push(pkgName);
packagesToInstall = JSON.parse(line.substring('NEED_INSTALL:'.length));
} catch (e) {
console.error('Failed to parse packages to install:', e);
}
}
}
} else {
needInstall.push(pkg);
}
}
packagesToInstall = needInstall;
if (alreadyInstalled.length > 0) {
await sendProgress({
type: 'info',
message: `Already installed: ${alreadyInstalled.join(', ')}`
});
}
}
} catch (error) {
console.error('[install-packages] Error checking existing packages:', error);
console.error('[install-packages] Invalid checkResult structure:', checkResult);
// If we can't check, just try to install all packages
packagesToInstall = validPackages;
}
if (packagesToInstall.length === 0) {
await sendProgress({
type: 'success',
@@ -140,104 +178,164 @@ export async function POST(request: NextRequest) {
installedPackages: [],
alreadyInstalled: validPackages
});
// Restart dev server
await sendProgress({ type: 'status', message: 'Restarting development server...' });
const devServerProcess = await sandboxInstance.runCommand({
cmd: 'npm',
args: ['run', 'dev'],
detached: true
});
await sendProgress({
type: 'complete',
message: 'Dev server restarted!',
installedPackages: []
});
return;
}
// Install only packages that aren't already installed
const packageList = packagesToInstall.join(' ');
// Only send the npm install command message if we're actually installing new packages
await sendProgress({
type: 'info',
message: `Installing ${packagesToInstall.length} new package(s): ${packagesToInstall.join(', ')}`
});
// Run npm install
const installArgs = ['install', '--legacy-peer-deps', ...packagesToInstall];
const installResult = await sandboxInstance.runCommand({
cmd: 'npm',
args: installArgs
const installResult = await sandboxInstance.runCode(`
import subprocess
import os
os.chdir('/home/user/app')
# Run npm install with output capture
packages_to_install = ${JSON.stringify(packagesToInstall)}
cmd_args = ['npm', 'install', '--legacy-peer-deps'] + packages_to_install
print(f"Running command: {' '.join(cmd_args)}")
process = subprocess.Popen(
cmd_args,
stdout=subprocess.PIPE,
stderr=subprocess.PIPE,
text=True
)
# Stream output
while True:
output = process.stdout.readline()
if output == '' and process.poll() is not None:
break
if output:
print(output.strip())
# Get the return code
rc = process.poll()
# Capture any stderr
stderr = process.stderr.read()
if stderr:
print("STDERR:", stderr)
if 'ERESOLVE' in stderr:
print("ERESOLVE_ERROR: Dependency conflict detected - using --legacy-peer-deps flag")
print(f"\\nInstallation completed with code: {rc}")
# Verify packages were installed
import json
with open('/home/user/app/package.json', 'r') as f:
package_json = json.load(f)
installed = []
for pkg in ${JSON.stringify(packagesToInstall)}:
if pkg in package_json.get('dependencies', {}):
installed.append(pkg)
print(f"✓ Verified {pkg}")
else:
print(f"✗ Package {pkg} not found in dependencies")
print(f"\\nVerified installed packages: {installed}")
`, { timeout: 60000 }); // 60 second timeout for npm install
// Send npm output
const output = installResult?.output || installResult?.logs?.stdout?.join('\n') || '';
const npmOutputLines = output.split('\n').filter((line: string) => line.trim());
for (const line of npmOutputLines) {
if (line.includes('STDERR:')) {
const errorMsg = line.replace('STDERR:', '').trim();
if (errorMsg && errorMsg !== 'undefined') {
await sendProgress({ type: 'error', message: errorMsg });
}
} else if (line.includes('ERESOLVE_ERROR:')) {
const msg = line.replace('ERESOLVE_ERROR:', '').trim();
await sendProgress({
type: 'warning',
message: `Dependency conflict resolved with --legacy-peer-deps: ${msg}`
});
// Get install output
const stdout = await installResult.stdout();
const stderr = await installResult.stderr();
if (stdout) {
const lines = stdout.split('\n').filter(line => line.trim());
for (const line of lines) {
if (line.includes('npm WARN')) {
} else if (line.includes('npm WARN')) {
await sendProgress({ type: 'warning', message: line });
} else if (line.trim()) {
} else if (line.trim() && !line.includes('undefined')) {
await sendProgress({ type: 'output', message: line });
}
}
// Check if installation was successful
const installedMatch = output.match(/Verified installed packages: \[(.*?)\]/);
let installedPackages: string[] = [];
if (installedMatch && installedMatch[1]) {
installedPackages = installedMatch[1]
.split(',')
.map((p: string) => p.trim().replace(/'/g, ''))
.filter((p: string) => p.length > 0);
}
if (stderr) {
const errorLines = stderr.split('\n').filter(line => line.trim());
for (const line of errorLines) {
if (line.includes('ERESOLVE')) {
await sendProgress({
type: 'warning',
message: `Dependency conflict resolved with --legacy-peer-deps: ${line}`
});
} else if (line.trim()) {
await sendProgress({ type: 'error', message: line });
}
}
}
if (installResult.exitCode === 0) {
if (installedPackages.length > 0) {
await sendProgress({
type: 'success',
message: `Successfully installed: ${packagesToInstall.join(', ')}`,
installedPackages: packagesToInstall
message: `Successfully installed: ${installedPackages.join(', ')}`,
installedPackages
});
} else {
await sendProgress({
type: 'error',
message: 'Package installation failed'
message: 'Failed to verify package installation'
});
}
// Restart development server
// Restart Vite dev server
await sendProgress({ type: 'status', message: 'Restarting development server...' });
try {
const devServerProcess = await sandboxInstance.runCommand({
cmd: 'npm',
args: ['run', 'dev'],
detached: true
});
await sandboxInstance.runCode(`
import subprocess
import os
import time
// Wait a bit for the server to start
await new Promise(resolve => setTimeout(resolve, 3000));
os.chdir('/home/user/app')
# Kill any existing Vite processes
subprocess.run(['pkill', '-f', 'vite'], capture_output=True)
time.sleep(1)
# Start Vite dev server
env = os.environ.copy()
env['FORCE_COLOR'] = '0'
process = subprocess.Popen(
['npm', 'run', 'dev'],
stdout=subprocess.PIPE,
stderr=subprocess.PIPE,
env=env
)
print(f'✓ Vite dev server restarted with PID: {process.pid}')
# Store process info for later
with open('/tmp/vite-process.pid', 'w') as f:
f.write(str(process.pid))
# Wait a bit for Vite to start up
time.sleep(3)
# Touch files to trigger Vite reload
subprocess.run(['touch', '/home/user/app/package.json'])
subprocess.run(['touch', '/home/user/app/vite.config.js'])
print("Vite restarted and should now recognize all packages")
`);
await sendProgress({
type: 'complete',
message: 'Package installation complete and dev server restarted!',
installedPackages: packagesToInstall
installedPackages
});
} catch (error) {
await sendProgress({
type: 'error',
message: `Failed to restart dev server: ${(error as Error).message}`
});
}
} catch (error) {
const errorMessage = (error as Error).message;
app/api/kill-sandbox/route.ts
+5 -5
View File
@@ -8,18 +8,18 @@ declare global {
export async function POST() {
try {
console.log('[kill-sandbox] Stopping active sandbox...');
console.log('[kill-sandbox] Killing active sandbox...');
let sandboxKilled = false;
// Stop existing sandbox if any
// Kill existing sandbox if any
if (global.activeSandbox) {
try {
await global.activeSandbox.stop();
await global.activeSandbox.close();
sandboxKilled = true;
console.log('[kill-sandbox] Sandbox stopped successfully');
console.log('[kill-sandbox] Sandbox closed successfully');
} catch (e) {
console.error('[kill-sandbox] Failed to stop sandbox:', e);
console.error('[kill-sandbox] Failed to close sandbox:', e);
}
global.activeSandbox = null;
global.sandboxData = null;
app/api/monitor-vite-logs/route.ts
+81 -84
View File
@@ -15,100 +15,97 @@ export async function GET() {
console.log('[monitor-vite-logs] Checking Vite process logs...');
const errors: any[] = [];
// Check both the error file and recent logs
const result = await global.activeSandbox.runCode(`
import json
import subprocess
import re
// Check if there's an error file from previous runs
try {
const catResult = await global.activeSandbox.runCommand({
cmd: 'cat',
args: ['/tmp/vite-errors.json']
});
errors = []
if (catResult.exitCode === 0) {
const errorFileContent = await catResult.stdout();
const data = JSON.parse(errorFileContent);
errors.push(...(data.errors || []));
}
} catch (error) {
// No error file exists, that's OK
# First check the error file
try:
with open('/tmp/vite-errors.json', 'r') as f:
data = json.load(f)
errors.extend(data.get('errors', []))
except:
pass
# Also check if we can get recent Vite logs
try:
# Try to get the Vite process PID
with open('/tmp/vite-process.pid', 'r') as f:
pid = int(f.read().strip())
# Check if process is still running and get its logs
# This is a bit hacky but works for our use case
result = subprocess.run(['ps', '-p', str(pid)], capture_output=True, text=True)
if result.returncode == 0:
# Process is running, try to check for errors in output
# Note: We can't easily get stdout/stderr from a running process
# but we can check if there are new errors
pass
except:
pass
# Also scan the current console output for any HMR errors
# This won't catch everything but helps with recent errors
try:
# Check if there's a log file we can read
import os
log_files = []
for root, dirs, files in os.walk('/tmp'):
for file in files:
if 'vite' in file.lower() and file.endswith('.log'):
log_files.append(os.path.join(root, file))
for log_file in log_files[:5]: # Check up to 5 log files
try:
with open(log_file, 'r') as f:
content = f.read()
# Look for import errors
import_errors = re.findall(r'Failed to resolve import "([^"]+)"', content)
for pkg in import_errors:
if not pkg.startswith('.'):
# Extract base package name
if pkg.startswith('@'):
parts = pkg.split('/')
final_pkg = '/'.join(parts[:2]) if len(parts) >= 2 else pkg
else:
final_pkg = pkg.split('/')[0]
error_obj = {
"type": "npm-missing",
"package": final_pkg,
"message": f"Failed to resolve import \\"{pkg}\\"",
"file": "Unknown"
}
// Look for any Vite-related log files that might contain errors
try {
const findResult = await global.activeSandbox.runCommand({
cmd: 'find',
args: ['/tmp', '-name', '*vite*', '-type', 'f']
});
# Avoid duplicates
if not any(e['package'] == error_obj['package'] for e in errors):
errors.append(error_obj)
except:
pass
except Exception as e:
print(f"Error scanning logs: {e}")
if (findResult.exitCode === 0) {
const logFiles = (await findResult.stdout()).split('\n').filter(f => f.trim());
# Deduplicate errors
unique_errors = []
seen_packages = set()
for error in errors:
if error.get('package') and error['package'] not in seen_packages:
seen_packages.add(error['package'])
unique_errors.append(error)
for (const logFile of logFiles.slice(0, 3)) {
try {
const grepResult = await global.activeSandbox.runCommand({
cmd: 'grep',
args: ['-i', 'failed to resolve import', logFile]
});
print(json.dumps({"errors": unique_errors}))
`, { timeout: 5000 });
if (grepResult.exitCode === 0) {
const errorLines = (await grepResult.stdout()).split('\n').filter(line => line.trim());
for (const line of errorLines) {
// Extract package name from error line
const importMatch = line.match(/"([^"]+)"/);
if (importMatch) {
const importPath = importMatch[1];
// Skip relative imports
if (!importPath.startsWith('.')) {
// Extract base package name
let packageName;
if (importPath.startsWith('@')) {
const parts = importPath.split('/');
packageName = parts.length >= 2 ? parts.slice(0, 2).join('/') : importPath;
} else {
packageName = importPath.split('/')[0];
}
const errorObj = {
type: "npm-missing",
package: packageName,
message: `Failed to resolve import "${importPath}"`,
file: "Unknown"
};
// Avoid duplicates
if (!errors.some(e => e.package === errorObj.package)) {
errors.push(errorObj);
}
}
}
}
}
} catch (error) {
// Skip if grep fails
}
}
}
} catch (error) {
// No log files found, that's OK
}
// Deduplicate errors by package name
const uniqueErrors: any[] = [];
const seenPackages = new Set<string>();
for (const error of errors) {
if (error.package && !seenPackages.has(error.package)) {
seenPackages.add(error.package);
uniqueErrors.push(error);
}
}
const data = JSON.parse(result.output || '{"errors": []}');
return NextResponse.json({
success: true,
hasErrors: uniqueErrors.length > 0,
errors: uniqueErrors
hasErrors: data.errors.length > 0,
errors: data.errors
});
} catch (error) {
app/api/restart-vite/route.ts
+100 -30
View File
@@ -15,45 +15,115 @@ export async function POST() {
console.log('[restart-vite] Forcing Vite restart...');
// Kill existing Vite processes
try {
await global.activeSandbox.runCommand({
cmd: 'pkill',
args: ['-f', 'vite']
});
console.log('[restart-vite] Killed existing Vite processes');
// Kill existing Vite process and restart
const result = await global.activeSandbox.runCode(`
import subprocess
import os
import signal
import time
import threading
import json
import sys
// Wait a moment for processes to terminate
await new Promise(resolve => setTimeout(resolve, 2000));
} catch (error) {
console.log('[restart-vite] No existing Vite processes found');
# Kill existing Vite process
try:
with open('/tmp/vite-process.pid', 'r') as f:
pid = int(f.read().strip())
os.kill(pid, signal.SIGTERM)
print("Killed existing Vite process")
time.sleep(1)
except:
print("No existing Vite process found")
os.chdir('/home/user/app')
# Clear error file
error_file = '/tmp/vite-errors.json'
with open(error_file, 'w') as f:
json.dump({"errors": [], "lastChecked": time.time()}, f)
# Function to monitor Vite output for errors
def monitor_output(proc, error_file):
while True:
line = proc.stderr.readline()
if not line:
break
sys.stdout.write(line) # Also print to console
# Check for import resolution errors
if "Failed to resolve import" in line:
try:
# Extract package name from error
import_match = line.find('"')
if import_match != -1:
end_match = line.find('"', import_match + 1)
if end_match != -1:
package_name = line[import_match + 1:end_match]
# Skip relative imports
if not package_name.startswith('.'):
with open(error_file, 'r') as f:
data = json.load(f)
# Handle scoped packages correctly
if package_name.startswith('@'):
# For @scope/package, keep the scope
pkg_parts = package_name.split('/')
if len(pkg_parts) >= 2:
final_package = '/'.join(pkg_parts[:2])
else:
final_package = package_name
else:
# For regular packages, just take the first part
final_package = package_name.split('/')[0]
error_obj = {
"type": "npm-missing",
"package": final_package,
"message": line.strip(),
"timestamp": time.time()
}
// Clear any error tracking files
try {
await global.activeSandbox.runCommand({
cmd: 'bash',
args: ['-c', 'echo \'{"errors": [], "lastChecked": '+ Date.now() +'}\' > /tmp/vite-errors.json']
});
} catch (error) {
// Ignore if this fails
}
# Avoid duplicates
if not any(e['package'] == error_obj['package'] for e in data['errors']):
data['errors'].append(error_obj)
// Start Vite dev server in detached mode
const viteProcess = await global.activeSandbox.runCommand({
cmd: 'npm',
args: ['run', 'dev'],
detached: true
});
with open(error_file, 'w') as f:
json.dump(data, f)
console.log('[restart-vite] Vite dev server restarted');
print(f"WARNING: Detected missing package: {error_obj['package']}")
except Exception as e:
print(f"Error parsing Vite error: {e}")
// Wait for Vite to start up
await new Promise(resolve => setTimeout(resolve, 3000));
# Start Vite with error monitoring
process = subprocess.Popen(
['npm', 'run', 'dev'],
stdout=subprocess.PIPE,
stderr=subprocess.PIPE,
text=True,
bufsize=1
)
# Start monitoring thread
monitor_thread = threading.Thread(target=monitor_output, args=(process, error_file))
monitor_thread.daemon = True
monitor_thread.start()
print("Vite restarted successfully!")
# Store process info for later
with open('/tmp/vite-process.pid', 'w') as f:
f.write(str(process.pid))
# Wait for Vite to fully start
time.sleep(5)
print("Vite is ready")
`);
return NextResponse.json({
success: true,
message: 'Vite restarted successfully'
message: 'Vite restarted successfully',
output: result.output
});
} catch (error) {
app/api/run-command/route.ts
+18 -19
View File
@@ -1,4 +1,5 @@
import { NextRequest, NextResponse } from 'next/server';
import { Sandbox } from '@e2b/code-interpreter';
// Get active sandbox from global state (in production, use a proper state management solution)
declare global {
@@ -25,32 +26,30 @@ export async function POST(request: NextRequest) {
console.log(`[run-command] Executing: ${command}`);
// Parse command and arguments
const commandParts = command.trim().split(/\s+/);
const cmd = commandParts[0];
const args = commandParts.slice(1);
const result = await global.activeSandbox.runCode(`
import subprocess
import os
// Execute command using Vercel Sandbox
const result = await global.activeSandbox.runCommand({
cmd,
args
});
os.chdir('/home/user/app')
result = subprocess.run(${JSON.stringify(command.split(' '))},
capture_output=True,
text=True,
shell=False)
// Get output streams
const stdout = await result.stdout();
const stderr = await result.stderr();
print("STDOUT:")
print(result.stdout)
if result.stderr:
print("\\nSTDERR:")
print(result.stderr)
print(f"\\nReturn code: {result.returncode}")
`);
const output = [
stdout ? `STDOUT:\n${stdout}` : '',
stderr ? `\nSTDERR:\n${stderr}` : '',
`\nExit code: ${result.exitCode}`
].filter(Boolean).join('');
const output = result.logs.stdout.join('\n');
return NextResponse.json({
success: true,
output,
exitCode: result.exitCode,
message: result.exitCode === 0 ? 'Command executed successfully' : 'Command completed with non-zero exit code'
message: 'Command executed successfully'
});
} catch (error) {
app/api/sandbox-logs/route.ts
+37 -52
View File
@@ -15,69 +15,54 @@ export async function GET(request: NextRequest) {
console.log('[sandbox-logs] Fetching Vite dev server logs...');
// Check if Vite processes are running
const psResult = await global.activeSandbox.runCommand({
cmd: 'ps',
args: ['aux']
});
// Get the last N lines of the Vite dev server output
const result = await global.activeSandbox.runCode(`
import subprocess
import os
let viteRunning = false;
let logContent: string[] = [];
# Try to get the Vite process output
try:
# Read the last 100 lines of any log files
log_content = []
if (psResult.exitCode === 0) {
const psOutput = await psResult.stdout();
const viteProcesses = psOutput.split('\n').filter(line =>
line.toLowerCase().includes('vite') ||
line.toLowerCase().includes('npm run dev')
);
# Check if there are any node processes running
ps_result = subprocess.run(['ps', 'aux'], capture_output=True, text=True)
vite_processes = [line for line in ps_result.stdout.split('\\n') if 'vite' in line.lower()]
viteRunning = viteProcesses.length > 0;
if vite_processes:
log_content.append("Vite is running")
else:
log_content.append("Vite process not found")
if (viteRunning) {
logContent.push("Vite is running");
logContent.push(...viteProcesses.slice(0, 3)); // Show first 3 processes
} else {
logContent.push("Vite process not found");
}
}
# Try to capture recent console output (this is a simplified approach)
# In a real implementation, you'd want to capture the Vite process output directly
print(json.dumps({
"hasErrors": False,
"logs": log_content,
"status": "running" if vite_processes else "stopped"
}))
except Exception as e:
print(json.dumps({
"hasErrors": True,
"logs": [str(e)],
"status": "error"
}))
`);
// Try to read any recent log files
try {
const findResult = await global.activeSandbox.runCommand({
cmd: 'find',
args: ['/tmp', '-name', '*vite*', '-name', '*.log', '-type', 'f']
const logData = JSON.parse(result.output || '{}');
return NextResponse.json({
success: true,
...logData
});
if (findResult.exitCode === 0) {
const logFiles = (await findResult.stdout()).split('\n').filter(f => f.trim());
for (const logFile of logFiles.slice(0, 2)) {
try {
const catResult = await global.activeSandbox.runCommand({
cmd: 'tail',
args: ['-n', '10', logFile]
});
if (catResult.exitCode === 0) {
const logFileContent = await catResult.stdout();
logContent.push(`--- ${logFile} ---`);
logContent.push(logFileContent);
}
} catch (error) {
// Skip if can't read log file
}
}
}
} catch (error) {
// No log files found, that's OK
}
} catch {
return NextResponse.json({
success: true,
hasErrors: false,
logs: logContent,
status: viteRunning ? 'running' : 'stopped'
logs: [result.output],
status: 'unknown'
});
}
} catch (error) {
console.error('[sandbox-logs] Error:', error);
components/SandboxPreview.tsx
+16 -21
View File
@@ -1,24 +1,32 @@
import { useState } from 'react';
import { useState, useEffect } from 'react';
import { Loader2, ExternalLink, RefreshCw, Terminal } from 'lucide-react';
interface SandboxPreviewProps {
sandboxId: string;
port: number;
type: 'vite' | 'nextjs' | 'console';
output?: string;
isLoading?: boolean;
sandboxUrl?: string; // Real URL from Vercel Sandbox API
}
export default function SandboxPreview({
sandboxId,
port,
type,
output,
isLoading = false,
sandboxUrl
isLoading = false
}: SandboxPreviewProps) {
const [previewUrl, setPreviewUrl] = useState<string>('');
const [showConsole, setShowConsole] = useState(false);
const [iframeKey, setIframeKey] = useState(0);
// Use the real sandbox URL passed from the API
const previewUrl = sandboxUrl || '';
useEffect(() => {
if (sandboxId && type !== 'console') {
// In production, this would be the actual E2B sandbox URL
// Format: https://{sandboxId}-{port}.e2b.dev
setPreviewUrl(`https://${sandboxId}-${port}.e2b.dev`);
}
}, [sandboxId, port, type]);
const handleRefresh = () => {
setIframeKey(prev => prev + 1);
@@ -42,13 +50,9 @@ export default function SandboxPreview({
<span className="text-sm text-gray-400">
{type === 'vite' ? '⚡ Vite' : '▲ Next.js'} Preview
</span>
{previewUrl ? (
<code className="text-xs bg-gray-900 px-2 py-1 rounded text-blue-400">
{previewUrl}
</code>
) : (
<span className="text-xs text-gray-500">Waiting for sandbox URL...</span>
)}
</div>
<div className="flex items-center gap-2">
<button
@@ -65,7 +69,6 @@ export default function SandboxPreview({
>
<RefreshCw className="w-4 h-4" />
</button>
{previewUrl && (
<a
href={previewUrl}
target="_blank"
@@ -75,29 +78,22 @@ export default function SandboxPreview({
>
<ExternalLink className="w-4 h-4" />
</a>
)}
</div>
</div>
{/* Main Preview */}
<div className="relative bg-gray-900 rounded-lg overflow-hidden border border-gray-700">
{(isLoading || !previewUrl) && (
{isLoading && (
<div className="absolute inset-0 bg-gray-900/80 flex items-center justify-center z-10">
<div className="text-center">
<Loader2 className="w-8 h-8 animate-spin mx-auto mb-2" />
<p className="text-sm text-gray-400">
{!previewUrl
? 'Setting up sandbox environment...'
: type === 'vite'
? 'Starting Vite dev server...'
: 'Starting Next.js dev server...'
}
{type === 'vite' ? 'Starting Vite dev server...' : 'Starting Next.js dev server...'}
</p>
</div>
</div>
)}
{previewUrl && (
<iframe
key={iframeKey}
src={previewUrl}
@@ -105,7 +101,6 @@ export default function SandboxPreview({
title={`${type} preview`}
sandbox="allow-scripts allow-same-origin allow-forms"
/>
)}
</div>
{/* Console Output (Toggle) */}
config/app.config.ts
+11 -14
View File
@@ -2,30 +2,27 @@
// This file contains all configurable settings for the application
export const appConfig = {
// Vercel Sandbox Configuration
vercelSandbox: {
// E2B Sandbox Configuration
e2b: {
// Sandbox timeout in minutes
timeoutMinutes: 15,
// Convert to milliseconds for Vercel Sandbox API
// Convert to milliseconds for E2B API
get timeoutMs() {
return this.timeoutMinutes * 60 * 1000;
},
// Development server port (Vercel Sandbox typically uses 3000 for Next.js/React)
devPort: 3000,
// Vite development server port
vitePort: 5173,
// Time to wait for dev server to be ready (in milliseconds)
devServerStartupDelay: 7000,
// Time to wait for Vite to be ready (in milliseconds)
viteStartupDelay: 7000,
// Time to wait for CSS rebuild (in milliseconds)
cssRebuildDelay: 2000,
// Working directory in sandbox
workingDirectory: '/app',
// Default runtime for sandbox
runtime: 'node22' // Available: node22, python3.13, v0-next-shadcn, cua-ubuntu-xfce
// Default sandbox template (if using templates)
defaultTemplate: undefined, // or specify a template ID
},
// AI Model Configuration
@@ -38,7 +35,7 @@ export const appConfig = {
'openai/gpt-5',
'moonshotai/kimi-k2-instruct',
'anthropic/claude-sonnet-4-20250514',
'google/gemini-2.0-flash-exp'
'google/gemini-2.5-pro'
],
// Model display names
@@ -46,7 +43,7 @@ export const appConfig = {
'openai/gpt-5': 'GPT-5',
'moonshotai/kimi-k2-instruct': 'Kimi K2 Instruct',
'anthropic/claude-sonnet-4-20250514': 'Sonnet 4',
'google/gemini-2.0-flash-exp': 'Gemini 2.0 Flash (Experimental)'
'google/gemini-2.5-pro': 'Gemini 2.5 Pro'
},
// Temperature settings for non-reasoning models
docs/PACKAGE_DETECTION_GUIDE.md
+27 -21
View File
@@ -1,10 +1,10 @@
# Package Detection and Installation Guide
This document explains how to use the XML-based package detection and installation mechanism in the Vercel Sandbox environment.
This document explains how to use the XML-based package detection and installation mechanism in the E2B sandbox environment.
## Overview
The Vercel Sandbox can automatically detect and install packages from XML tags in AI-generated code responses. This mechanism works alongside the existing file detection system.
The E2B sandbox can automatically detect and install packages from XML tags in AI-generated code responses. This mechanism works alongside the existing file detection system.
## XML Tag Formats
@@ -196,37 +196,43 @@ Directly installs packages in the sandbox.
3. **Order matters**: Packages are installed before files are created
4. **Use commands** for post-installation tasks like building or testing
## Integration with Vercel Sandbox
## Integration with E2B Sandbox
The package detection mechanism integrates seamlessly with the Vercel Sandbox:
The package detection mechanism integrates seamlessly with the E2B sandbox:
1. Packages are installed in the sandbox's working directory
2. The development server is automatically restarted after package installation
1. Packages are installed in `/home/user/app/node_modules`
2. The Vite dev server is automatically restarted after package installation
3. All npm operations run within the sandbox environment
4. Package.json is automatically updated with new dependencies
## Vercel Sandbox Command Execution Methods
## E2B Command Execution Methods
### Using runCommand() (Recommended)
### Method 1: Using runCode() with Python subprocess
```javascript
// Direct command execution using Vercel Sandbox API
const result = await global.activeSandbox.runCommand({
cmd: 'npm',
args: ['install', 'axios']
// Current implementation pattern
await global.activeSandbox.runCode(`
import subprocess
import os
os.chdir('/home/user/app')
result = subprocess.run(['npm', 'install', 'axios'], capture_output=True, text=True)
print(result.stdout)
`);
```
### Method 2: Using commands.run() directly (Recommended)
```javascript
// Direct command execution - cleaner approach
const result = await global.activeSandbox.commands.run('npm install axios', {
cwd: '/home/user/app',
timeout: 60000
});
const stdout = await result.stdout();
const stderr = await result.stderr();
console.log(stdout);
console.log(result.stdout);
```
### Command Execution Options
When using `sandbox.runCommand()`, you can specify:
- `cmd`: The command to execute
- `args`: Array of arguments
- `detached`: Run in background (for long-running processes)
- `stdout`: Stream for capturing stdout
- `stderr`: Stream for capturing stderr
When using `sandbox.commands.run()`, you can specify:
- `cmd`: Command string to execute
- `background`: Run in background (true) or wait for completion (false)
- `envs`: Environment variables as key-value pairs
env.sample
-21
View File
@@ -1,21 +0,0 @@
# Required
FIRECRAWL_API_KEY=your_firecrawl_api_key # Get from https://firecrawl.dev (Web scraping)
# Vercel Sandbox Authentication (choose one method)
# See: https://vercel.com/docs/vercel-sandbox#authentication
# Method 1: OIDC Token (recommended for development)
# Run `vercel env pull` to get VERCEL_OIDC_TOKEN automatically
# VERCEL_OIDC_TOKEN=auto_generated_by_vercel_env_pull
# Method 2: Personal Access Token (for production or when OIDC unavailable)
# Get these values from your Vercel dashboard
# VERCEL_TEAM_ID=team_xxxxxxxxx
# VERCEL_PROJECT_ID=prj_xxxxxxxxx
# VERCEL_TOKEN=vercel_xxxxxxxxxxxx
# Optional AI providers (need at least one)
ANTHROPIC_API_KEY=your_anthropic_api_key # Get from https://console.anthropic.com
OPENAI_API_KEY=your_openai_api_key # Get from https://platform.openai.com (GPT-5)
GEMINI_API_KEY=your_gemini_api_key # Get from https://aistudio.google.com/app/apikey
GROQ_API_KEY=your_groq_api_key # Get from https://console.groq.com (Fast inference)
package-lock.json
Generated
+612 -159
View File
File diff suppressed because it is too large Load Diff
package.json
+3 -2
View File
@@ -8,6 +8,7 @@
"build": "next build",
"start": "next start",
"lint": "next lint",
"test:integration": "node tests/e2b-integration.test.js",
"test:api": "node tests/api-endpoints.test.js",
"test:code": "node tests/code-execution.test.js",
"test:all": "npm run test:integration && npm run test:api && npm run test:code"
@@ -18,7 +19,7 @@
"@ai-sdk/groq": "^2.0.0",
"@ai-sdk/openai": "^2.0.4",
"@anthropic-ai/sdk": "^0.57.0",
"@vercel/sandbox": "^0.0.17",
"@e2b/code-interpreter": "^1.5.1",
"@radix-ui/react-slot": "^1.2.3",
"@radix-ui/react-switch": "^1.2.5",
"@types/react-syntax-highlighter": "^15.5.13",
@@ -28,7 +29,7 @@
"clsx": "^2.1.1",
"cors": "^2.8.5",
"dotenv": "^17.2.1",
"e2b": "^1.13.2",
"framer-motion": "^12.23.12",
"groq-sdk": "^0.29.0",
"lucide-react": "^0.532.0",