feat: Add /tools page with centralized tool registry management

- Add ToolsPage for managing MCP tools activation and persistence
- Centralize all tool handlers in services/tools/handlers/
- toolRegistry.ts is now the single source of truth for tool state
- Add tools store for pinned tools (persisted in localStorage)
- Tools can be pinned to stay active across page navigation
- Remove old individual tool files, replaced by centralized handlers

frontend/src/services/tools/toolDefinitions.ts

@@ -0,0 +1,84 @@
+export type ToolCategory = 'global' | 'canvas' | 'component' | 'theme' | 'database' | 'source' | 'project'
+
+export interface ToolMeta {
+  name: string
+  description: string
+  category: ToolCategory
+}
+
+// All tool metadata (name, description, category)
+export const ALL_TOOL_METAS: ToolMeta[] = [
+  // Global tools
+  { name: 'get_current_page', description: 'Obtiene la pagina actualmente activa', category: 'global' },
+  { name: 'navigate_to', description: 'Navega a una pagina especifica', category: 'global' },
+  { name: 'list_available_tools', description: 'Lista todas las herramientas MCP disponibles', category: 'global' },
+
+  // Canvas tools
+  { name: 'render_html', description: 'Renderiza HTML en el canvas', category: 'canvas' },
+  { name: 'render_vue_component', description: 'Renderiza un componente Vue 3 completo', category: 'canvas' },
+
+  // Component tools
+  { name: 'save_vue_component', description: 'Guarda un componente Vue en la base de datos', category: 'component' },
+  { name: 'load_vue_component', description: 'Carga y renderiza un componente guardado', category: 'component' },
+  { name: 'list_vue_components', description: 'Lista componentes guardados', category: 'component' },
+  { name: 'delete_vue_component', description: 'Elimina un componente', category: 'component' },
+
+  // Theme tools
+  { name: 'get_design_tokens', description: 'Obtiene los design tokens del tema activo', category: 'theme' },
+  { name: 'get_active_theme', description: 'Obtiene info del tema activo', category: 'theme' },
+  { name: 'set_theme_variable', description: 'Modifica una variable CSS del tema', category: 'theme' },
+  { name: 'save_theme', description: 'Guarda el tema actual', category: 'theme' },
+  { name: 'list_themes', description: 'Lista todos los temas disponibles', category: 'theme' },
+  { name: 'switch_theme', description: 'Cambia al tema especificado', category: 'theme' },
+  { name: 'reset_theme', description: 'Descarta cambios no guardados', category: 'theme' },
+
+  // Database tools
+  { name: 'list_tables', description: 'Lista todas las tablas de la base de datos', category: 'database' },
+  { name: 'get_table_schema', description: 'Obtiene el esquema de una tabla', category: 'database' },
+  { name: 'get_table_data', description: 'Obtiene los datos de una tabla', category: 'database' },
+  { name: 'get_database_stats', description: 'Obtiene estadisticas de la base de datos', category: 'database' },
+  { name: 'execute_query', description: 'Ejecuta una consulta SQL SELECT', category: 'database' },
+
+  // Source code tools
+  { name: 'get_repo_info', description: 'Obtiene info del repositorio Gitea', category: 'source' },
+  { name: 'list_repo_files', description: 'Lista archivos del repositorio', category: 'source' },
+  { name: 'read_repo_file', description: 'Lee contenido de un archivo', category: 'source' },
+  { name: 'search_repo_code', description: 'Busca codigo en el repositorio', category: 'source' },
+
+  // Project canvas tools
+  { name: 'list_canvases', description: 'Lista todos los canvas disponibles', category: 'project' },
+  { name: 'create_canvas', description: 'Crea un nuevo project canvas', category: 'project' },
+  { name: 'get_canvas', description: 'Obtiene detalles de un canvas', category: 'project' },
+  { name: 'update_canvas', description: 'Actualiza un canvas existente', category: 'project' },
+  { name: 'delete_canvas', description: 'Elimina un canvas', category: 'project' },
+  { name: 'clone_canvas', description: 'Clona un canvas existente', category: 'project' },
+  { name: 'add_component_to_canvas', description: 'Agrega un componente a un canvas', category: 'project' },
+  { name: 'remove_component_from_canvas', description: 'Remueve un componente de un canvas', category: 'project' },
+  { name: 'get_canvas_components', description: 'Obtiene los componentes de un canvas', category: 'project' }
+]
+
+// Get all tool names
+export function getAllToolNames(): string[] {
+  return ALL_TOOL_METAS.map(t => t.name)
+}
+
+// Get tool metadata by name
+export function getToolMeta(name: string): ToolMeta | undefined {
+  return ALL_TOOL_METAS.find(t => t.name === name)
+}
+
+// Get tools by category
+export function getToolsByCategory(category: ToolCategory): ToolMeta[] {
+  return ALL_TOOL_METAS.filter(t => t.category === category)
+}
+
+// Category display info
+export const CATEGORY_INFO: Record<ToolCategory, { label: string; color: string; icon: string }> = {
+  global: { label: 'Global', color: '#6366f1', icon: 'M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2z' },
+  canvas: { label: 'Canvas', color: '#10b981', icon: 'M3 3h18v18H3V3z' },
+  component: { label: 'Component', color: '#f59e0b', icon: 'M21 16V8l-7-4-7 4v8l7 4 7-4z' },
+  theme: { label: 'Theme', color: '#ec4899', icon: 'M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10' },
+  database: { label: 'Database', color: '#3b82f6', icon: 'M12 2C7 2 3 3.5 3 5v14c0 1.5 4 3 9 3s9-1.5 9-3V5c0-1.5-4-3-9-3z' },
+  source: { label: 'Source', color: '#8b5cf6', icon: 'M16 18l6-6-6-6M8 6l-6 6 6 6' },
+  project: { label: 'Project', color: '#06b6d4', icon: 'M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z' }
+}