---
id: "0053"
title: "Chat lateral en apps/kanban via `claude -p`"
status: completado
type: feature
domain:
- kanban
scope: multi-app
priority: media
depends: []
blocks: []
related: []
created: 2026-05-17
updated: 2026-05-17
tags: []
---
# 0053 — Chat lateral en apps/kanban via `claude -p`
## APP Metadata
| Campo | Valor |
|-------|-------|
| **ID** | 0053 |
| **Estado** | pendiente |
| **Prioridad** | media |
| **Tipo** | feature — `apps/kanban/` (Go backend + Vite/React frontend) |
## Dependencias
- `apps/kanban/` (ya creada, indexada `kanban_go_tools`).
- CLI `claude` instalada en PATH (suscripcion del usuario, no `ANTHROPIC_API_KEY`).
- Modelo `claude-sonnet-4-6`.
**Desbloquea:** futuro panel de chat reutilizable en otras apps del registry.
---
## Objetivo
Añadir chat lateral en `apps/kanban` que conversa con un asistente y manipula el board (crear/renombrar/mover/borrar columnas y tarjetas, consultar tiempos e historial). El backend ejecuta `claude -p` como subprocess para usar la suscripcion del usuario, evitando manejo de API keys.
Plan completo: `apps/kanban/CHAT_PLAN.md`.
---
## Tareas
### 1. Backend Go (`apps/kanban/`)
Archivos nuevos:
- `chat.go` — handler `POST /api/chat` request/response sync + parsing `...` + dispatch a tools.
- `tools.go` — `executeTool(db, name, input json.RawMessage) (any, error)` con switch sobre 11 tools:
`list_board, create_column, rename_column, delete_column, reorder_columns, create_card, update_card, delete_card, move_card, card_history, find_cards`.
Funcion clave: `runClaude(systemPrompt, userMsg, boardJSON string) (string, error)`:
- `exec.CommandContext` con timeout 120s.
- Args: `--model claude-sonnet-4-6 --output-format json --print` (usar `-p` short alias OK).
- Prompt completo concatenado por stdin.
- Stdout JSON con campo `result` → texto del assistant.
- Si `claude` no en PATH → error `"claude CLI not found in PATH"`.
Registro:
- En `handlers.go`, añadir `{Method: "POST", Path: "/api/chat", Handler: handleChat(db)}` a `apiRoutes()`.
System prompt (constante `chatSystemPrompt` en codigo):
```
Eres el asistente del tablero kanban. Cuando el usuario pida cambios, responde EXCLUSIVAMENTE con un bloque ... que contenga JSON valido.
Tools disponibles: list_board, create_column, rename_column, delete_column, reorder_columns, create_card, update_card, delete_card, move_card, card_history, find_cards.
Si el usuario solo conversa o pide info, responde texto natural en markdown SIN bloque .
Para resolver IDs de columnas/tarjetas a partir de nombres del usuario, consulta el board_state inyectado al final del prompt.
```
Reusar funciones del registry: `infra.HTTPParseBody`, `infra.HTTPJSONResponse`, `infra.HTTPErrorResponse`. Para `exec.Command` se usa stdlib directo.
### 2. Frontend (`apps/kanban/frontend/`)
Deps nuevas: `pnpm add react-markdown remark-gfm`.
Archivos nuevos:
- `src/components/ChatPanel.tsx` — Stack vertical con lista scrollable + Textarea + Send/Clear. Persiste mensajes en `localStorage` clave `kanban_chat_v1`. Markdown via `react-markdown`. Loading state + Enter envia / Shift+Enter newline.
Modificaciones:
- `src/App.tsx` — `AppShell` con `aside={{ width: 380, breakpoint: "md", collapsed: { ... } }}`. State `chatOpen`. Boton `IconMessageChatbot` en header. `` renderiza ``.
- `src/api.ts` — añadir `sendChat(messages)` y types `ChatMessage` / `ChatResponse`.
### 3. Tests / verificacion
- `cd apps/kanban && CGO_ENABLED=1 go vet -tags fts5 ./...` pasa.
- `cd apps/kanban/frontend && pnpm build` pasa.
- Smoke test: `./run.sh`, abrir http://localhost:5180, abrir chat, mensaje "crea columna Backlog y tarjeta Test solicitada por Lucas", verificar columnas y tarjetas creadas en board.
- Si `claude` no esta en PATH: response 500 con message claro.
---
## Restricciones
- NO añadir env vars de API key.
- NO escribir chat en `operations.db`.
- NO romper API existente del kanban.
- Build Go: `-tags fts5` (NO `-tags goolm`, kanban usa fts5).
- Frontend: Mantine v9 + `@tabler/icons-react`. NO Tailwind.
---
## Branch
App `kanban` aun no tiene `.git` propio (sub-repo Gitea pendiente). Trabajar directamente sobre el `master` del root `fn_registry` con commits atomicos `feat:` / `chore:` / `docs:`. Cuando se haga `git init` + sub-repo del kanban, este historial se preservara via `ensure_repo_synced_bash_infra`.
---
## Aceptacion
- [x] `chat.go` + `tools.go` implementados y `go vet` pasa.
- [x] Endpoint `POST /api/chat` funcional con `claude -p`.
- [x] `ChatPanel.tsx` integrado en `AppShell.Aside` toggleable.
- [x] Mensajes persistidos en `localStorage`.
- [x] Tras tool calls, board hace `reload()` automatico.
- [x] Smoke test manual exitoso.
- [x] Issue movido a `dev/issues/completed/0053-kanban-chat-panel.md`.