feat: add interactive tool playground with AI-powered execution
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>
This commit is contained in:
parent
6d967f3501
commit
ab46b6e116
15 changed files with 1462 additions and 4 deletions
|
|
@ -11,15 +11,19 @@
|
|||
"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",
|
||||
|
|
@ -27,7 +31,8 @@
|
|||
"rehype-raw": "^7.0.0",
|
||||
"rehype-sanitize": "^6.0.0",
|
||||
"remark-gfm": "^4.0.1",
|
||||
"zod": "^3.24.1"
|
||||
"tiktoken": "^1.0.22",
|
||||
"zod": "^3.25.76"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tpmjs/eslint-config": "workspace:*",
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue