@gishubperu/ghp 0.0.1

package/infrastructure/tools/tool-formatters.js

@@ -0,0 +1,110 @@
+// infrastructure/tools/ToolFormatters.js
+// Utility functions for formatting tool results in UI
+
+export class ToolFormatters {
+
+    static buildPreview(toolName, args) {
+        if (!args) return '';
+        
+        switch (toolName) {
+            case 'getServiceMetadata':
+                return 'leyendo estructura del servicio...';
+            
+            case 'createPDFReport':
+                return `generando PDF: ${args.title ?? args.filename ?? ''}`;
+            
+            case 'getArcGISData':
+                return this.#formatArcGISPreview(args);
+            
+            default:
+                return '';
+        }
+    }
+
+    static #formatArcGISPreview(args) {
+        if (args.returnCountOnly) {
+            return 'contando registros...';
+        }
+        if (args.returnDistinctValues) {
+            return `valores únicos de ${args.outFields ?? 'campo'}`;
+        }
+        if (args.outStatistics) {
+            let stat = [];
+            try { stat = JSON.parse(args.outStatistics); } catch {}
+            const tipos = [...new Set(stat.map(s => s.statisticType))].join('/');
+            const grupo = args.groupByFieldsForStatistics ? ` por ${args.groupByFieldsForStatistics}` : '';
+            return `calculando ${tipos}${grupo}...`;
+        }
+        if (args.where && args.where !== '1=1') {
+            const w = args.where
+                .replace(/TXT_DEPARTAMENTO\s*IN\s*\(([^)]+)\)/i, (_, v) =>
+                    'dptos: ' + v.replace(/'/g,'').replace(/,\s*/g,', '))
+                .replace(/TXT_DEPARTAMENTO\s*=\s*'([^']+)'/i, 'dpto: $1')
+                .replace(/TXT_PROVINCIA\s*=\s*'([^']+)'/i,    'prov: $1')
+                .replace(/TXT_CULTIVO\s*LIKE\s*'%([^%']+)%'/i,'cultivo: ~$1')
+                .replace(/TXT_CULTIVO\s*=\s*'([^']+)'/i,      'cultivo: $1')
+                .replace(/AND/gi, '·').replace(/OR/gi, 'ó')
+                .replace(/\s+/g, ' ').trim();
+            const lim = args.resultRecordCount ? ` máx ${args.resultRecordCount}` : '';
+            return (w + lim).slice(0, 65);
+        }
+        return args.resultRecordCount ? `primeros ${args.resultRecordCount} registros` : 'consulta general...';
+    }
+
+    static buildSummary(toolName, result) {
+        if (!result) return 'listo';
+        
+        if (result.error || result.code === 400) {
+            return '⚠ parámetros de consulta inválidos';
+        }
+
+        switch (toolName) {
+            case 'getServiceMetadata':
+                return `${result.fields?.length ?? 0} campos disponibles`;
+            
+            case 'createPDFReport':
+                return result.message ?? result.path ?? 'PDF generado';
+            
+            case 'getArcGISData':
+                return this.#formatArcGISSummary(result);
+            
+            default:
+                if (result.count != null) {
+                    return `${Number(result.count).toLocaleString('es-PE')} registros encontrados`;
+                }
+                if (Array.isArray(result)) {
+                    return `${result.length} registros`;
+                }
+                if (result.message) return result.message;
+                if (result.path)    return result.path;
+                if (result.fields)  return `${result.fields.length} campos`;
+                return 'completado';
+        }
+    }
+
+    static #formatArcGISSummary(result) {
+        if (result.count != null) {
+            return `${Number(result.count).toLocaleString('es-PE')} registros encontrados`;
+        }
+        if (result.features != null) {
+            const n = result.features.length;
+            const extra = result.exceededTransferLimit ? ' (hay más, paginando...)' : '';
+            return `${n.toLocaleString('es-PE')} registros${extra}`;
+        }
+        return 'completado';
+    }
+
+    static buildDetail(result) {
+        if (!result?.features || result.features.length === 0) return null;
+        
+        return result.features.slice(0, 2).map(r =>
+            Object.entries(r)
+                .filter(([k]) => !k.match(/^(OBJECTID|FID|IDE_|Shape)/))
+                .slice(0, 4)
+                .map(([k, v]) => `${k.replace(/^(TXT_|NUM_|NOM_|FEC_)/,'')}: ${v ?? '-'}`)
+                .join('  ')
+        ).join('\n');
+    }
+}
+
+export default ToolFormatters;

