Three matched fixes — same patterns shipped on OnboardingWizard,
ConfirmDialog, ApprovalBanner.
1. 4× bg-accent-strong hover:bg-accent (Save, Add, two Show buttons)
hovered LIGHTER on white text — accent is the lighter variant, so
contrast dropped below AA on hover. Flipped: bg-accent
hover:bg-accent-strong.
2. 4× bg-surface-card hover:bg-surface-card no-op hovers (Collapse,
Open, Hide-Advanced, Refresh, Cancel). Lift to surface-elevated
so the buttons visibly respond.
3. Delete row button: text-bad hover:text-bad was a no-op. Switched
to a light hover bg + focus-visible danger ring so the destructive
action visibly responds and keyboard users see focus.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Three matched fixes for the inline Delete-All and Delete-File confirm
banners — same patterns shipped on ConfirmDialog/ApprovalBanner/
DeleteCascade:
1. Delete buttons hovered LIGHTER (bg-red-500 over bg-red-600). On
white text drops below AA contrast. Flipped to bg-red-700.
2. Cancel buttons hover was a no-op (bg-surface-card on top of
itself). Lift to surface-elevated, matching the Cancel pattern in
ConfirmDialog.
3. None of the four buttons had focus-visible rings. Added danger
ring on Delete, accent ring on Cancel, with ring-offset-surface
so the offset color matches the inline banner backdrop.
4. Wrapped both confirm banners in role="alertdialog" + aria-
labelledby pointing to the prompt text — SR users hear the
destructive prompt immediately instead of as ambient text.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Three small UIUX fixes for the workspace Traces tab — same pattern
shipped on EventsTab.
1. Status dots were hardcoded bg-red-400 / bg-emerald-400 — semantic-
token misses. Switched to bg-bad / bg-good so they pin to the
canvas-wide ramp instead of Tailwind raw tones.
2. Trace expander rows had no aria-expanded — SR users heard a
generic "button" with no toggle indication. Added aria-expanded
+ aria-controls pointing to the detail panel id.
3. Refresh + each expander button now carry focus-visible:ring-accent
so keyboard users see where focus lands. Both were hover-only
before.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Three small UIUX fixes for the workspace terminal status bar.
1. Status dots were hardcoded bg-green-500 / bg-yellow-500 /
bg-red-500 / bg-zinc-500 — semantic-token misses. Switched to
bg-good / bg-warm / bg-bad / bg-ink-soft so the colors flip with
the canvas-wide ramp instead of pinning Tailwind raw values.
2. Reconnect button used hardcoded text-blue-400 / hover:text-blue-300
with no focus ring. Switched to text-accent / hover:text-accent-strong
for theme parity, and added focus-visible:ring-accent/60 so
keyboard users see where focus lands on a recovery action.
3. Error banner used text-red-400 — switched to text-bad to match the
semantic ramp.
Status-bar bg/border kept as zinc (terminal body stays dark
unconditionally per the Canvas v4 design rule); only the chrome's
foreground tokens needed semanticisation.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Four UIUX fixes for the workspace Events tab.
1. Hardcoded text-yellow-400 (DEGRADED) and text-purple-400
(AGENT_CARD_UPDATED) didn't theme-flip — read fine in dark mode,
washed out in warm-paper light. Switched DEGRADED → text-warm
(the semantic warm/amber token) and AGENT_CARD_UPDATED → text-
accent (informational metadata, accent is the right semantic).
2. Refresh button hover was a no-op (bg-surface-card on top of itself).
Lift to surface-elevated, matching the Cancel pattern from
ConfirmDialog. Added focus-visible ring.
3. Event expander rows had no aria-expanded — screen readers heard a
generic "button" with no indication it toggled. Added
aria-expanded + aria-controls pointing to the payload panel id.
4. Added focus-visible ring on each expander button. Hover bg added
too so the active row visibly responds.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Five fixes for the first-time-user wizard. Every new user sees this,
so visual bugs here have outsized impact.
1. Action button hovered LIGHTER: bg-accent-strong/90 hover:bg-accent.
accent is the LIGHTER variant — hovering to it on white text drops
contrast below AA. Flipped the direction: bg-accent
hover:bg-accent-strong, matching the same trap fixed in
ConfirmDialog and ApprovalBanner.
2. "Next" button hover was a no-op (bg-surface-card on top of itself).
Lift to surface-elevated, matching the Cancel pattern in
ConfirmDialog.
3. Progress bar gradient was hardcoded from-blue-500 to-sky-400 —
neither tone exists in the warm-paper light theme, so the bar lost
brand color in light mode. Switched to the accent ramp so it stays
brand-tinted in both.
4. Step indicator was hardcoded text-sky-400/80, same theme-flip
issue. Switched to text-accent.
5. All three buttons (Skip / Action / Next) had no focus-visible
rings. Added the accent ring pattern used across the rest of
the canvas.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
The previous soft-skip-on-dispatch path used `exit 0`, which only
ends the STEP — the rest of the workflow continued with empty
secrets. Caught 2026-05-04 by dispatched run 25296530706:
- E2E_MINIMAX_API_KEY: empty
- verify-secrets printed warning + exit 0
- Install required tools: ran
- Run synthetic E2E: ran with empty MiniMax key
- SECRETS_JSON branched to OpenAI shape (MINIMAX empty → fall through)
- But model slug stayed MiniMax-M2.7-highspeed (workflow env)
- Workspace booted with OpenAI keys + MiniMax model
- 5 min later: "Agent error (Exception)" — claude SDK 401'd
against api.minimax.io with the OpenAI key
The confusing failure mode silently masked the real problem (missing
secret) under a runtime-error label. Fix: drop both soft-skip paths
and exit 1 always. Operators who want to verify a YAML change without
setting up secrets can read the verify-secrets step's stderr — the
failure IS the verification signal.
Pure visibility fix; preserves the cron hard-fail path (now also the
dispatch hard-fail path). No mechanism change beyond the exit code.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Five fixes for the terms-acceptance modal:
1. CRITICAL: aria-hidden="true" on the modal's wrapper hid the dialog
AND its descendants from screen readers. The entire ToS-acceptance
flow was invisible to AT users. Removed the false aria-hidden — the
wrapper is just a backdrop, the dialog inside still has role=dialog
aria-modal=true so AT recognises it correctly.
2. Added focus management: when the modal opens, focus moves to the
"I agree" button (WCAG 2.4.3). Hard gate so no focus-trap loop or
Esc-dismiss — the user must accept or close the page.
3. "I agree" button hovered LIGHTER (bg-emerald-500 over bg-emerald-600).
On white text that drops below AA — same trap fixed in ApprovalBanner
and ConfirmDialog. Flipped to bg-emerald-700.
4. Added focus-visible ring on the "I agree" button. Was relying on
browser default outline only.
5. Privacy/Terms links: hardcoded text-sky-400 → text-accent (theme-
aware) + hover:text-accent-strong (was hover:text-sky-400, no-op
same color) + focus-visible ring. Added aria-describedby pointing
to the body div so SR can read the description with the title.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Mirrors the bouncing-dots indicator ChatTab already shows while waiting
for an agent reply. Before this, an operator delegating to one or more
external peers via Agent Comms saw their outbound bubble land and then
silence until the reply (or queued/failed status) arrived — no visual
"the system is working on this" cue.
Per-peer not global: when multiple delegations are in flight to
different peers (the fan-out case), one shared spinner under-reports —
the user can't tell whether ALL peers are still working or just the
visible ones. Per-peer matches Slack typing-indicator semantics and
keeps the signal honest.
Detection rule: walk visible messages, keep only the chronologically-
last bubble per peer. If that tail is `flow === "out"` AND status is
"pending" or "queued", emit a waiting bubble. Once an inbound reply
lands, the tail flips to "in" and the bubble disappears — even if the
backend hasn't mutated the original outbound row to "completed" yet.
This collapses both states into one rule.
Visual: matches the outgoing bubble (cyan-900/30 + cyan-700/20 border,
right-justified) with cyan-300/70 dots that respect prefers-reduced-
motion via `motion-safe:animate-bounce`. Queued case adds copy
explaining the peer is busy. role="status" + aria-label so SR users
also hear "Waiting for reply from <peer>".
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Four fixes for the cascade-delete confirmation modal:
1. Cancel button hover was a no-op: bg-surface-card on top of the
same base — clicking did something but the button looked dead.
Lifted to surface-elevated, matching the ConfirmDialog Cancel
pattern.
2. Delete button hovered LIGHTER (bg-red-500 over bg-red-600). On
white text that drops contrast below AA — same trap fixed in
ConfirmDialog and ApprovalBanner. Flipped to bg-red-700 so hover
stays readable in both themes.
3. Checkbox ring-offset color was zinc-900 — but the dialog actually
sits on bg-surface-sunken, so the offset showed the wrong color
through the ring gap. Corrected to ring-offset-surface-sunken.
Also moved focus → focus-visible so the ring only shows on
keyboard nav, not mouse clicks.
4. Cancel + Delete had no focus-visible rings. Added accent ring
on Cancel, danger ring on Delete, both with the correct
ring-offset-surface-sunken.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
User report: handing the modal's Claude Code channel snippet to an
agent fails immediately with two errors that the snippet doesn't tell
the operator how to resolve:
plugin:molecule@Molecule-AI/molecule-mcp-claude-channel · plugin not installed
plugin:molecule@Molecule-AI/molecule-mcp-claude-channel · not on the approved channels allowlist
Root cause: the snippet's `claude --channels plugin:...` line assumes
the plugin is pre-installed AND that the channel is on Anthropic's
default allowlist. Both assumptions are wrong for a custom Molecule
plugin in a public repo.
Two changes:
1. Rewrite externalChannelTemplate (Go) with full setup chain:
- Bun prereq check (channel plugins are Bun scripts)
- `/plugin marketplace add Molecule-AI/molecule-mcp-claude-channel`
+ `/plugin install molecule@molecule-mcp-claude-channel` BEFORE the
launch — otherwise "plugin not installed"
- `--dangerously-load-development-channels` flag on launch — required
for non-Anthropic-allowlisted channels, otherwise "not on approved
channels allowlist"
- Common-errors block at the bottom mapping each error string to
which numbered step recovers it
- Team/Enterprise managed-settings caveat (the dev-channels flag is
blocked there; admin must use channelsEnabled + allowedChannelPlugins)
Plugin install info verified by reading `Molecule-AI/molecule-mcp-claude-channel`
plugin.json (`name: "molecule"`) and the Claude Code channels +
plugin-discovery docs at code.claude.com/docs/en/{channels,discover-plugins}.
2. Add per-tab HelpBlock to the modal (canvas):
- Collapsible <details> below each snippet, closed by default so the
snippet stays the visual focus
- "Where to install" link (PyPI for runtime, claude.com for Claude
Code, github.com/openai/codex for Codex, NousResearch/hermes-agent
for Hermes)
- "Documentation" link (docs.molecule.ai/docs/guides/*; hostname
confirmed by existing blog post canonical metadata; paths map
1:1 to docs/guides/*.md files in this repo)
- "Common errors" list with concrete recovery steps for each tab
(e.g. Codex tab calls out the codex≥0.57 requirement and TOML
duplicate-table parse error; OpenClaw calls out the :18789 port
conflict check)
URL discipline: every URL is either (a) verified against a file path
in this repo's docs/, (b) the canonical repo of an existing snippet
reference, or (c) a well-known third-party canonical URL. No guessed
URLs — broken links would defeat the purpose of "more comprehensive
instructions."
Verification:
- `go build ./...` clean in workspace-server
- `go test ./internal/handlers/...` passes (4.3s)
- Bash syntax check on test_staging_full_saas.sh (no edits there) clean
- TS brace/paren/bracket counts balanced; no full tsc run because the
worktree's node_modules isn't installed — counterpart Canvas tabs E2E
on the PR will exercise the full type-check + render path
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
GitHub Actions scheduler de-prioritises :00 cron firings under load.
Empirical 2026-05-03: the canary's cron was '0,20,40 * * * *' but
actual firings landed at :08, :03, :01, :03 — :20 and :40 silently
dropped. Detection latency degraded from claimed 20 min to actual
~60 min worst case.
Move to '10,30,50 * * * *':
- :10/:30/:50 sit 10 min off the top-of-hour load peak
- Still 5 min from :15 sweep-cf-orphans and :45 sweep-cf-tunnels
(the original constraint that kept us off :15/:45)
- Same 20-min cadence; only the phase changes
No code change beyond the cron expression + comment refresh.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Three small UIUX fixes for the bundle drag-import surface.
1. Drag overlay was hardcoded blue-950/blue-400 — those tones don't
exist in the warm-paper light theme, so the overlay washed out
inconsistently. Switched to bg-accent/15 + border-accent/40 so
the overlay flips with theme and matches the inner card's
border-accent/50.
2. Importing spinner was visually obvious but invisible to screen
readers — only the result toast had aria-live. Operators relying
on AT had no way to know the import was in flight. Added
role="status" + aria-live="polite" + aria-hidden on the spinner
itself so the SR hears "Importing bundle..." once.
3. animate-spin → motion-safe:animate-spin so the spinner respects
prefers-reduced-motion (Tailwind's built-in variant gates the
animation on the user's OS setting). Layout doesn't change in
either case — text alone communicates state.
Also dropped border-sky-400 → border-accent on the spinner so it
matches the rest of the canvas semantics.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Four UIUX fixes for the EC2 console modal:
1. Copy and Close buttons had hover:bg-surface-card on TOP of the
same base bg-surface-card — silent no-op hover. Lifted to
surface-elevated + line-soft border, matching ConfirmDialog's
Cancel pattern. The button visibly responds now.
2. Copy button silently succeeded — no toast, no animation, no UI
feedback. Operators clicking it had no idea whether anything
landed in the clipboard. Now fires showToast on resolve/reject
so the action is observable.
3. × close button was ~10x16px (well under WCAG 2.5.5's 24x24).
Bumped to w-6 h-6 with focus-visible ring + hover bg.
4. Added focus-visible:ring-accent/60 + ring-offset-surface to
all three buttons so keyboard users see focus. Matches the
semantic ring pattern used across the canvas.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Two small fixes for the batch-action toolbar:
1. The deselect button's title says "Clear selection (Escape)" — but
pressing Escape did NOTHING. The title has been lying since the bar
shipped. Now wired: window keydown handler calls clearSelection
when Esc fires. Skipped while the confirm dialog is open
(`pending !== null`) so the dialog's own Esc-cancels takes
precedence, and skipped during a busy in-flight action so the
user can't strand a partial-failure mid-flight.
2. focus-visible:ring-zinc-500/70 → focus-visible:ring-accent/50
on the deselect button. The hardcoded zinc broke the semantic-
token pattern used by the other action buttons.
Tests: two new vitest cases — Esc clears with selection, Esc no-op
when empty (the bar isn't mounted at count===0 so the listener never
registers). Full suite: 1222/1222.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
