arcadiasuite/.planning/phases/06-dev-center-completo/06-02-PLAN.md

06-02 PLAN — Design + Assemble Tabs

Tasks

1. Extend client/src/pages/DevCenter.tsx — Design tab

   • Add "Design" tab to TabsList
   • 3 mode buttons: Markdown Spec | Code Editor | Visual Flow
   • Monaco Editor component (reuse existing from "Desenvolver" tab if possible)
   • Save spec to arcadia_agent_defs on blur/button click
   • Form: agent name, description, spec content

2. Extend client/src/pages/DevCenter.tsx — Assemble tab

   • List arcadia_agent_defs where status = draft
   • "Montar" button per agent → POST /api/blackboard/task with spec as context
   • Poll /api/blackboard/task/:id every 3s while assembling
   • Show progress (task status) in real-time
   • On complete: update agent status → ready, show generated artifact

3. Create client/src/components/DesignStudio.tsx (if modularizing)

   • Or inline in DevCenter tabs

4. Create client/src/components/AssembleLine.tsx (if modularizing)

   • Or inline in DevCenter tabs

Reuse

• Monaco Editor config from existing code
• Polling logic from existing task components
• Blackboard task fetch logic

Done Criteria

• Design tab allows editing agent spec in 3 modes
• Assemble tab shows draft agents and polls until complete
• Status updates in real-time
• Artifacts visible after assembly