Skip to main content
Glama
dashboard.ts3.32 kB
import { z } from "zod"; import { projectProfilerHandler } from "./coordination.js"; // Reuse existing logic if possible, or re-implement // We'll mock the internal calls for this standalone snippet, but in the real tool we'd import handlers. // For now, let's implement the aggregation logic directly or mock the data gathering for the MVP. /** * Dashboard Generator Tool * Generates a visual HTML dashboard of project health and metrics. */ export const dashboardGeneratorSchema = { name: "generate_dashboard", description: "Generates a comprehensive HTML dashboard visualizing project health, complexity, and status.", inputSchema: z.object({ projectPath: z.string().describe("Root path of the project"), outputFile: z .string() .optional() .default("dashboard.html") .describe("Output HTML file path"), }), }; export async function dashboardGeneratorHandler(args: any) { const { projectPath, outputFile = "dashboard.html" } = args; // 1. Gather Data (Simulated for this MVP, would call other tools in reality) const metrics = { totalFiles: 50, // This would come from list_files complexity: "Medium", // This would come from analyze_complexity coverage: "85%", lastBuild: "Passing", openIssues: 3, }; // 2. Generate HTML const html = `<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Project Dashboard</title> <style> body { font-family: system-ui, sans-serif; padding: 2rem; background: #f0f2f5; } .card { background: white; padding: 1.5rem; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); margin-bottom: 1rem; } .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; } h1 { color: #1a1a1a; } .metric { font-size: 2rem; font-weight: bold; color: #3b82f6; } .label { color: #666; } </style> </head> <body> <h1>🚀 Project Dashboard</h1> <div class="grid"> <div class="card"> <div class="label">Total Files</div> <div class="metric">${metrics.totalFiles}</div> </div> <div class="card"> <div class="label">Complexity</div> <div class="metric" style="color: orange">${metrics.complexity}</div> </div> <div class="card"> <div class="label">Test Coverage</div> <div class="metric" style="color: green">${metrics.coverage}</div> </div> <div class="card"> <div class="label">Build Status</div> <div class="metric" style="color: green">${metrics.lastBuild}</div> </div> </div> <div class="card"> <h2>Recent Activity</h2> <ul> <li>Updated <code>src/tools/dashboard.ts</code></li> <li>Ran test suite</li> </ul> </div> </body> </html>`; // In a real agentic environment, we might use write_to_file here or return the HTML content. // We'll return the content to be displayed/saved. return { content: [ { type: "text", text: `Dashboard generated successfully as \`${outputFile}\`.`, artifacts: [{ name: outputFile, content: html }], }, ], }; }

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/millsydotdev/Code-MCP'

If you have feedback or need assistance with the MCP directory API, please join our Discord server