- Deleted the .eslintrc.cjs file to simplify configuration management.
- Updated lint scripts in package.json to remove unnecessary extensions for linting.
- Added new devDependencies for ESLint and globals to enhance linting capabilities.
Chat page:
- Move session selector, refresh, thinking toggle to the Header bar
(same level as "Chat" title) instead of inside the chat content area
- Add "New Session" button (+ icon) to create fresh chat sessions
- Remove duplicate toolbar from chat body
Settings page:
- Remove max-w-2xl constraint so cards fill available width
- Redesign provider cards: compact layout with key + actions in one row
- Shorten API key display (sk-...df67 format instead of full masked key)
- Move edit/delete/star buttons inside the key row background area
- Remove duplicate "AI Providers" heading (already in card header)
- Move ChatToolbar (session selector, refresh, thinking toggle) from
the Chat page body into the Header component, so controls appear
at the same level as the "Chat" title
- Add New Session button (+) to create a fresh conversation
- Add newSession action to chat store
- Header conditionally renders ChatToolbar only on /chat route
- Chat page fills full content area without duplicate toolbar
Replace the iframe-based Control UI embed with a native React
implementation that communicates directly with the Gateway via
gateway:rpc IPC calls and chat event streaming.
New components:
- ChatToolbar: session selector dropdown, refresh button, thinking toggle
- ChatMessage: message bubbles with markdown (react-markdown + GFM),
collapsible thinking blocks, tool use cards, image attachments
- ChatInput: textarea with Enter to send, Shift+Enter for new line
- message-utils: extractText/extractThinking/extractImages/extractToolUse
ported from OpenClaw's message-extract.ts
Rewritten chat store with:
- Session management (sessions.list, switchSession)
- Proper chat.history loading with raw message preservation
- chat.send with idempotencyKey and run tracking
- Streaming via handleChatEvent (delta/final/error/aborted)
- Thinking toggle (show/hide reasoning blocks)
- The session.webRequest.onHeadersReceived was stripping X-Frame-Options
and modifying CSP for ALL responses including the Vite dev server,
which could break the main app rendering. Now only applies to
gateway URLs (127.0.0.1:18789 / localhost:18789).
- Dashboard: only fetch channels/skills when gateway is running
- Dashboard: guard against non-array channels/skills data
- Gateway store: use dynamic import() instead of require() for chat
store to avoid ESM/CJS issues in Vite
The <webview> tag had issues with event listener attachment and React
ref handling, causing the loading overlay to stay forever (white screen).
Switched to a standard <iframe> which is simpler and works reliably:
- Uses iframe onLoad/onError instead of webview dom-ready events
- Added 5s fallback timeout to dismiss loading overlay
- The X-Frame-Options/CSP header overrides from session.webRequest
allow the iframe to load the Control UI
Part 1: API Key Integration
- Create electron/utils/openclaw-auth.ts to write keys to
~/.openclaw/agents/main/agent/auth-profiles.json
- Update provider:save and provider:setApiKey IPC handlers to
persist keys to OpenClaw auth-profiles alongside ClawX storage
- Save API key to OpenClaw on successful validation in Setup wizard
- Pass provider API keys as environment variables when starting
the Gateway process (ANTHROPIC_API_KEY, OPENROUTER_API_KEY, etc.)
Part 2: Embed OpenClaw Control UI for Chat
- Replace custom Chat UI with <webview> embedding the Gateway's
built-in Control UI at http://127.0.0.1:{port}/?token={token}
- Add gateway:getControlUiUrl IPC handler to provide tokenized URL
- Enable webviewTag in Electron BrowserWindow preferences
- Override X-Frame-Options/CSP headers to allow webview embedding
- Suppress noisy control-ui token_mismatch stderr messages
- Add loading/error states for the embedded webview
This fixes the "No API key found for provider" error and replaces
the buggy custom chat implementation with OpenClaw's battle-tested
Control UI.