🦞 PinchChat

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
🔐 Runtime login — enter gateway credentials at runtime, no secrets in the build
🌐 i18n support — English and French, configurable via VITE_LOCALE

git clone https://github.com/MarlBurroW/pinchchat.git
cd pinchchat
npm install
cp .env.example .env

Optionally edit .env to pre-fill the gateway URL:

VITE_GATEWAY_WS_URL=ws://localhost:18789
VITE_LOCALE=en          # or "fr" for French UI

Start the dev server:

npm run dev

npm run build
npx vite preview

Or serve the dist/ folder with nginx, Caddy, or any static file server.

All configuration is optional — credentials are entered at runtime via the login screen.

Variable	Description	Default
`VITE_GATEWAY_WS_URL`	Pre-fill the gateway URL on the login screen	`ws://<hostname>:18789`
`VITE_LOCALE`	UI language (`en` or `fr`)	`en`

Note: The gateway token is entered at runtime and stored in localStorage — it is never baked into the build.

Contributions are welcome! See CONTRIBUTING.md for guidelines.