claudeboard 2.16.0 → 3.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +89 -93
- package/bin/cli.js +198 -238
- package/bin/init-context.js +22 -0
- package/package.json +22 -43
- package/public/app.js +1411 -0
- package/public/index.html +250 -0
- package/public/style.css +1872 -0
- package/src/context-template.md +20 -0
- package/src/notifier.js +65 -0
- package/src/orchestrator.js +800 -0
- package/src/scanner.js +153 -0
- package/src/server.js +205 -0
- package/src/store.js +182 -0
- package/src/verifier.js +131 -0
- package/agents/architect.js +0 -166
- package/agents/board-client.js +0 -126
- package/agents/claude-api.js +0 -124
- package/agents/claude-resolver.js +0 -167
- package/agents/developer.js +0 -224
- package/agents/expo-health.js +0 -727
- package/agents/orchestrator.js +0 -306
- package/agents/qa.js +0 -336
- package/dashboard/index.html +0 -1980
- package/dashboard/server.js +0 -412
- package/sql/setup.sql +0 -57
- package/tools/filesystem.js +0 -95
- package/tools/screenshot.js +0 -74
- package/tools/supabase-reader.js +0 -74
- package/tools/terminal.js +0 -63
|
@@ -0,0 +1,250 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>ClaudeBoard v3</title>
|
|
7
|
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
8
|
+
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
|
|
9
|
+
<link rel="stylesheet" href="style.css">
|
|
10
|
+
</head>
|
|
11
|
+
<body>
|
|
12
|
+
<div id="app">
|
|
13
|
+
<!-- Sidebar: Orquestador Chat -->
|
|
14
|
+
<aside id="sidebar">
|
|
15
|
+
<div class="sidebar-header">
|
|
16
|
+
<div class="sidebar-header-top">
|
|
17
|
+
<div class="logo">
|
|
18
|
+
<span class="logo-icon">◆</span>
|
|
19
|
+
<span class="logo-text">ClaudeBoard</span>
|
|
20
|
+
<span class="logo-version">v3</span>
|
|
21
|
+
</div>
|
|
22
|
+
<button class="sidebar-collapse-btn" id="sidebarCollapseBtn" title="Colapsar chat">◂</button>
|
|
23
|
+
</div>
|
|
24
|
+
<div class="connection-status" id="connStatus">
|
|
25
|
+
<span class="dot"></span>
|
|
26
|
+
<span>Connecting...</span>
|
|
27
|
+
</div>
|
|
28
|
+
</div>
|
|
29
|
+
|
|
30
|
+
<div class="chat-container" id="chatMessages">
|
|
31
|
+
<div class="chat-welcome">
|
|
32
|
+
<div class="welcome-icon">◆</div>
|
|
33
|
+
<h3>Orquestador</h3>
|
|
34
|
+
<p>Contame qué querés construir y coordino tu equipo de agentes.</p>
|
|
35
|
+
<div class="welcome-chips">
|
|
36
|
+
<span class="welcome-chip">Genera PRD</span>
|
|
37
|
+
<span class="welcome-chip">Corre Agentes</span>
|
|
38
|
+
<span class="welcome-chip">Kanban Live</span>
|
|
39
|
+
</div>
|
|
40
|
+
</div>
|
|
41
|
+
</div>
|
|
42
|
+
|
|
43
|
+
<div class="chat-input-area">
|
|
44
|
+
<div class="typing-indicator" id="typingIndicator" style="display:none">
|
|
45
|
+
<span></span><span></span><span></span>
|
|
46
|
+
</div>
|
|
47
|
+
<div id="imgPreview" class="img-preview" style="display:none">
|
|
48
|
+
<img id="imgPreviewImg" src="" alt="preview">
|
|
49
|
+
<button id="removeImg" class="btn-icon btn-remove-img">✕</button>
|
|
50
|
+
</div>
|
|
51
|
+
<div class="input-row">
|
|
52
|
+
<label class="btn-attach" for="imgAttach" title="Adjuntar imagen">
|
|
53
|
+
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
54
|
+
<path d="M21.44 11.05l-9.19 9.19a6 6 0 01-8.49-8.49l9.19-9.19a4 4 0 015.66 5.66l-9.2 9.19a2 2 0 01-2.83-2.83l8.49-8.48"></path>
|
|
55
|
+
</svg>
|
|
56
|
+
<input type="file" id="imgAttach" accept="image/*" style="display:none">
|
|
57
|
+
</label>
|
|
58
|
+
<textarea id="chatInput" placeholder="¿Qué querés construir?" rows="2"></textarea>
|
|
59
|
+
<button id="sendBtn" class="btn-send">
|
|
60
|
+
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
61
|
+
<line x1="22" y1="2" x2="11" y2="13"></line>
|
|
62
|
+
<polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
|
|
63
|
+
</svg>
|
|
64
|
+
</button>
|
|
65
|
+
</div>
|
|
66
|
+
</div>
|
|
67
|
+
</aside>
|
|
68
|
+
|
|
69
|
+
<!-- Main: Kanban Board -->
|
|
70
|
+
<main id="main">
|
|
71
|
+
<div class="main-header">
|
|
72
|
+
<div class="main-header-left">
|
|
73
|
+
<button class="btn-icon sidebar-expand-btn" id="sidebarExpandBtn" style="display:none" title="Expandir chat">◃ Chat</button>
|
|
74
|
+
<h1>Project Board</h1>
|
|
75
|
+
</div>
|
|
76
|
+
<div class="sys-monitor" id="sysMonitor" title="CPU y RAM del sistema"></div>
|
|
77
|
+
<div class="board-actions">
|
|
78
|
+
<label class="btn-secondary btn-upload-prd" for="prdFileInput" title="Subir un archivo .md con el PRD del proyecto">📄 Subir PRD</label>
|
|
79
|
+
<input type="file" id="prdFileInput" accept=".md,.txt" style="display:none">
|
|
80
|
+
<button class="btn-secondary" id="prdBtn" style="display:none">Ver PRD</button>
|
|
81
|
+
<button class="btn-secondary btn-qa" id="qaBtn" style="display:none" title="Abrir Chrome, capturar pantalla y crear tareas de corrección si algo falla">🔍 Revisar en Chrome</button>
|
|
82
|
+
<button class="btn-secondary btn-checklist" id="checklistBtn" style="display:none" title="Verificar que el proyecto esté listo para producción">✅ Checklist</button>
|
|
83
|
+
<button class="btn-secondary btn-deploy" id="deployBtn" style="display:none" title="Deploy a Netlify">🚀 Deploy</button>
|
|
84
|
+
<button class="btn-danger" id="pauseAllBtn" style="display:none">▮▮ Pause All</button>
|
|
85
|
+
<button class="btn-danger" id="clearAllBtn" style="display:none" title="Borrar todas las tareas del board">🗑 Limpiar</button>
|
|
86
|
+
<button class="btn-primary" id="runAllBtn" style="display:none">▶ Run All Tasks</button>
|
|
87
|
+
</div>
|
|
88
|
+
</div>
|
|
89
|
+
|
|
90
|
+
<div class="kanban-board" id="kanbanBoard">
|
|
91
|
+
<div id="boardEmptyState" class="board-empty-state" style="display:none">
|
|
92
|
+
<div class="board-empty-icon">◆</div>
|
|
93
|
+
<h2 class="board-empty-headline">Tu proyecto arranca acá</h2>
|
|
94
|
+
<p class="board-empty-sub">Contále al orquestador qué querés construir →</p>
|
|
95
|
+
</div>
|
|
96
|
+
<div class="kanban-col" data-status="backlog">
|
|
97
|
+
<div class="col-header">
|
|
98
|
+
<span class="col-icon">📋</span>
|
|
99
|
+
<span class="col-title">Pendiente</span>
|
|
100
|
+
<span class="col-count" id="count-backlog">0</span>
|
|
101
|
+
</div>
|
|
102
|
+
<div class="col-cards" id="col-backlog"></div>
|
|
103
|
+
</div>
|
|
104
|
+
<div class="kanban-col" data-status="in_progress">
|
|
105
|
+
<div class="col-header">
|
|
106
|
+
<span class="col-icon">⚡</span>
|
|
107
|
+
<span class="col-title">En Progreso</span>
|
|
108
|
+
<span class="col-count" id="count-in_progress">0</span>
|
|
109
|
+
</div>
|
|
110
|
+
<div class="col-cards" id="col-in_progress"></div>
|
|
111
|
+
</div>
|
|
112
|
+
<div class="kanban-col" data-status="verifying">
|
|
113
|
+
<div class="col-header">
|
|
114
|
+
<span class="col-icon">🔍</span>
|
|
115
|
+
<span class="col-title">Verificando</span>
|
|
116
|
+
<span class="col-count" id="count-verifying">0</span>
|
|
117
|
+
</div>
|
|
118
|
+
<div class="col-cards" id="col-verifying"></div>
|
|
119
|
+
</div>
|
|
120
|
+
<div class="kanban-col" data-status="done">
|
|
121
|
+
<div class="col-header">
|
|
122
|
+
<span class="col-icon">✅</span>
|
|
123
|
+
<span class="col-title">Listo</span>
|
|
124
|
+
<span class="col-count" id="count-done">0</span>
|
|
125
|
+
</div>
|
|
126
|
+
<div class="col-cards" id="col-done"></div>
|
|
127
|
+
</div>
|
|
128
|
+
<div class="kanban-col" data-status="error">
|
|
129
|
+
<div class="col-header">
|
|
130
|
+
<span class="col-icon">❌</span>
|
|
131
|
+
<span class="col-title">Error</span>
|
|
132
|
+
<span class="col-count" id="count-error">0</span>
|
|
133
|
+
<button class="btn-redo-errors" id="redoErrorsBtn" title="Reintentar todas">↻</button>
|
|
134
|
+
</div>
|
|
135
|
+
<div class="col-cards" id="col-error"></div>
|
|
136
|
+
</div>
|
|
137
|
+
</div>
|
|
138
|
+
</main>
|
|
139
|
+
|
|
140
|
+
<!-- Right Detail Panel -->
|
|
141
|
+
<div id="detail-panel" class="detail-panel">
|
|
142
|
+
<div class="panel-header">
|
|
143
|
+
<div class="panel-header-left">
|
|
144
|
+
<span id="panelBadge"></span>
|
|
145
|
+
<span id="panelAgentLabel" class="panel-agent-label"></span>
|
|
146
|
+
</div>
|
|
147
|
+
<div class="panel-header-right">
|
|
148
|
+
<span id="panelElapsed" class="panel-elapsed"></span>
|
|
149
|
+
<button class="btn-icon" id="closePanel">✕</button>
|
|
150
|
+
</div>
|
|
151
|
+
</div>
|
|
152
|
+
<div class="panel-body">
|
|
153
|
+
<h2 id="panelTaskName" class="panel-task-name">—</h2>
|
|
154
|
+
<div class="panel-section">
|
|
155
|
+
<span class="panel-section-label">Descripción</span>
|
|
156
|
+
<p id="panelTaskDesc" class="panel-task-desc"></p>
|
|
157
|
+
</div>
|
|
158
|
+
<div class="panel-section" id="panelCriteriaWrap">
|
|
159
|
+
<span class="panel-section-label">Criterio de éxito</span>
|
|
160
|
+
<p id="panelCriteria" class="panel-task-desc"></p>
|
|
161
|
+
</div>
|
|
162
|
+
</div>
|
|
163
|
+
<div class="panel-terminal-wrap">
|
|
164
|
+
<div class="panel-terminal-header">
|
|
165
|
+
<span class="panel-terminal-label">▶ Live output</span>
|
|
166
|
+
<button class="btn-icon" id="clearPanelTerminal">Clear</button>
|
|
167
|
+
</div>
|
|
168
|
+
<div class="panel-terminal-body" id="panelTerminalBody">
|
|
169
|
+
<div class="terminal-placeholder">Seleccioná una tarea para ver el output en vivo.</div>
|
|
170
|
+
</div>
|
|
171
|
+
</div>
|
|
172
|
+
</div>
|
|
173
|
+
</div>
|
|
174
|
+
|
|
175
|
+
<!-- PRD Modal -->
|
|
176
|
+
<div id="prdModal" class="modal" style="display:none">
|
|
177
|
+
<div class="modal-backdrop" onclick="closePRD()"></div>
|
|
178
|
+
<div class="modal-content">
|
|
179
|
+
<div class="modal-header">
|
|
180
|
+
<h2>Project Requirements Document</h2>
|
|
181
|
+
<button class="btn-icon" onclick="closePRD()">✕</button>
|
|
182
|
+
</div>
|
|
183
|
+
<div class="modal-body" id="prdContent"></div>
|
|
184
|
+
</div>
|
|
185
|
+
</div>
|
|
186
|
+
|
|
187
|
+
<!-- QA Status Toast -->
|
|
188
|
+
<div id="qaToast" class="qa-toast" style="display:none">
|
|
189
|
+
<span class="qa-toast-icon">🔍</span>
|
|
190
|
+
<span id="qaToastText">Agente QA revisando el proyecto…</span>
|
|
191
|
+
</div>
|
|
192
|
+
|
|
193
|
+
<!-- Supabase Credentials Modal -->
|
|
194
|
+
<div id="supabaseModal" class="modal" style="display:none">
|
|
195
|
+
<div class="modal-backdrop" id="supabaseModalBackdrop"></div>
|
|
196
|
+
<div class="modal-content sb-modal-content">
|
|
197
|
+
<div class="modal-header">
|
|
198
|
+
<div class="sb-modal-title">
|
|
199
|
+
<span class="sb-modal-icon">⚡</span>
|
|
200
|
+
<h2>Configuración requerida: Supabase</h2>
|
|
201
|
+
</div>
|
|
202
|
+
<button class="btn-icon" id="closeSupabaseModal">✕</button>
|
|
203
|
+
</div>
|
|
204
|
+
<div class="modal-body sb-modal-body">
|
|
205
|
+
<p class="sb-intro">Las siguientes tareas requieren Supabase. Completá los datos para que los agentes puedan trabajar:</p>
|
|
206
|
+
<ul class="sb-task-list" id="sbTaskList"></ul>
|
|
207
|
+
<div class="sb-tip">
|
|
208
|
+
<strong>💡 ¿Dónde encontrar estos valores?</strong><br>
|
|
209
|
+
Entrá a <strong>supabase.com/dashboard</strong> → Tu proyecto → <strong>Settings → API</strong>
|
|
210
|
+
</div>
|
|
211
|
+
<div class="sb-fields">
|
|
212
|
+
<div class="sb-field">
|
|
213
|
+
<label for="sbUrl">URL del proyecto <span class="sb-required">*</span></label>
|
|
214
|
+
<input type="text" id="sbUrl" class="sb-input" placeholder="https://xxxxxxxxxxxx.supabase.co" autocomplete="off" />
|
|
215
|
+
<span class="sb-hint">Settings → API → Project URL</span>
|
|
216
|
+
</div>
|
|
217
|
+
<div class="sb-field">
|
|
218
|
+
<label for="sbAnonKey">Anon Key (pública) <span class="sb-required">*</span></label>
|
|
219
|
+
<input type="text" id="sbAnonKey" class="sb-input" placeholder="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9..." autocomplete="off" />
|
|
220
|
+
<span class="sb-hint">Settings → API → anon / public</span>
|
|
221
|
+
</div>
|
|
222
|
+
<div class="sb-field">
|
|
223
|
+
<label for="sbServiceKey">Service Role Key <span class="sb-optional">(opcional — para operaciones admin)</span></label>
|
|
224
|
+
<input type="password" id="sbServiceKey" class="sb-input" placeholder="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9..." autocomplete="off" />
|
|
225
|
+
<span class="sb-hint">Settings → API → service_role / secret</span>
|
|
226
|
+
</div>
|
|
227
|
+
<div class="sb-field sb-check-field">
|
|
228
|
+
<label class="sb-checkbox-label">
|
|
229
|
+
<input type="checkbox" id="sbWriteEnv" checked />
|
|
230
|
+
<span>Guardar en <code>.env</code> del proyecto automáticamente</span>
|
|
231
|
+
</label>
|
|
232
|
+
</div>
|
|
233
|
+
<div class="sb-field sb-check-field">
|
|
234
|
+
<label class="sb-checkbox-label">
|
|
235
|
+
<input type="checkbox" id="sbCliLogin" />
|
|
236
|
+
<span>Ya corrí <code>supabase login</code> en mi terminal (para migraciones y funciones)</span>
|
|
237
|
+
</label>
|
|
238
|
+
</div>
|
|
239
|
+
</div>
|
|
240
|
+
</div>
|
|
241
|
+
<div class="sb-modal-footer">
|
|
242
|
+
<button class="btn-secondary" id="cancelSupabaseModal">Cancelar — ejecutar igual</button>
|
|
243
|
+
<button class="btn-primary" id="submitSupabaseModal">Guardar y continuar →</button>
|
|
244
|
+
</div>
|
|
245
|
+
</div>
|
|
246
|
+
</div>
|
|
247
|
+
|
|
248
|
+
<script src="app.js"></script>
|
|
249
|
+
</body>
|
|
250
|
+
</html>
|