feat(chat): add workspace panel, tool call cards, and screen polish#450
feat(chat): add workspace panel, tool call cards, and screen polish#4500r0b0r011 wants to merge 2 commits into
Conversation
Side panel in chat for context folder and live tool output, JSON syntax- highlighted tool call cards, memory edit preview, skill origin badges, and gateway platform test-connection button. Co-authored-by: Cursor <cursoragent@cursor.com>
pmos69
left a comment
There was a problem hiding this comment.
Reviewed statically (didn't execute). This is the cleanest PR of the #438 split — renderer-only, no security issues, and it gets the CSS discipline right. One change request before it lands.
🔴 Change request — "Test connection" button doesn't test the connection
Gateway.tsx:
{platformEnabled[platform.key] && (
<button ... onClick={async () => {
const started = await window.hermesAPI.startGateway();
if (started) await loadConfig();
}}>Test connection</button>
)}The button is rendered per enabled platform and labelled "Test connection", but the handler ignores platform entirely and just calls startGateway() — the same global action on every row. It never verifies the platform's credentials (e.g. whether the Telegram bot token actually authenticates). So the advertised feature ("Test connection button per enabled platform") isn't implemented — it's an N-times-duplicated "start gateway" button.
Please either:
- wire it to a real per-platform credential/connection check, or
- relabel it ("Start gateway") and render it once rather than per-platform.
🟡 Minor — cross-PR CSS coupling
This button uses .btn-secondary, which #449 currently restyles (--bg-elevated → --bg-tertiary, see my review there). Harmless on its own, but if #449's .btn-secondary override isn't fixed first, this button inherits that colour change. Flagging so the two are coordinated.
✅ What's good (worth calling out)
- No XSS despite rendering untrusted content:
ToolCallCardusesreact-syntax-highlighter(tokenised React elements, escaped children);WorkspacePanelrenders tool output via<pre>{toolOutput}</pre>(React-escaped);Memorypreview reuses the existingAgentMarkdown(react-markdown+remark-gfm, norehype-raw, so raw HTML is escaped). NodangerouslySetInnerHTMLanywhere — reusing the app's existing sanitised markdown renderer rather than rolling a new one is exactly right. - CSS is properly namespaced — every new selector is scoped (
.tool-call-card,.workspace-panel-*,.memory-preview-*,.skill-origin-*), and it reuses.btn/.btn-secondary/.btn-smrather than redefining them. This is the model the rest of the split should follow. - "No dependency changes" holds —
react-syntax-highlighteris already inpackage.json.
Net: fix or relabel the Test-connection button and this is good to go. Everything else (tool-call cards, workspace panel, markdown preview, skill origin badges) is solid.
Co-authored-by: Cursor <cursoragent@cursor.com>
Summary
Final deferred slice from the #438 split — chat workspace UI and minor screen polish:
No IPC, preload, or dependency changes — renderer-only.
Context
Supersedes the remaining hunks from closed #438. Merge after the feature PRs (#444–#449) or independently — this PR has no dependencies on vault, terminal, or profile wizard.
After all split PRs merge,
main's oversized commits (817bb31,edc4cdf) can be dropped in favor of the merged branches.Test plan
npm run typechecknpm test -- tests/sessions-history-items.test.ts src/renderer/src/screens/Skills/Skills.test.tsxnpm run buildFull split stack
Made with Cursor