ab46b6e116
Implement comprehensive tool testing environment with real package execution, AI agents, and token tracking. **New Features:** - Interactive playground UI with 4 tabs (Input, Output, Logs, Token Usage) - Real npm package execution in VM2 sandbox with security constraints - AI-powered tool execution using AI SDK v5 and GPT-4 Turbo - Server-Sent Events (SSE) streaming for real-time progress updates - Comprehensive 4-category token tracking (Input, Tool Description, Schema, Output) - Visual token breakdown with colored progress bars - IP-based rate limiting (10 executions/hour per IP) - Database persistence of all simulations with full metadata **Database Schema:** - New `Simulation` model for execution records - New `TokenUsage` model for detailed token metrics - New `ExecutionLog` model for execution event tracking - Added simulations relation to Tool model **Package Executor (@tpmjs/package-executor):** - VM2 sandbox with 5-second timeout - Blocked dangerous modules (fs, net, http, https, child_process) - LRU file system cache in /tmp/.tpmjs-cache - Package installation and caching strategy **AI Agent Service:** - TPMJS parameter to Zod schema conversion - AI SDK tool definition generation - Token counting using tiktoken library - GPT-4 Turbo pricing estimation - Streaming text execution with callbacks **API Endpoints:** - POST /api/tools/[...slug]/execute - SSE streaming execution - GET /api/tools/[...slug]/simulations - Execution history - Rate limit headers (X-RateLimit-Limit, X-RateLimit-Remaining) **Frontend Components:** - ToolPlayground - Main playground UI with tabs - TokenBreakdown - Visual token metrics with colored bars - Integrated above README section on tool detail pages **Security:** - VM2 sandboxing prevents filesystem/network access - Rate limiting prevents abuse - IP tracking for usage monitoring - Timeout protection (60s max API duration, 5s VM timeout) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
51 lines
1.4 KiB
JSON
51 lines
1.4 KiB
JSON
{
|
|
"name": "@tpmjs/web",
|
|
"version": "0.0.0",
|
|
"private": true,
|
|
"scripts": {
|
|
"dev": "next dev",
|
|
"build": "next build",
|
|
"start": "next start",
|
|
"lint": "eslint .",
|
|
"type-check": "tsc --noEmit",
|
|
"clean": "rm -rf .next .turbo"
|
|
},
|
|
"dependencies": {
|
|
"@ai-sdk/openai": "^2.0.74",
|
|
"@tpmjs/db": "workspace:*",
|
|
"@tpmjs/env": "workspace:*",
|
|
"@tpmjs/npm-client": "workspace:*",
|
|
"@tpmjs/package-executor": "workspace:*",
|
|
"@tpmjs/types": "workspace:*",
|
|
"@tpmjs/ui": "workspace:*",
|
|
"@tpmjs/utils": "workspace:*",
|
|
"@types/react-syntax-highlighter": "^15.5.13",
|
|
"ai": "^5.0.104",
|
|
"next": "^16.0.4",
|
|
"next-themes": "^0.4.6",
|
|
"openai": "^6.9.1",
|
|
"react": "^19.0.0",
|
|
"react-dom": "^19.0.0",
|
|
"react-markdown": "^10.1.0",
|
|
"react-syntax-highlighter": "^16.1.0",
|
|
"rehype-raw": "^7.0.0",
|
|
"rehype-sanitize": "^6.0.0",
|
|
"remark-gfm": "^4.0.1",
|
|
"tiktoken": "^1.0.22",
|
|
"zod": "^3.25.76"
|
|
},
|
|
"devDependencies": {
|
|
"@tpmjs/eslint-config": "workspace:*",
|
|
"@tpmjs/tailwind-config": "workspace:*",
|
|
"@tpmjs/tsconfig": "workspace:*",
|
|
"@types/node": "^22.10.2",
|
|
"@types/react": "^19.0.2",
|
|
"@types/react-dom": "^19.0.2",
|
|
"autoprefixer": "^10.4.20",
|
|
"eslint": "^9.39.1",
|
|
"eslint-config-next": "^16.0.4",
|
|
"postcss": "^8.5.1",
|
|
"tailwindcss": "^3.4.17",
|
|
"typescript": "^5.9.3"
|
|
}
|
|
}
|