a6b26b0b0d
- CI runs build + type check on Node 18/20/22 for push & PRs - Add CI status, license, and Node.js version badges to README - Replace placeholder screenshot with contribution note
🦞 ClawChat
A sleek, dark-themed webchat UI for OpenClaw — monitor sessions, stream responses, and inspect tool calls in real-time.
🖼️ Screenshot coming soon — contributions welcome!
✨ Features
- 🌑 Dark neon theme — easy on the eyes, built with Tailwind CSS v4
- 📊 Token progress bars — track token usage per session in real-time
- 🔧 Tool call badges — expandable panels with syntax-highlighted JSON
- 📋 Session sidebar — browse active sessions with live activity indicators
- 📝 Markdown rendering — full GFM support with code highlighting
- 📎 File upload — attach files to your messages
- ⚡ Streaming responses — watch the AI think in real-time
🚀 Quick Start
Prerequisites
- Node.js 18+
- OpenClaw gateway running and accessible
Installation
git clone https://github.com/MarlBurroW/clawchat.git
cd clawchat
npm install
cp .env.example .env
Edit .env with your gateway details:
VITE_GATEWAY_WS_URL=ws://localhost:18789
VITE_GATEWAY_TOKEN=your-gateway-token-here
Start the dev server:
npm run dev
Production
npm run build
npx vite preview
Or serve the dist/ folder with nginx, Caddy, or any static file server.
⚙️ Configuration
| Variable | Description | Default |
|---|---|---|
VITE_GATEWAY_WS_URL |
WebSocket URL of the OpenClaw gateway | ws://<hostname>:18789 |
VITE_GATEWAY_TOKEN |
Authentication token for the gateway | (required) |
🛠 Tech Stack
- React 19
- Vite 7
- Tailwind CSS v4
- Radix UI primitives
- highlight.js via rehype-highlight
- Lucide React icons
- react-markdown with GFM
📄 License
MIT © Nicolas Varrot
🔗 Links
- OpenClaw — the AI agent platform ClawChat connects to