Skip to content

refactor(ui): vForge V3 — shell sobrio con V central permanente + rehidratación de memoria - #52

Draft
turbillon50 wants to merge 2 commits into
mainfrom
claude/v3-coding-agent-base
Draft

refactor(ui): vForge V3 — shell sobrio con V central permanente + rehidratación de memoria#52
turbillon50 wants to merge 2 commits into
mainfrom
claude/v3-coding-agent-base

Conversation

@turbillon50

@turbillon50 turbillon50 commented May 17, 2026

Copy link
Copy Markdown
Owner

vForge V3 — V central, permanente, con memoria visible

Reemplaza el shell "vForge OS" + el dock V duplicado por una arquitectura sobria inspirada en el vercel-labs/coding-agent-template (la cara) cableada al cerebro real de V — sin duplicación de agentes, sin animaciones que escondan contenido, con rehidratación de historial.

🛑 Línea roja respetada: V no se toca. Identidad, tools, BD y endpoints intactos. Solo cambia la cara.

Lo crítico que arregla

Problema Antes Ahora
V parecía "empezar de cero" UI memoria solo en useState Rehidratación de /api/forge/conversations al montar
Chat duplicado (/v + /modules + /forge) Tres sesiones distintas con session_ids diferentes /v redirige a /hub · sessionId único compartido
Páginas en negro en mobile Animación slide-from-bottom con spring Cero animaciones del shell
Lag de teclado mobile AudioContext por keystroke Eliminado (era playNeuralSound)
V escondida en sidebar Item "Forge AI" como uno más V es el centro — /hub es chat directo, badge V live siempre en header

Nuevo shell (components/v3/)

Archivo Qué hace
app-shell.tsx Layout raíz: sidebar 280px colapsable (Cmd/Ctrl+B) + main fluid
header.tsx Top bar con hamburger + breadcrumb dinámico + badge V live
sidebar.tsx Nav (Chat/Proyectos/Bóveda/Módulos/Actividad/Settings) + tabs Sesiones/Proyectos con /api/projects real
composer.tsx Composer estilo Vercel: auto-grow, Stop button, Cmd+Enter, fontSize 16 anti-zoom iOS
chat.tsx ChatV3 con rehidratación REAL del historial + SSE streaming + AbortController

Cambios de rutas

  • /hub → chat principal con V (antes era el bento). Landing del dashboard.
  • /v → redirige a /hub (elimina chat duplicado)
  • (dashboard)/layout.tsx → usa AppShellV3

