MCP Multi-Context Hook Generator

import path from 'path'; import fs from 'fs'; import { detectUIFramework } from '../utils/frameworkDetector'; import { loadMCPConfig } from '../ai/mcpAgent'; import { ApiRoute } from '@mcp-server/crawler/api'; import { getComponentTemplate } from '@mcp-server/mcp/templates/componentTemplates'; import { formatWithPrettier } from '@mcp-server/utils/formatter'; export async function generateComponent(route: ApiRoute, outDir = 'components') { const config = loadMCPConfig(); const framework = config.uiFramework === 'auto' || !config.uiFramework ? detectUIFramework() : config.uiFramework; const name = route.name.replace(/[^a-zA-Z0-9]/g, '') + 'Component'; const hookName = `use${route.name}`; const filePath = path.join(outDir, `${name}.tsx`); const template = getComponentTemplate(name, hookName, framework); const finalCode = formatWithPrettier(template); fs.mkdirSync(outDir, { recursive: true }); fs.writeFileSync(filePath, await finalCode, 'utf-8'); console.log(`✅ Generated component: ${filePath} [${framework}]`); }