# 💡 Idea: Merge MCP-SuperAssistant vào n8n AI Agent Extension

## 📌 Phân loại
- **Type:** Feature (Mode C — Build)
- **Priority:** 🔥 High
- **Created:** 2026-04-28

## 🎯 Mô tả
Tích hợp hệ thống `render_prescript` (parse + render function_call blocks) và Adapter Plugin system từ MCP-SuperAssistant vào codebase n8n_ai_agent hiện tại. Mục tiêu: Khi user mở ChatGPT/Gemini trên Chrome, Extension tự nhận diện trang AI, parse MCP tool calls từ response, render thành UI buttons, và thực thi trực tiếp trên n8n thông qua McpService đã có sẵn.

## 🧠 Core Concept
- **ChatGPT/Gemini = Bộ não (AI Agent miễn phí)**
- **Extension = Cơ bắp (Tool Executor kết nối n8n)**
- **MCP Server = Cầu nối (JSON-RPC proxy tới n8n API)**

## 📐 Flow
1. User mở ChatGPT trên Chrome
2. Extension auto-detect → load ChatGPT adapter
3. User chat: "Tạo workflow n8n: Webhook → Filter → Slack"
4. ChatGPT trả lời kèm `function_call` (MCP tool)
5. Extension parse DOM → render nút "⚡ Execute"
6. User bấm → McpService.callTool() → n8n API tạo workflow
7. Kết quả insert ngược lại chat cho AI đọc tiếp

## 📦 Assets có sẵn
| Component | Source | Status |
|---|---|---|
| McpService.ts | n8n_ai_agent | ✅ Sẵn sàng |
| McpSettings.vue | n8n_ai_agent | ✅ Sẵn sàng |
| N8nPanel.vue | n8n_ai_agent | ✅ Sẵn sàng |
| bg/index.ts (mcpExecuteTool) | n8n_ai_agent | ✅ Sẵn sàng |
| render_prescript/ | MCP-SuperAssistant | 🔄 Cần port |
| base.adapter.ts | MCP-SuperAssistant | 🔄 Cần port |
| chatgpt.adapter.ts | MCP-SuperAssistant | 🔄 Cần port (53KB!) |
| plugin-registry.ts | MCP-SuperAssistant | 🔄 Cần port |

## ⚠️ Rủi ro
- ChatGPT adapter 53KB rất phức tạp, phụ thuộc vào DOM selectors có thể thay đổi
- MCP-SuperAssistant dùng React, codebase bro dùng Vue — cần bridge
- render_prescript phụ thuộc zustand stores — cần tách/thay thế