Eliminado

  • components/V/* (6 archivos: ChatPage, ChatContainer, ChatComposer, MultichatDrawer, VDock, VLayoutDashboard)
  • components/vforge/{app-shell,sidebar,topbar,mobile-nav,drawer,index}.tsx (el shell viejo)
  • app/(dashboard)/template.tsx (animación duplicada)

Conservado intacto

  • Toda lib/forge/* (tools, system-prompt v2, routing, gemini-adapter, v-server, agent-config, 90 skills, 22+ tools)
  • Todos los endpoints /api/* (forge/run, forge/conversations, projects, vault, etc.)
  • BD: system_config.ai_personality, conversations, audit_events, agent_directives, skills
  • /forge (chat clásico) sigue funcional — sus componentes (chat-stream, chat-message, composer viejo) conservados

Cómo probar (cuando llegue el preview)

  1. Abre la URL del preview (Vercel lo postea abajo)
  2. Desktop: sidebar izq + chat fullscreen con composer abajo. Cmd/Ctrl+B colapsa sidebar.
  3. Mobile: hamburger → sidebar overlay. Composer fluido, sin lag.
  4. Memoria: si ya hablaste con V en alguna sesión vieja (mismo v_chat_session_id), debe aparecer el historial al cargar /hub.
  5. V responde con personalidad: como en /modules (era la sesión donde Antigravity la dejó hablando bonito). Misma V, misma voz.

Verificación

  • npx tsc --noEmit → 0 errores
  • Diff: +1033 / -2157 (más limpio que antes)

Pendiente próximos PRs (con tu OK)

  1. Lista de sesiones reales en sidebar tab "Sesiones" — necesita endpoint que liste session_ids agrupados, no solo turns. Hoy es placeholder elegante.
  2. Rediseño de /projects, /vault, /modules consistente con esta estética.
  3. Tools como UI cards: terminal (vía remote_execution tool de V → Hetzner), MCP servers panel cableado, browser control, image generation. Cada botón conecta a una tool real de V.

Inspiración visual: vercel-labs/coding-agent-template. Código escrito desde cero, sin copy/paste — adaptado a tu cerebro V.

Generated by Claude Code

@claude
refactor(ui): vForge V3 — shell sobrio Vercel/Linear-style con V cent…
96de4a6 
…ral permanente

Reemplaza el shell "vForge OS" + el dock V duplicado por una arquitectura
limpia inspirada en el coding-agent-template de Vercel (la cara) cableada
al cerebro real de V (system-prompt v2, 22+ tools, 90 skills, memoria).

V no se toca — su identidad, tools, BD y endpoints siguen intactos. Solo
cambia la cara desde donde la ves.

Nuevo shell (components/v3/)
- app-shell.tsx: sidebar izquierda 280px colapsable (Cmd/Ctrl+B), main
  fluid, sin animaciones spring/scale que escondían contenido.
- header.tsx: top bar con hamburger + breadcrumb dinámico por ruta +
  badge V live (siempre visible).
- sidebar.tsx: nav primario (Chat/Proyectos/Bóveda/Módulos/Actividad/
  Settings) + tabs (Sesiones · Proyectos) con listado real de
  /api/projects, sin Forge AI como item — V no es item, es el centro.
- composer.tsx: composer pulido estilo Vercel coding-agent-template,
  auto-grow, Enter envía, Shift+Enter newline, Cmd+Enter mobile,
  fontSize 16 (anti-zoom iOS), touch-action manipulation, botón Stop
  durante streaming.
- chat.tsx: ChatV3 con rehidratación REAL del historial desde
  /api/forge/conversations al montar. V deja de "empezar de cero" —
  el chat refleja toda la memoria server-side que siempre tuvo. SSE
  streaming intacto, AbortController, indicador de "V está pensando".

Cambios de rutas
- /hub: ahora es el chat principal con V (era el bento). Landing.
- /v: redirige a /hub (eliminamos el chat duplicado).
- /(dashboard)/layout.tsx: usa AppShellV3.

Eliminado (era ruido o estaba duplicado)
- components/V/*: ChatPage, ChatContainer, ChatComposer, MultichatDrawer,
  VDock, VLayoutDashboard. Todos reemplazados por components/v3/.
- components/vforge/{app-shell,sidebar,topbar,mobile-nav,drawer,index}.tsx:
  el viejo shell vForge OS. Reemplazado por v3.
- app/(dashboard)/template.tsx: animación duplicada que ralentizaba
  navegación. Ya no se necesita — AppShellV3 no anima transiciones.

Conservado intacto
- lib/forge/* (tools, system-prompt, routing, gemini-adapter, v-server,
  agent-config, models, routing — TODA la identidad de V).
- lib/db, lib/vault, lib/github, lib/namecom, lib/vercel.
- app/api/* (todos los endpoints incluyendo /api/forge/run,
  /api/forge/conversations, /api/projects, /api/vault, etc.).
- migrations/, system_config, conversations, audit_events,
  agent_directives, skills tables.
- middleware.ts.
- V_SYSTEM_PROMPT_v2_COMPLETO.md, V_MEMORY_VAULT.md y demás docs.
- components/vforge/{chat-stream,chat-message,composer,brand,...}
  porque /forge (chat clásico) los sigue usando.

Verificación
- npx tsc --noEmit → 0 errores
- V mantiene memoria conversacional (rehidratada al montar el chat)
- Cero animaciones que dejen pages off-screen
- Mobile: textarea fontSize 16 previene zoom iOS, touch-action en todos
  los tappables, min-h 44px en hit targets

Inspiración: vercel-labs/coding-agent-template (estructura visual). El
código se escribió desde cero adaptado a vforge — no hay copy/paste,
solo lenguaje visual.

Pendiente próximos PRs (con tu OK)
- Lista de sesiones reales en sidebar tab "Sesiones" (necesita endpoint
  que liste session_ids, no turns). Hoy es placeholder elegante.
- Rediseño de /projects, /vault, /modules consistente con esta estética.
- Tools cableadas como UI cards (terminal vía remote_execution, MCP
  servers panel, etc.) — Luis las pidió.

https://claude.ai/code/session_01YD9ckFDdBjDhYB6aaH1HR4
@vercel

vercel Bot commented May 17, 2026 •
edited
Loading

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
vforge Ready Ready Preview, Comment May 17, 2026 6:03am

Request Review

@claude
fix(v3): unificar chat — un solo session_id + theme toggle + avatar F…
6208b75 
…orgeOrb

Tres cosas que Luis pidió tras ver el primer preview:

1. UN SOLO CHAT (no dos)
   /hub y /forge tenían sessionIds distintos — V respondía cariñosa en
   /forge ("¡LUIS! HERMANO MAYOR!") porque tenía todo el historial, y
   genérica en /hub porque arrancaba sesión nueva. Era LA misma V con
   dos memorias.

   Fix:
   - ChatV3 ahora llama /api/forge/active-session?scope=general en mount,
     que es la misma fuente que /forge usaba. Resuelve al mismo
     session_id canónico del servidor.
   - Key localStorage compartida: vforge_session_id_general (antes
     v_chat_session_id, separada).
   - /forge ahora redirige a /hub. Una sola V, una sola conversación,
     todo su historial cariñoso ya cargado.

2. MODO DÍA / NOCHE
   Faltaba el toggle. Agregado en el footer del sidebar (variant="row").
   Usa el ThemeToggle ya existente de components/ui/, integrado con
   next-themes que ya está configurado.

3. AVATAR V CON IDENTIDAD (no genérico verde)
   El cuadrito verde con letra "V" se veía corriente. Reemplazado por
   ForgeOrb (components/ui/forge-orb.tsx) — el avatar oficial animado
   de V, con estado "thinking" cuando está streameando.

4. BADGE V LIVE MÁS SUTIL
   El badge grande "V · live" verde competía visualmente con el chat.
   Ahora es un dot pequeño + "V · en línea" en font mono, monocromático,
   discreto pero presente. Mobile: ícono Sparkles con dot pulsante en
   esquina (mucho más limpio que el chip verde grande).

NOTA: el "Sign in Vercel" que aparece al abrir el preview es del SSO
de Vercel (auth de previews), no de mi código. En producción (merge a
main → vforge.site) no aparece — Vercel solo lo pone en previews.

tsc --noEmit → 0 errores.

https://claude.ai/code/session_01YD9ckFDdBjDhYB6aaH1HR4
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@turbillon50 @claude