rufloui 0.3.1

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.
Files changed (56) hide show
  1. package/'1' +0 -0
  2. package/.env.example +46 -0
  3. package/CHANGELOG.md +87 -0
  4. package/CLAUDE.md +287 -0
  5. package/LICENSE +21 -0
  6. package/README.md +316 -0
  7. package/Webhooks) +0 -0
  8. package/docs/plans/2026-03-11-github-webhooks.md +957 -0
  9. package/docs/screenshot-swarm-monitor.png +0 -0
  10. package/frontend +0 -0
  11. package/index.html +13 -0
  12. package/package.json +56 -0
  13. package/public/vite.svg +4 -0
  14. package/src/backend/__tests__/webhook-github.test.ts +934 -0
  15. package/src/backend/jsonl-monitor.ts +430 -0
  16. package/src/backend/server.ts +2972 -0
  17. package/src/backend/telegram-bot.ts +511 -0
  18. package/src/backend/webhook-github.ts +350 -0
  19. package/src/frontend/App.tsx +461 -0
  20. package/src/frontend/api.ts +281 -0
  21. package/src/frontend/components/ErrorBoundary.tsx +98 -0
  22. package/src/frontend/components/Layout.tsx +431 -0
  23. package/src/frontend/components/ui/Button.tsx +111 -0
  24. package/src/frontend/components/ui/Card.tsx +51 -0
  25. package/src/frontend/components/ui/StatusBadge.tsx +60 -0
  26. package/src/frontend/main.tsx +63 -0
  27. package/src/frontend/pages/AgentVizPanel.tsx +428 -0
  28. package/src/frontend/pages/AgentsPanel.tsx +445 -0
  29. package/src/frontend/pages/ConfigPanel.tsx +661 -0
  30. package/src/frontend/pages/Dashboard.tsx +482 -0
  31. package/src/frontend/pages/HiveMindPanel.tsx +355 -0
  32. package/src/frontend/pages/HooksPanel.tsx +240 -0
  33. package/src/frontend/pages/LogsPanel.tsx +261 -0
  34. package/src/frontend/pages/MemoryPanel.tsx +444 -0
  35. package/src/frontend/pages/NeuralPanel.tsx +301 -0
  36. package/src/frontend/pages/PerformancePanel.tsx +198 -0
  37. package/src/frontend/pages/SessionsPanel.tsx +428 -0
  38. package/src/frontend/pages/SetupWizard.tsx +181 -0
  39. package/src/frontend/pages/SwarmMonitorPanel.tsx +634 -0
  40. package/src/frontend/pages/SwarmPanel.tsx +322 -0
  41. package/src/frontend/pages/TasksPanel.tsx +535 -0
  42. package/src/frontend/pages/WebhooksPanel.tsx +335 -0
  43. package/src/frontend/pages/WorkflowsPanel.tsx +448 -0
  44. package/src/frontend/store.ts +185 -0
  45. package/src/frontend/styles/global.css +113 -0
  46. package/src/frontend/test-setup.ts +1 -0
  47. package/src/frontend/tour/TourContext.tsx +161 -0
  48. package/src/frontend/tour/tourSteps.ts +181 -0
  49. package/src/frontend/tour/tourStyles.css +116 -0
  50. package/src/frontend/types.ts +239 -0
  51. package/src/frontend/utils/formatTime.test.ts +83 -0
  52. package/src/frontend/utils/formatTime.ts +23 -0
  53. package/tsconfig.json +23 -0
  54. package/vite.config.ts +26 -0
  55. package/vitest.config.ts +17 -0
  56. package/{,+ +0 -0
package/'1' ADDED
File without changes
package/.env.example ADDED
@@ -0,0 +1,46 @@
1
+ # RuFloUI - Environment Configuration
2
+ # Copy this file to .env and adjust values as needed.
3
+
4
+ # Backend API port (default: 3001)
5
+ PORT=3001
6
+
7
+ # claude-flow daemon port (default: 3002)
8
+ DAEMON_PORT=3002
9
+
10
+ # Frontend dev server port (default: 5173, set via Vite)
11
+ # VITE_PORT=5173
12
+
13
+ # claude-flow CLI command (default: npx -y @claude-flow/cli@latest)
14
+ # RUFLO_CLI=npx -y @claude-flow/cli@latest
15
+
16
+ # Persistence directory (default: .ruflo/ in project root)
17
+ # RUFLO_PERSIST_DIR=.ruflo
18
+
19
+ # CLI command timeout in ms (default: 30000)
20
+ # RUFLO_CLI_TIMEOUT=30000
21
+
22
+ # Max agent output buffer lines per agent (default: 500)
23
+ # RUFLO_OUTPUT_BUFFER_SIZE=500
24
+
25
+ # Process zombie timeout in ms - kill claude processes with no output (default: 300000 = 5 min)
26
+ # RUFLO_ZOMBIE_TIMEOUT=300000
27
+
28
+ # Skip Claude Code permission prompts for autonomous agent execution (default: true)
29
+ # Set to false to require manual approval for each tool use
30
+ RUFLOUI_SKIP_PERMISSIONS=true
31
+
32
+ # CORS origin for the API server (default: http://localhost:5173)
33
+ # RUFLOUI_CORS_ORIGIN=http://localhost:5173
34
+
35
+ # Telegram Bot Integration (optional)
36
+ # Create a bot via @BotFather on Telegram, then set TELEGRAM_ENABLED=true
37
+ TELEGRAM_ENABLED=false
38
+ # TELEGRAM_BOT_TOKEN=your-bot-token-from-botfather
39
+ # TELEGRAM_CHAT_ID=your-chat-id
40
+
41
+ # GitHub Webhooks (optional)
42
+ # Receives issue events and auto-creates swarm tasks
43
+ GITHUB_WEBHOOK_ENABLED=false
44
+ # GITHUB_TOKEN=ghp_your-personal-access-token
45
+ # GITHUB_WEBHOOK_SECRET=your-webhook-secret
46
+ # GITHUB_WEBHOOK_REPOS=owner/repo1,owner/repo2
package/CHANGELOG.md ADDED
@@ -0,0 +1,87 @@
1
+ # Changelog
2
+
3
+ All notable changes to RuFloUI will be documented in this file.
4
+
5
+ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
6
+
7
+ ## [Unreleased]
8
+
9
+ ## [0.3.1] - 2026-03-11
10
+
11
+ ### Added
12
+
13
+ - **GitHub Webhook Integration** — Receive GitHub issue events and auto-create swarm tasks
14
+ - Webhook endpoint `POST /api/webhooks/github` with HMAC-SHA256 signature validation
15
+ - Dashboard UI (Webhooks page) with config editor, webhook URL, and event history
16
+ - Auto-creates high-priority tasks from new/reopened issues
17
+ - Auto-assigns to active swarm pipeline (researcher, coder, tester, reviewer)
18
+ - Configurable task instruction templates with `{{title}}`, `{{body}}`, `{{url}}`, `{{author}}`, `{{labels}}`, `{{repo}}`, `{{number}}` placeholders
19
+ - Body deduplication: when template includes `{{body}}`, body is not repeated in the header
20
+ - Event status tracking (received, processing, completed, failed) with real-time WebSocket updates
21
+ - "Send Test" button to simulate webhook events from the dashboard
22
+ - Config persisted to `.ruflo/github-webhook.json`
23
+ - Fallback to environment variables when no dashboard config
24
+ - 56 unit tests covering all webhook features
25
+
26
+ ## [0.3.0] - 2026-03-11
27
+
28
+ ### Added
29
+
30
+ - **Telegram Bot Integration** — Remote monitoring and control via Telegram polling bot
31
+ - 10 commands: `/start`, `/status`, `/agents`, `/tasks`, `/task`, `/workflows`, `/swarm`, `/run`, `/cancel`, `/help`
32
+ - Inline keyboard buttons on status (Agents/Tasks/Swarm), task lists (Refresh), and task detail (Cancel)
33
+ - Configurable notifications: task completed/failed, swarm init/shutdown, agent error, task progress
34
+ - Task progress updates throttled to 1 message per 30 seconds per task
35
+ - `/run <description>` creates and auto-assigns tasks to the swarm from Telegram
36
+ - `/cancel <id>` cancels running tasks from Telegram
37
+ - `/start` open to all users for chat ID discovery during setup
38
+ - Chat ID authorization — only the configured chat can execute commands
39
+ - Bot token stored with restricted file permissions (0600)
40
+ - Dashboard UI (Config > Telegram Bot) with enable toggle, token/chatId fields, Save & Connect, and Send Test
41
+ - Notification toggles in the dashboard for per-type control
42
+ - Activity log with incoming/outgoing message history (last 50 entries, polled every 10s)
43
+ - Auto-reconnect with exponential backoff (up to 5 attempts) on polling failures
44
+ - Configuration persisted to `.ruflo/telegram.json` (survives restarts without env vars)
45
+ - Zero overhead when disabled — returns null, no polling, no connections
46
+
47
+ ### Dependencies
48
+
49
+ - Added `node-telegram-bot-api` (runtime)
50
+ - Added `@types/node-telegram-bot-api` (dev)
51
+
52
+ ## [0.2.0] - 2026-03-10
53
+
54
+ ### Added
55
+
56
+ - **Dashboard** — System health overview with agent counts, task summary, and health checks
57
+ - **Swarm Management** — Initialize/shutdown swarms with topology selection (hierarchical, mesh, star, ring)
58
+ - **Swarm Monitor** — Real-time agent status cards with status-colored backgrounds, working glow animation, and live output modal
59
+ - **Agent Visualization** — Tree view of agent hierarchies from JSONL session logs with real-time updates
60
+ - **Agent Management** — Spawn, list, and terminate agents with type selection
61
+ - **Task Board** — Kanban-style board (Pending, In Progress, Completed, Failed) with live output streaming
62
+ - **Task Continuation** — Follow-up on completed/failed tasks with automatic context injection from previous results
63
+ - **Output History** — All task output persisted to `.ruflo/outputs/` and viewable across reloads
64
+ - **Multi-Agent Pipeline** — Coordinator plans with `--max-turns 1`, workers execute in dependency waves with role-specific system prompts
65
+ - **Hive Mind** — Consensus protocols, broadcast messaging, join/leave, shared memory
66
+ - **Workflows** — Create, execute, pause, resume, and cancel multi-step workflows
67
+ - **Memory Store** — Key-value storage with namespace support, search, and TTL
68
+ - **Neural Network** — Training, optimization, compression, and pattern monitoring
69
+ - **Performance** — Benchmarking, metrics, bottleneck analysis, and latency/throughput charts
70
+ - **Sessions** — Save and restore orchestration state
71
+ - **Hooks** — Hook listing, initialization, and metrics
72
+ - **Configuration** — Runtime config with get/set/reset and import/export
73
+ - **State Persistence** — Backend state persisted to `.ruflo/state.json` with debounced writes, atomic saves, and crash recovery
74
+ - **Frontend Persistence** — Zustand store backed by sessionStorage for instant page reload recovery
75
+ - **WebSocket** — Real-time updates with exponential backoff reconnection (up to 50 retries)
76
+ - **Health Polling** — Background health checks every 30s with disconnection banners
77
+ - **Preflight Wizard** — Startup checks for Node.js, npx, claude-flow CLI, Claude Code CLI, persistence directory, and daemon
78
+ - **Zombie Reaper** — Automatic cleanup of stale Claude processes after 5 minutes of inactivity
79
+ - **Activity Panel** — Global log panel at the bottom of every page
80
+
81
+ ### Architecture
82
+
83
+ - React 19 + Vite 6 + TypeScript frontend
84
+ - Express + WebSocket backend wrapping claude-flow CLI
85
+ - Zustand for state management with persist middleware
86
+ - JSONL monitoring for agent visualization
87
+ - Dark theme with CSS variables
package/CLAUDE.md ADDED
@@ -0,0 +1,287 @@
1
+ # Claude Code Configuration - RuFloUI
2
+
3
+ ## Project Overview
4
+
5
+ **RuFloUI** is a React 19 web frontend for managing [claude-flow v3](https://github.com/ruvnet/claude-flow) multi-agent orchestration. It wraps the CLI (`npx @claude-flow/cli@latest`) behind an Express + WebSocket backend and presents a full dashboard with real-time agent monitoring, task execution via multi-agent pipelines, and persistent state.
6
+
7
+ - **Repo**: https://github.com/Mario-PB/rufloui.git
8
+ - **Tech Stack**: React 19 + Vite 6 + TypeScript + Express + WebSocket + Zustand
9
+ - **Charts**: Recharts
10
+ - **Icons**: Lucide React
11
+ - **OS**: Windows 11 (use Unix shell syntax in bash commands)
12
+
13
+ ## Quick Start
14
+
15
+ ```bash
16
+ npm install
17
+ npm run dev # Starts both frontend (Vite :5173) and backend (Express :3001)
18
+ # Or individually:
19
+ npm run dev:frontend # Vite dev server on port 5173
20
+ npm run dev:backend # Express API on port 3001 (tsx watch, auto-reloads)
21
+ ```
22
+
23
+ The frontend proxies `/api/*` and `/ws` to `localhost:3001` via Vite config.
24
+
25
+ ## Project Structure
26
+
27
+ ```
28
+ src/
29
+ ├── backend/
30
+ │ ├── server.ts # Express API + WebSocket server (~2100 lines)
31
+ │ └── jsonl-monitor.ts # JSONL session file monitor for Agent Viz (~430 lines)
32
+ └── frontend/
33
+ ├── main.tsx # Entry point
34
+ ├── App.tsx # Router + WebSocket handler + initial data fetch
35
+ ├── api.ts # API client (fetch wrapper + all endpoint namespaces)
36
+ ├── store.ts # Zustand global state with sessionStorage persistence
37
+ ├── types.ts # TypeScript interfaces (Agent, Task, SwarmAgent, etc.)
38
+ ├── styles/
39
+ │ └── global.css # CSS variables, dark theme, animations
40
+ ├── components/
41
+ │ ├── Layout.tsx # App shell: sidebar nav (grouped) + header + activity panel
42
+ │ ├── ErrorBoundary.tsx
43
+ │ └── ui/
44
+ │ ├── Button.tsx # Reusable button with loading/variants
45
+ │ ├── Card.tsx # Card container with title/actions
46
+ │ └── StatusBadge.tsx # Colored status pill
47
+ └── pages/
48
+ ├── Dashboard.tsx # System health, agent overview, activity chart
49
+ ├── AgentsPanel.tsx # Spawn, list, terminate agents
50
+ ├── SwarmPanel.tsx # Init/shutdown swarm, topology graph
51
+ ├── SwarmMonitorPanel.tsx # Real-time agent cards with live output modal
52
+ ├── AgentVizPanel.tsx # JSONL tree visualization of Claude sessions
53
+ ├── HiveMindPanel.tsx # Consensus, broadcast, shared memory
54
+ ├── TasksPanel.tsx # Kanban task board with live execution output
55
+ ├── SessionsPanel.tsx # Save/restore sessions
56
+ ├── PerformancePanel.tsx # Benchmarks, latency/throughput charts
57
+ ├── MemoryPanel.tsx # Store/search/retrieve memories
58
+ ├── HooksPanel.tsx # Hook configuration
59
+ ├── NeuralPanel.tsx # Neural network status
60
+ ├── WorkflowsPanel.tsx # Workflow management with step tracking
61
+ ├── ConfigPanel.tsx # Configuration editor
62
+ ├── LogsPanel.tsx # Live activity logs
63
+ └── MemoryGame.tsx # Easter egg game
64
+ ```
65
+
66
+ ## Backend Architecture (server.ts)
67
+
68
+ The backend is a single Express file that wraps CLI commands, manages state, and persists to disk.
69
+
70
+ ### Key Patterns
71
+
72
+ 1. **CLI Wrapper**: `execCli(command, args)` runs `npx @claude-flow/cli@latest <command> <args>` and returns `{ raw, parsed? }`. Supports `--format json` for structured output.
73
+
74
+ 2. **Table Parser**: `parseCliTable(raw)` extracts rows from ASCII tables (`| col1 | col2 |` format) into `Record<string, string>[]`. Column names are lowercased with spaces replaced by underscores.
75
+
76
+ 3. **Persistence Layer** (`.ruflo/state.json`):
77
+ All critical state is persisted to disk as JSON and restored on server startup:
78
+ - `taskStore`, `workflowStore`, `sessionStore` — user-created data
79
+ - `agentRegistry`, `terminatedAgents`, `agentActivity` — agent tracking
80
+ - `swarmConfig` (id, topology, strategy, maxAgents, shutdown flag)
81
+ - `perfHistory`, `lastPerfMetrics`, `benchmarkHasRun` — performance data
82
+ - `currentSwarmAgentIds` — current swarm membership
83
+
84
+ Persistence triggers:
85
+ - **Debounced save** (2s) on every `broadcast()` of significant events
86
+ - **Periodic save** every 30s as safety net
87
+ - **Shutdown save** on SIGINT/SIGTERM
88
+ - **Load on startup** via `loadFromDisk()`
89
+
90
+ 4. **Multi-Agent Pipeline** (`launchSwarmPipeline()`):
91
+ When a task is assigned with an active swarm:
92
+ - Phase 1: Coordinator plans subtasks using ALL available agent roles
93
+ - Phase 2: Workers execute in parallel waves respecting dependencies
94
+ - Phase 3: Results synthesized, task marked complete
95
+ Each agent runs as a separate `claude -p` process with `--output-format stream-json`.
96
+
97
+ 5. **Agent Output Buffers** (`agentOutputBuffers: Map`):
98
+ Stores last 500 lines of Claude output per agent. Streamed to frontend via `agent:output` WebSocket events for the live output modal.
99
+
100
+ 6. **In-Memory Stores** (persisted to `.ruflo/state.json`):
101
+ - `agentRegistry: Map<createdTime, {id, name, type}>` — tracks spawned agents
102
+ - `terminatedAgents: Set<createdTime>` — marks agents as terminated
103
+ - `taskStore: Map<id, TaskRecord>` — tasks created via UI
104
+ - `workflowStore: Map<id, WorkflowRecord>` — workflow execution state with steps
105
+ - `sessionStore: Map<id, SessionRecord>` — sessions created via UI
106
+ - `agentActivity: Map<agentId, AgentActivity>` — real-time agent status
107
+ - `perfHistory[]` + `lastPerfMetrics` + `benchmarkHasRun` — performance data
108
+
109
+ 7. **Time Matching**: Agent spawn returns UTC timestamps, but `agent list` shows local time. The registry converts UTC->local for matching.
110
+
111
+ 8. **Health Checks**: Parsed by matching known check names (`Version Freshness`, `Daemon Status`, etc.) rather than Unicode symbols (Windows codepage mangles check/warning marks).
112
+
113
+ 9. **Env Var Cleanup**: When spawning child `claude -p` processes, ALL env vars starting with `CLAUDE` are deleted to prevent nested session conflicts.
114
+
115
+ 10. **Telegram Bot** (`telegram-bot.ts`): Optional polling-based Telegram integration for remote monitoring/control. Enabled via `TELEGRAM_ENABLED=true`, `TELEGRAM_BOT_TOKEN`, `TELEGRAM_CHAT_ID`. Returns `null` when disabled — zero overhead. Hooks into `broadcast()` for fire-and-forget notifications.
116
+
117
+ ### API Routes
118
+
119
+ | Route | Methods | Description |
120
+ |-------|---------|-------------|
121
+ | `/api/system` | GET health/info/metrics/status, POST reset | System monitoring |
122
+ | `/api/agents` | GET list, POST spawn, GET :id/status, POST :id/terminate, POST terminate-all | Agent lifecycle |
123
+ | `/api/swarm` | GET status/health, POST init/shutdown | Swarm management |
124
+ | `/api/hive-mind` | GET status, POST init/shutdown/join/leave/consensus/broadcast/memory | Hive mind |
125
+ | `/api/tasks` | GET list/summary, POST create, POST :id/assign/:id/complete/:id/cancel | Task management |
126
+ | `/api/sessions` | GET list, POST save, POST :id/restore, DELETE :id | Session management |
127
+ | `/api/performance` | GET metrics/bottleneck/profile/report, POST benchmark/optimize | Performance |
128
+ | `/api/memory` | GET list/search/stats, POST store, GET :key, DELETE :key | Memory storage |
129
+ | `/api/hooks` | GET list, POST init, GET metrics, GET :name/explain | Hook management |
130
+ | `/api/neural` | GET status/patterns, POST train/compress/optimize | Neural network |
131
+ | `/api/workflows` | GET list/templates, POST create/execute, DELETE :id | Workflows |
132
+ | `/api/coordination` | GET metrics/topology, POST sync/consensus | Coordination |
133
+ | `/api/config` | GET list, GET/PUT :key, POST reset, GET export, POST import | Configuration |
134
+ | `/api/ai-defence` | GET stats, POST scan/analyze | AI defence |
135
+ | `/api/swarm-monitor` | GET snapshot/activity/agents/health/metrics, GET output/:agentId, POST purge | Swarm Monitor |
136
+ | `/api/webhooks` | POST github, GET/PUT github/config, GET github/events | GitHub webhook receiver + config |
137
+ | `/api/config/telegram` | GET status, PUT update config | Telegram bot config + status |
138
+ | `/api/config/telegram/test` | POST | Send test message to Telegram |
139
+ | `/api/config/telegram/log` | GET | Activity log (last 50 messages) |
140
+ | `/api/viz` | GET sessions, GET sessions/:id, GET sessions/:id/logs/:nodeId | Agent Viz (JSONL) |
141
+
142
+ ### WebSocket Events
143
+
144
+ - Path: `ws://localhost:3001/ws`
145
+ - **Broadcast events**: `swarm:status`, `agent:activity`, `agent:output`, `task:added`, `task:updated`, `task:output`, `workflow:added`, `workflow:updated`, `session:list`, `performance:metrics`, `viz:update`, `swarm-monitor:update`, `log`
146
+ - Frontend connects in `App.tsx` and dispatches to Zustand store
147
+
148
+ ## Frontend Architecture
149
+
150
+ ### State Management (Zustand + sessionStorage)
151
+
152
+ Global store in `store.ts` with `persist` middleware using `sessionStorage`:
153
+ - Survives page reloads within the same browser tab
154
+ - Clears when tab is closed (no stale data from old sessions)
155
+ - `partialize()` excludes transient state (connected, selectedVizNode)
156
+ - Logs capped at 100 entries in storage
157
+
158
+ ### Initial Data Loading
159
+
160
+ `App.tsx` fetches core data (health, tasks, agents, workflows, sessions) on mount via `Promise.allSettled`. This means all pages have data immediately without waiting for individual page fetches. API responses are normalized (handles both `{tasks: [...]}` and `[...]` formats).
161
+
162
+ ### API Client (api.ts)
163
+
164
+ Thin `fetch` wrapper: `request<T>(path, options)` -> auto-adds JSON headers, logs to store, throws on non-OK. Namespaces: `system`, `swarm`, `agents`, `tasks`, `memory`, `sessions`, `hiveMind`, `neural`, `performance`, `hooks`, `workflows`, `coordination`, `config`, `viz`, `swarmMonitor`, `aiDefence`.
165
+
166
+ ### Key UI Patterns
167
+
168
+ - **No CSS framework** — all styles are inline CSSProperties objects or CSS variables in `global.css`
169
+ - **Dark theme** — CSS variables like `--bg-primary`, `--text-primary`, `--accent-blue`, etc.
170
+ - **Modals** — custom React overlays via `createPortal(modal, document.body)`, with backdrop click-to-close
171
+ - **Status-colored cards** — SwarmMonitorPanel agent cards use per-status background/border colors (orange=working, green=active, red=error, blue=idle)
172
+ - **Live output modal** — Click agent card "Output" button to see real-time Claude output streamed via WebSocket
173
+ - **Defensive rendering** — all `.slice()`, `.toLowerCase()` calls guarded with `?? ''` or `|| 'unknown'` fallbacks
174
+ - **Lazy loading** — all pages use `React.lazy()` with Suspense spinner
175
+
176
+ ### Sidebar Navigation (Layout.tsx)
177
+
178
+ Grouped into: Overview (Dashboard), Orchestration (Swarm, Agents, Agent Viz, Swarm Monitor, Tasks), Intelligence (Hive Mind, Neural, Memory), Operations (Workflows, Hooks, Sessions), Monitoring (Performance, Config, Logs), Games (Memory Game).
179
+
180
+ ## Multi-Agent Task Execution
181
+
182
+ When a task is assigned with an active swarm:
183
+
184
+ 1. `launchWorkflowForTask()` detects active swarm agents
185
+ 2. `launchSwarmPipeline()` orchestrates the 3-phase pipeline:
186
+ - **Phase 1**: Coordinator plans subtasks, explicitly assigning to different roles
187
+ - **Phase 2**: Workers execute in dependency waves (parallel where possible)
188
+ - **Phase 3**: Mark complete, persist results
189
+ 3. Each agent runs as `claude -p` with role-specific system prompts
190
+ 4. Output is buffered per-agent and streamed to frontend via WebSocket
191
+ 5. Agent activity broadcasts update Swarm Monitor cards in real-time
192
+ 6. Fallback: if no swarm active, single `claude -p` handles the whole task
193
+
194
+ ### Agent Roles in Pipeline
195
+
196
+ The planning prompt forces the coordinator to use ALL available roles:
197
+ - `researcher` — explore codebase, find files, understand patterns (Read/Grep/Glob only, no modifications)
198
+ - `coder` — implement code changes (Edit/Write tools)
199
+ - `tester` — write tests, run test suites, validate
200
+ - `reviewer` — review code quality, security, best practices
201
+
202
+ ## Persistence Architecture
203
+
204
+ ```
205
+ Frontend (React) Backend (Express) Disk
206
+ ┌──────────────┐ ┌──────────────────┐ ┌─────────────┐
207
+ │ Zustand store │◄── WebSocket ──►│ In-memory Maps │◄── save/load─►│.ruflo/ │
208
+ │ sessionStorage│◄── REST API ───►│ taskStore │ │ state.json │
209
+ │ (per tab) │ │ workflowStore │ └─────────────┘
210
+ └──────────────┘ │ agentRegistry │ ┌─────────────┐
211
+ │ agentActivity │ │.claude-flow/│
212
+ │ sessionStore │ │ agents/ │
213
+ │ perfHistory │ │ tasks/ │
214
+ └──────────────────┘ │ workflows/ │
215
+ │ └─────────────┘
216
+ ▼ ┌─────────────┐
217
+ claude-flow CLI ──────────────────►│.swarm/ │
218
+ (npx @claude-flow/cli) │ memory.db │
219
+ │ hnsw.index │
220
+ └─────────────┘
221
+ ```
222
+
223
+ **What persists across server restarts**: tasks, workflows, sessions, agent registry, swarm config, performance history, agent activity.
224
+
225
+ **What persists across page reloads**: all store state via sessionStorage (within same tab).
226
+
227
+ **What is lost**: running processes (claude -p), WebSocket connections, agent output buffers (rebuilt on next execution).
228
+
229
+ ## CLI Quirks & Workarounds
230
+
231
+ These are critical to understand when modifying the backend:
232
+
233
+ | Issue | Workaround |
234
+ |-------|-----------|
235
+ | CLI outputs ASCII tables, not JSON | `parseCliTable()` + regex extraction; prefer `--format json` |
236
+ | `agent list` doesn't show agent IDs or names | `agentRegistry` Map keyed by created time |
237
+ | `agent stop` doesn't remove agent from list | `terminatedAgents` Set, filtered in list endpoint |
238
+ | `agent stop --all` doesn't work | List agents first, stop individually in parallel batches of 10 |
239
+ | Spawn returns UTC time, list shows local time | Convert UTC->local with `new Date()` for registry key |
240
+ | `swarm shutdown` doesn't clear CLI state | `swarmShutdown` boolean flag, checked in status endpoint |
241
+ | Windows codepage mangles UTF-8 (check/warning marks) | Match known check names, not Unicode symbols |
242
+ | `performance metrics` has different columns than `benchmark` | Metrics: `Metric/Current/Limit/Status`; Benchmark: `Operation/Mean/P95/P99/Status` |
243
+ | Agent types must match CLI exactly | Valid: `coder`, `researcher`, `tester`, `reviewer`, `architect`, `coordinator`, `analyst`, `optimizer`, `security-architect`, `security-auditor`, `memory-specialist`, `swarm-specialist`, `performance-engineer`, `core-architect`, `test-architect` |
244
+ | Agent spawn flag is `--type` not `-t` | `['spawn', '--type', type, '--name', name]` |
245
+ | Nested `claude -p` fails with CLAUDE env vars | Delete ALL env vars starting with `CLAUDE` before spawn |
246
+ | `--output-format stream-json` needs `--verbose` | Always include `--verbose` flag with stream-json |
247
+ | Zombie agents accumulate across swarm inits | `purgeAllCliAgents()` on swarm init + manual purge button |
248
+
249
+ ## Behavioral Rules
250
+
251
+ - Do what has been asked; nothing more, nothing less
252
+ - NEVER create files unless absolutely necessary
253
+ - ALWAYS prefer editing existing files over creating new ones
254
+ - NEVER proactively create documentation files unless explicitly requested
255
+ - ALWAYS read a file before editing it
256
+ - NEVER commit secrets, credentials, or .env files
257
+ - Keep files under 500 lines where possible (server.ts is an exception at ~2200 lines)
258
+ - After editing `server.ts`, the backend must be restarted: `npx kill-port 3001; npx tsx src/backend/server.ts`
259
+ - Frontend hot-reloads automatically via Vite
260
+ - When API returns `{ items: [...] }` vs `[...]`, always normalize before setting store
261
+
262
+ ## Build & Deploy
263
+
264
+ ```bash
265
+ npm run build # TypeScript check + Vite production build -> dist/
266
+ npm run preview # Preview production build
267
+ npx tsc --noEmit # Type check without building
268
+ ```
269
+
270
+ ## Git & Repository
271
+
272
+ ```bash
273
+ git remote origin -> https://github.com/Mario-PB/rufloui.git
274
+ # Branch: main
275
+ # .gitignore excludes: node_modules/, dist/, .env*, .claude/, .claude-flow/, .ruflo/, .swarm/, .mcp.json
276
+ ```
277
+
278
+ ## Local Data Directories (not in git)
279
+
280
+ - `.ruflo/` — RuFlo persistence (state.json with tasks, workflows, agents, etc.)
281
+ - `.claude-flow/` — claude-flow CLI state (agents/store.json, tasks/store.json, config.yaml, etc.)
282
+ - `.swarm/` — claude-flow swarm data (memory.db SQLite + HNSW vector index)
283
+
284
+ ## Support
285
+
286
+ - claude-flow docs: https://github.com/ruvnet/claude-flow
287
+ - claude-flow issues: https://github.com/ruvnet/claude-flow/issues
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2026 RuFloUI Contributors
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.