package/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@gishubperu/ghp",
+  "version": "0.0.1",
+  "description": "GHP CLI - Multi-Agent",
+  "type": "module",
+  "main": "index.js",
+  "bin": {
+    "ghp": "./index.js",
+    "chy": "./index.js"
+  },
+  "scripts": {
+    "start": "node index.js",
+    "dev":   "node --watch index.js"
+  },
+  "dependencies": {
+    "@anthropic-ai/sdk": "^0.78.0",
+    "@google/generative-ai": "^0.24.1",
+    "axios": "^1.13.5",
+    "boxen":                 "^8.0.1",
+    "chalk": "^5.6.2",
+    "dotenv": "^17.3.1",
+    "figlet": "^1.10.0",
+    "ink": "^6.8.0",
+    "ink-select-input": "^6.2.0",
+    "ink-text-input":        "^6.0.0",
+    "openai": "^6.22.0",
+    "ora": "^9.3.0",
+    "pdfkit": "^0.17.2",
+    "quickchart-js": "^3.1.3",
+    "react": "^19.2.4"
+  }
+}

package/presentation/console/procedures/App.js

@@ -0,0 +1,424 @@
+// ui/App.js — GHP CLI, diseño Kilo Code exacto
+
+import React, { useState, useCallback, useEffect, useRef } from 'react';
+import { Box, Text, useApp, useInput, useStdout, Static } from 'ink';
+import SelectInput from 'ink-select-input';
+import TextInput   from 'ink-text-input';
+
+import { AGENT_LIST, AgentType } from '../../../infrastructure/constants/index.js';
+import { ToolFormatters } from '../../../infrastructure/tools/tool-formatters.js';
+
+
+const PKG = await import('../../../package.json', { with: { type: 'json' } });
+const APP_NAME = PKG.default.description;
+const APP_VERSION = PKG.default.version;
+
+// ── Toast para info de agente ────────────────────────────────────────────────
+function Toast({ message, type = 'info', onClose }) {
+    useEffect(() => {
+        const timer = setTimeout(() => onClose?.(), 3000);
+        return () => clearTimeout(timer);
+    }, [onClose]);
+
+    const colors = {
+        info:    { bg: 'cyan',    text: 'black' },
+        success: { bg: 'green',   text: 'black' },
+        warning: { bg: 'yellow',  text: 'black' },
+        error:   { bg: 'red',     text: 'white' },
+    };
+    const color = colors[type] || colors.info;
+
+    return React.createElement(Box, {
+        borderStyle: 'round',
+        borderColor: color.bg,
+        paddingX: 1,
+        marginY: 0,
+    },
+        React.createElement(Text, { bold: true, color: color.text, backgroundColor: color.bg }, ' '),
+        React.createElement(Text, { color: 'white', marginLeft: 1 }, message)
+    );
+}
+
+// ── Spinner ───────────────────────────────────────────────────────────────────
+const SPINNER_FRAMES = ['⠋','⠙','⠹','⠸','⠼','⠴','⠦','⠧','⠇','⠏'];
+function Spinner({ label }) {
+    const [frame, setFrame] = useState(0);
+    useEffect(() => {
+        const t = setInterval(() => setFrame(p => (p + 1) % SPINNER_FRAMES.length), 80);
+        return () => clearInterval(t);
+    }, []);
+    return React.createElement(Box, null,
+        React.createElement(Text, { color: 'cyan' }, SPINNER_FRAMES[frame] + ' '),
+        React.createElement(Text, { color: 'white' }, label)
+    );
+}
+
+
+// ── Logo ASCII ────────────────────────────────────────────────────────────────
+const LOGO = [
+    ' ██████╗ ██╗  ██╗██████╗      ██████╗██╗     ██╗',
+    '██╔════╝ ██║  ██║██╔══██╗    ██╔════╝██║     ██║',
+    '██║  ███╗███████║██████╔╝    ██║     ██║     ██║',
+    '██║   ██║██╔══██║██╔═══╝     ██║     ██║     ██║',
+    '╚██████╔╝██║  ██║██║         ╚██████╗███████╗██║',
+    ' ╚═════╝ ╚═╝  ╚═╝╚═╝          ╚═════╝╚══════╝╚═╝',
+];
+
+// ── Mensaje ───────────────────────────────────────────────────────────────────
+function Msg({ msg }) {
+    switch (msg.role) {
+        case 'user':
+            return React.createElement(Box, { flexDirection: 'column', marginBottom: 1 },
+                React.createElement(Box, null,
+                    React.createElement(Text, { backgroundColor: 'yellow', color: 'black', bold: true }, ' Ask '),
+                    React.createElement(Text, { color: 'white' }, '  ' + msg.text)
+                )
+            );
+
+        case 'thinking':
+            return React.createElement(Box, { marginBottom: 0, marginLeft: 2 },
+                React.createElement(Text, { color: 'cyan', italic: true }, 'Thinking: '),
+                React.createElement(Text, { color: 'gray', wrap: 'wrap' }, msg.text)
+            );
+
+        case 'assistant':
+            return React.createElement(Box, { flexDirection: 'column', marginBottom: 1 },
+                React.createElement(Text, { color: 'gray', dimColor: true },
+                    '  ' + (msg.model ?? '') + '  ·  ' + (msg.elapsed ?? '')
+                ),
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: 'white', wrap: 'wrap' }, msg.text)
+                )
+            );
+
+        case 'tool_start':
+            return React.createElement(Box, { marginBottom: 0, marginLeft: 2 },
+                React.createElement(Text, { color: 'gray' }, '$ '),
+                React.createElement(Text, { color: 'cyan', bold: true }, msg.toolName),
+                React.createElement(Text, { color: 'gray' }, msg.preview ? '  ' + msg.preview : '')
+            );
+
+        case 'tool_done':
+            return React.createElement(Box, { flexDirection: 'column', marginBottom: 1, marginLeft: 2 },
+                React.createElement(Box, null,
+                    React.createElement(Text, { color: 'green' }, '✓ '),
+                    React.createElement(Text, { color: 'cyan' }, msg.toolName),
+                    React.createElement(Text, { color: 'gray' }, '  ' + msg.summary)
+                ),
+                msg.detail && React.createElement(Text, {
+                    color: 'gray', dimColor: true, wrap: 'wrap'
+                }, '  ' + msg.detail)
+            );
+
+        case 'error':
+            return React.createElement(Box, { marginBottom: 1 },
+                React.createElement(Text, { color: 'red' }, '  ✗  ' + msg.text)
+            );
+
+        case 'system':
+            return React.createElement(Box, { marginBottom: 1 },
+                React.createElement(Text, { color: 'gray' }, '  ' + msg.text)
+            );
+
+        default: return null;
+    }
+}
+
+// ── Selector de modelo ────────────────────────────────────────────────────────
+function ModelSelector({ router, onClose }) {
+    const models = router.listAvailable();
+    const freeModels = models.filter(m => m.free);
+    const paidModels = models.filter(m => !m.free);
+    const selectItems = [
+        ...freeModels.map((m, i) => ({ label: m.name ?? m.id, value: m, hint: 'free', key: 'f' + i })),
+        ...paidModels.map((m, i) => ({ label: m.name ?? m.id, value: m, hint: '',     key: 'p' + i })),
+    ];
+
+    useInput((_c, k) => { if (k.escape) onClose(null); });
+
+    return React.createElement(Box, {
+        flexDirection: 'column',
+        borderStyle: 'single', borderColor: 'yellow',
+        paddingX: 1, marginX: 0,
+    },
+        React.createElement(Box, { marginBottom: 1, justifyContent: 'space-between' },
+            React.createElement(Text, { bold: true, color: 'white' }, 'Select model'),
+            React.createElement(Text, { color: 'gray' }, '↑↓ navegar  Enter seleccionar  Esc cancelar')
+        ),
+        React.createElement(Box, { marginBottom: 1 },
+            React.createElement(Text, { color: 'green', bold: true }, `${freeModels.length} free  `),
+            React.createElement(Text, { color: 'gray' }, `${paidModels.length} paid`)
+        ),
+        React.createElement(SelectInput, {
+            items: selectItems,
+            onSelect: item => onClose(item.value),
+            limit: 14,
+            itemComponent: ({ isSelected, label, hint }) =>
+                React.createElement(Box, null,
+                    React.createElement(Text, {
+                        backgroundColor: isSelected ? 'yellow' : undefined,
+                        color:           isSelected ? 'black'  : 'white',
+                        bold:            isSelected,
+                    }, (isSelected ? ' ● ' : '   ') + label),
+                    hint === 'free' && React.createElement(Text, {
+                        backgroundColor: isSelected ? 'yellow' : undefined,
+                        color: isSelected ? 'black' : 'green',
+                    }, ' (free)')
+                ),
+            indicatorComponent: () => null,
+        })
+    );
+}
+
+// ── App ───────────────────────────────────────────────────────────────────────
+export function App({ orchestrator, router, memory }) {
+    const { exit }   = useApp();
+    const { stdout } = useStdout();
+
+    const [mode,     setMode]     = useState('banner');
+    const [input,    setInput]    = useState('');
+    const [messages, setMessages] = useState([]);
+    const [status,   setStatus]   = useState('');
+    const [agentIndex, setAgentIndex] = useState(0);
+    const [toast, setToast] = useState(null);
+    const startRef = useRef(null);
+    const abortRef = useRef(null);
+
+    const currentAgent = AGENT_LIST[agentIndex];
+
+    const availableModels = router.listAvailable();
+    const freeModelCount  = availableModels.filter(m => m.free).length;
+    const activeModel     = router.getActive();
+    const modelLabel      = activeModel
+        ? (activeModel.model.includes('/') ? activeModel.model.split('/').slice(1).join('/') : activeModel.model)
+        : 'Auto';
+
+    useInput((ch, key) => {
+        if (key.escape) {
+            if (mode === 'model-select') {
+                // Cerrar selector
+                setMode(messages.length === 0 ? 'banner' : 'chat');
+                return;
+            }
+            if (mode === 'thinking') {
+                // CANCELAR proceso en curso
+                abortRef.current?.abort();
+                return;
+            }
+            if (mode === 'chat') {
+                setInput('');  // limpiar input
+                return;
+            }
+        }
+        if (mode === 'model-select') return;
+        if (key.ctrl && key.name === 'k') { setMode('model-select'); return; }
+        if (key.tab) {
+            const newIndex = (agentIndex + 1) % AGENT_LIST.length;
+            setAgentIndex(newIndex);
+            const agent = AGENT_LIST[newIndex];
+            setToast({ message: `${agent.label}: ${agent.description}`, type: 'info', key: Date.now() });
+            return;
+        }
+    });
+
+    const showAgentToast = useCallback(() => {
+        const agent = AGENT_LIST[agentIndex];
+        setToast({ message: `${agent.label}: ${agent.description}`, type: 'info', key: Date.now() });
+    }, [agentIndex]);
+
+    const addMsg = useCallback(msg =>
+        setMessages(prev => [...prev, { ...msg, id: Date.now() + Math.random() }])
+    , []);
+
+    const onModelSelected = useCallback(selected => {
+        if (selected) {
+            try {
+                router.setModelFromMenu(selected);
+                addMsg({ role: 'system', text: `✓ Modelo → ${selected.name ?? selected.id}` });
+            } catch (e) { addMsg({ role: 'error', text: e.message }); }
+        }
+        setMode(messages.length === 0 ? 'banner' : 'chat');
+    }, [router, addMsg, messages.length]);
+
+    const onSubmit = useCallback(async value => {
+        const text = value.trim();
+        if (!text) return;
+        setInput('');
+        
+        if (mode !== 'chat') {
+            setMode('chat');
+            const agent = AGENT_LIST[agentIndex];
+            setToast({ message: `${agent.label}: ${agent.description}`, type: 'info', key: Date.now() });
+        }
+
+        if (text === '/exit')    { exit(); return; }
+        if (text === '/model')   { setMode('model-select'); return; }
+        if (text === '/auto')    { router.setAuto(); addMsg({ role: 'system', text: '✓ Auto activado' }); return; }
+        if (text === '/clear')   { await memory.clear(); addMsg({ role: 'system', text: '✓ Memoria borrada' }); return; }
+        if (text === '/history') {
+            const es = await memory.recent(5);
+            if (!es.length) { addMsg({ role: 'system', text: 'Sin historial.' }); return; }
+            es.forEach(e => addMsg({ role: 'system', text: `[${e.timestamp.slice(0,16).replace('T',' ')}] ${e.input.slice(0,70)}` }));
+            return;
+        }
+        if (text === '/help') {
+            addMsg({ role: 'system', text:
+                '/model  →  selector de modelo\n' +
+                '/auto            →  modo automático\n' +
+                '/clear           →  borrar memoria\n' +
+                '/history         →  últimas conversaciones\n' +
+                '/exit            →  salir'
+            });
+            return;
+        }
+
+        addMsg({ role: 'user', text });
+        setMode('thinking');
+        setStatus('Procesando...');
+        startRef.current = Date.now();
+        abortRef.current = new AbortController();
+
+        try {
+            const currentAgent = AGENT_LIST[agentIndex];
+        const result = await orchestrator.run(text, {
+                agentId: currentAgent.id,
+                signal:  abortRef.current.signal,
+                onProgress: ({ type, toolName, toolArgs, toolResult }) => {
+                    if (type === 'planning')     setStatus('Planificando...');
+                    if (type === 'synthesizing') setStatus('Sintetizando...');
+                    if (type === 'tool_start') {
+                        setStatus(`Ejecutando ${toolName}...`);
+                        addMsg({ role: 'tool_start', toolName, preview: ToolFormatters.buildPreview(toolName, toolArgs) });
+                    }
+                    if (type === 'tool_done') {
+                        setStatus('Procesando...');
+                        addMsg({ role: 'tool_done', toolName,
+                            summary: ToolFormatters.buildSummary(toolName, toolResult),
+                            detail:  ToolFormatters.buildDetail(toolResult),
+                        });
+                    }
+                },
+            });
+
+            const elapsed = ((Date.now() - startRef.current) / 1000).toFixed(1) + 's';
+            addMsg({ role: 'assistant', text: result.text, model: result.model, elapsed });
+        } catch (err) {
+            if (err.name === 'AbortError' || err.message?.includes('aborted')) {
+                addMsg({ role: 'system', text: '⊘ Proceso cancelado' });
+            } else {
+                addMsg({ role: 'error', text: err.message });
+            }
+        }
+
+        setStatus('');
+        setMode('chat');
+    }, [orchestrator, router, memory, exit, addMsg]);
+
+    // ── Barra inferior (siempre fija) ─────────────────────────────────────────
+    const BottomBar = () => React.createElement(Box, {
+        flexDirection: 'column',
+        borderStyle: 'single', borderColor: 'gray',
+        paddingLeft: 1, paddingRight: 1,
+    },
+        // Línea 1: input
+        React.createElement(Box, null,
+            React.createElement(Text, {
+                backgroundColor: 'yellow', color: 'black', bold: true
+            }, ' Ask '),
+            React.createElement(Text, { color: 'gray' }, '  '),
+            (mode === 'chat' || mode === 'banner')
+                ? React.createElement(TextInput, {
+                    value: input, onChange: setInput, onSubmit: onSubmit,
+                    placeholder: 'Ask anything...  ""',
+                })
+                : React.createElement(Text, { color: 'gray', dimColor: true },
+                    'Ask anything...  ""')
+        ),
+        // Línea 2: agente activo + modelo + shortcuts
+        React.createElement(Box, { justifyContent: 'space-between' },
+            React.createElement(Box, null,
+                React.createElement(Text, {
+                    backgroundColor: 'yellow', color: 'black', bold: true
+                }, ' Ask '),
+                React.createElement(Text, { color: 'gray' }, '  '),
+                React.createElement(Text, {
+                    color: AGENT_LIST[agentIndex].color, bold: true
+                }, AGENT_LIST[agentIndex].label + ' '),
+                React.createElement(Text, { color: 'cyan' }, modelLabel + ' '),
+                React.createElement(Text, { color: 'gray' }, 'GHP Gateway')
+            ),
+            React.createElement(Text, { color: 'gray' },
+                'tab agente  ctrl+k modelo  esc cancelar  ctrl+c salir')
+        )
+    );
+
+    // ── Layout principal ──────────────────────────────────────────────────────
+    const terminalRows = stdout.terminalRows || 24;
+    // Banner top padding: center vertically, minus logo(8) + info(2) + bottombar(3)
+    const bannerTopPad = Math.max(1, Math.floor((terminalRows - 13) / 2));
+
+    return React.createElement(Box, { flexDirection: 'column' },
+        // Zona de contenido
+        React.createElement(Box, { flexDirection: 'column' },
+
+            // Banner (solo al inicio)
+            mode === 'banner' && React.createElement(Box, {
+                flexDirection: 'column', alignItems: 'center',
+                paddingTop: bannerTopPad, paddingBottom: 2,
+            },
+                ...LOGO.map((l, i) =>
+                    React.createElement(Text, { key: i, color: 'yellow', bold: true }, l)
+                ),
+                React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { color: 'green', bold: true }, `${freeModelCount} free models  `),
+                    React.createElement(Text, { color: 'gray' }, `${availableModels.length} total  GHP Gateway  ${APP_NAME} v${APP_VERSION}`)
+                ),
+                // Agent pills — Tab para cambiar
+                React.createElement(Box, { marginTop: 2, gap: 1 },
+                    ...AGENT_LIST.map((a, i) =>
+                        React.createElement(Text, {
+                            key: a.id,
+                            backgroundColor: i === agentIndex ? 'yellow' : undefined,
+                            color:           i === agentIndex ? 'black'  : a.color,
+                            bold:            i === agentIndex,
+                        }, ` ${a.label} `)
+                    )
+                ),
+                // Info fija del agente
+                mode === 'banner' && React.createElement(Box, { marginTop: 1 },
+                    React.createElement(Text, { color: 'gray', italic: true },
+                        AGENT_LIST[agentIndex].description)
+                ),
+                React.createElement(Box, { marginTop: 0 },
+                    React.createElement(Text, { color: 'gray', dimColor: true },
+                        'tab  para cambiar agente')
+                )
+            ),
+
+            // Mensajes
+            React.createElement(Static, { items: messages },
+                msg => React.createElement(Msg, { key: msg.id, msg })
+            ),
+
+            // Toast de agente
+            toast && React.createElement(Toast, {
+                key: toast.key ?? Date.now(),
+                message: toast.message,
+                type: toast.type,
+                onClose: () => setToast(null)
+            }),
+
+            // Spinner
+            mode === 'thinking' && React.createElement(Box, { marginLeft: 2, marginBottom: 1 },
+                React.createElement(Spinner, { label: status })
+            ),
+
+            // Selector de modelo
+            mode === 'model-select' &&
+                React.createElement(ModelSelector, { router, onClose: onModelSelected }),
+        ),
+
+        // Barra inferior
+        React.createElement(BottomBar)
+    );
+}