feat: add WebUI control panel

[harperaa]

Summary

• Adds a full web control panel at localhost:3100, built with Lit + Vite and served by Fastify in the main process
• 11 tabs across 4 groups: Chat, Dashboard (Overview, Channels), Operations (Groups, Messages, Tasks, Sessions), System (Skills, Config, Logs, Debug)
• Web chat spawns container agents and streams responses via WebSocket
• Full CRUD for skills, CLAUDE.md editor with per-group scope, task management, session management
• Dark theme with teal accent, production build: 125KB JS + 20KB CSS

Changes

Backend (src/webui/):

• Fastify HTTP server with REST API + WebSocket
• 11 API route files: overview, channels, groups, messages, tasks, sessions, chat, skills, config, logs, debug
• LogBuffer ring buffer (2000 entries) for in-memory log API
• GroupQueue.getState() for debug visibility
• New db functions: getMessagesForGroup, storeChatMessage, deleteSession, getDbStats, getTaskRunLogs

Frontend (ui/):

• Separate package with Lit + Vite, no shadow DOM
• 11 view files, API client with WebSocket auto-reconnect
• Forked OpenClaw CSS (base, components, layout)

Modified existing files:

• src/config.ts: added WEBUI_PORT, WEBUI_HOST
• src/index.ts: wire startWebServer() with processWebChat callback
• src/logger.ts: added LogBuffer transport
• src/db.ts: added 5 new query functions
• src/group-queue.ts: added getState() method
• package.json: added fastify, @fastify/websocket, @fastify/static, @fastify/cors

Test plan

• npm run build compiles without errors
• cd ui && npm install && npm run build builds frontend
• Server starts and UI accessible at http://localhost:3100
• Navigate each tab and verify data loads
• Send a chat message and verify container spawns and response streams back
• Test skills CRUD (create, edit, toggle, delete)
• Test CLAUDE.md editor (save changes)
• Verify logs page shows in-memory log entries

🤖 Generated with Claude Code

[TomGranot]

@gavrielc — This adds a full WebUI control panel (Lit + Vite + Fastify, 11 tabs). It has merge conflicts with #307's changes to index.ts/config.ts/db.ts. Before the author invests time rebasing — does a web UI fit the project direction?

[TomGranot]

WebUI control panel — we're not adding a web UI at this stage. Closing.

[Andy-NanoClaw-AI]

Hey @harperaa 👋 A full web control panel with 11 tabs is an incredibly ambitious contribution — the scope of work here is impressive!

That said, this is a large addition that significantly departs from NanoClaw's lean-and-simple architecture, and it now has merge conflicts with the current codebase. It hasn't seen maintainer engagement in a while.

We plan to close this soon, but you're absolutely welcome to open a fresh PR against main to revive the discussion — a lightweight version of this idea might find more traction! 🙌

[harperaa]

You may close it. It works well on my fork, called BastionClaw. Get Outlook for iOS<https://aka.ms/o0ukef>

…

________________________________ From: Andy (NanoClaw AI) ***@***.***> Sent: Saturday, March 7, 2026 1:35:44 PM To: qwibitai/nanoclaw ***@***.***> Cc: Allen Harper ***@***.***>; Mention ***@***.***> Subject: Re: [qwibitai/nanoclaw] feat: add WebUI control panel (PR #212) [https://avatars.githubusercontent.com/u/265087900?s=20&v=4]Andy-NanoClaw-AI left a comment (qwibitai/nanoclaw#212)<#212 (comment)> Hey @harperaa<https://github.com/harperaa> 👋 A full web control panel with 11 tabs is an incredibly ambitious contribution — the scope of work here is impressive! That said, this is a large addition that significantly departs from NanoClaw's lean-and-simple architecture, and it now has merge conflicts with the current codebase. It hasn't seen maintainer engagement in a while. We plan to close this soon, but you're absolutely welcome to open a fresh PR against main to revive the discussion — a lightweight version of this idea might find more traction! 🙌 — Reply to this email directly, view it on GitHub<#212 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AAKE6ADVKMO2UGPRWQKEIDL4PRTYBAVCNFSM6AAAAACVCKWQIWVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHM2DAMJXGA4DKMJZHE>. You are receiving this because you were mentioned.Message ID: ***@***.***>