Skip to content

feat(ui): redesign chat composer controls#100461

Merged
fuller-stack-dev merged 107 commits into
openclaw:mainfrom
fuller-stack-dev:codex/control-ui-chat-composer
Jul 6, 2026
Merged

feat(ui): redesign chat composer controls#100461
fuller-stack-dev merged 107 commits into
openclaw:mainfrom
fuller-stack-dev:codex/control-ui-chat-composer

Conversation

@fuller-stack-dev

@fuller-stack-dev fuller-stack-dev commented Jul 5, 2026 •
edited
Loading

Copy link
Copy Markdown
Member

Summary

  • redesign the Control UI chat composer around a compact desktop maximum that shrinks continuously into mobile without breakpoint jumps
  • integrate the attachment menu, settings, model picker, context wheel, voice, stop, and send controls without shifting the text area
  • add a provider-aware model picker with staged Save/Discard changes, a reasoning slider, speed controls, configured catalog preservation, and no premature button updates
  • align sender/agent bubbles, metadata, and responsive action rows while fixing five-line input growth, token estimates, response following, stale run activity, dismissible errors, realtime voice draft leakage, and timestamp-hover layout reflow
  • preserve split-pane session isolation and current-main workspace file links through the latest upstream/main merges
  • switch the primary action from microphone to send on the first IME/composition character instead of waiting for a space or composition commit

Behavioral proof

The previous screenshots were removed because later review iterations changed the exact-head composer, attachment, model-picker, and mobile control layouts. This body now records the current-head behavior rather than retaining stale visual evidence.

The Android/mobile regression is covered at the input-event boundary: while an IME composition is active, the first inserted character is stored as a pane-local transient draft, requests an immediate render, and changes the primary action to Send before the host draft is committed. Composition end or blur then commits and clears the transient state.

The latest upstream/main workspace file-link work was merged while retaining this PR's message action row. Markdown rendering enables file links, and assistant canvas/copy/delete actions remain under the bubble instead of reserving space inside it.

Verification

  • node scripts/run-vitest.mjs ui/src/pages/chat/chat-view.test.ts ui/src/pages/chat/chat-controls.test.ts ui/src/pages/chat/chat-composer.test.ts ui/src/pages/chat/components/chat-message.test.ts ui/src/pages/chat/chat-responsive.browser.test.ts ui/src/pages/chat/chat-page.test.ts ui/src/pages/chat/components/chat-sidebar.test.ts
    • 7 files, 291 tests passed
  • pnpm ui:build
  • pnpm check
  • pnpm check:test-types and pnpm tsgo:prod
  • pnpm ui:i18n:check
  • git diff --check
  • $autoreview --mode local --base upstream/main after resolving the workspace file-link merge: clean, no actionable findings
  • final current-main merge was conflict-free; the focused 291-test suite and production UI build passed again afterward

Exact PR head: a934d3f10c433d37fb885cf02da8e5ad286f5980.
Included canonical base: c7295e417d5daec76c18fb452d117f7b8eadc4d6.

Real behavior proof

Behavior addressed: Control UI chat composer layout, provider/model selection, staged reasoning and speed controls, combined chat/voice settings, attachment menu, voice start/stop, send-state switching, context display, message alignment/actions, timestamp details, run lifecycle state, error dismissal, response auto-scroll, realtime voice draft handling, split-pane isolation, and workspace file links.

Real environment tested: Chromium desktop/mobile fixtures and the live Rosita Control UI during the iterative layout work; the first-character Android IME failure was reproduced on the remote mobile surface shown during review.

Exact steps or command run after this patch: Dispatched an input event containing the first character while composition was active, verified the host draft remained uncommitted, and asserted the primary action rendered Send immediately; then ran the full focused chat suite and production UI build after merging current upstream/main.

Evidence after fix: The focused suite passes 291 tests, including switches to send on the first composing character without committing the draft; the production Control UI build and locale consistency check pass; final autoreview reported no actionable branch-caused regression.

Observed result after fix: The mic changes to Send as soon as the first IME character appears. It no longer waits for a space or composition completion. Pane-local staged model changes, attachment keyboard focus, responsive message actions, context display, and current-main file links remain intact.

What was not tested: A physical Android keyboard was not rerun after the final patch; the exact browser composition/input sequence is covered by the regression test. Live external realtime voice and physical camera hardware were not exercised in this final verification pass.

Release note

Redesigns the Control UI chat composer across desktop and mobile and fixes model-selection, run-state, scrolling, realtime voice, timestamp-hover, responsive action, and first-character IME send-state regressions.

@openclaw-barnacle openclaw-barnacle Bot added app: web-ui App: web-ui scripts Repository scripts size: XL maintainer Maintainer-authored PR labels Jul 5, 2026
@clawsweeper

clawsweeper Bot commented Jul 5, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor

Codex review: needs maintainer review before merge. Reviewed July 6, 2026, 5:20 PM ET / 21:20 UTC.

Summary
Redesigns the Control UI chat composer, model picker, voice/settings/action layout, responsive message controls, provider icons, i18n artifacts, gateway model availability handling, and focused UI tests.

Reproducibility: not applicable. this is a maintainer feature/redesign PR with targeted regression coverage for included UI behavior fixes, not a standalone current-main bug report.

Review metrics: 3 noteworthy metrics.

  • Changed Surface Size: 165 files, +8854/-1624. The broad diff size makes maintainer visual/product acceptance more important even when no discrete code defect is found.
  • Provider Icon Assets: 53 provider-icon files touched; attribution says 52 SVGs copied. New public SVG assets create a concrete security and attribution review surface before merge.
  • Locale Surface: 62 locale and .i18n files touched. The scoped UI guide treats locale output alignment as a generated-artifact responsibility for visible Control UI copy.

Stored data model
Persistent data-model change detected: serialized state: ui/src/lib/sessions/index.test.ts, serialized state: ui/src/lib/sessions/index.ts, serialized state: ui/src/lib/sessions/reconcile.ts, unknown-data-model-change: ui/src/lib/sessions/index.test.ts, unknown-data-model-change: ui/src/lib/sessions/index.ts, unknown-data-model-change: ui/src/lib/sessions/reconcile.ts, and 4 more. Confirm migration or upgrade compatibility proof before merge.

Merge readiness
Overall: 🐚 platinum hermit
Proof: 🐚 platinum hermit
Patch quality: 🐚 platinum hermit
Result: ready for maintainer review.

Overall follows the weaker of proof and patch quality, so missing proof can cap an otherwise strong patch.

Rank-up moves:

  • Get current-head maintainer visual/product acceptance for the composer and model-picker redesign.
  • [P2] Wait for required current-head preflight/security/OpenGrep checks to complete or be triaged if unrelated.

Mantis proof suggestion
A proof-only web UI chat pass would help maintainers verify the broad composer, attachment, staged model-picker, and IME behavior at the current head. A maintainer can ask Mantis to capture proof by posting this exact PR comment:

@openclaw-mantis web UI chat proof: verify the Control UI composer on this PR by testing send, attachment menu, staged model picker save/discard, and mobile first-character IME send-state, then return redacted screenshots/logs.

Risk before merge

  • [P1] This is a broad protected XL user-facing chat composer/model-picker redesign, so current-head visual and product acceptance remains maintainer-owned even without a concrete code defect.
  • [P1] The PR body says final proof did not rerun a physical Android keyboard or live external realtime voice/camera hardware pass after the final patch; those paths are covered by browser/input-event tests and earlier live work instead.
  • [P1] Live status still showed queued preflight, security-fast, and OpenGrep checks at inspection time, so merge should wait for the required current-head checks to finish or for maintainers to accept any unrelated check state.

Maintainer options:

  1. Decide the mitigation before merge
    Land only after maintainer visual/product acceptance and required current-head checks are green; no contributor-facing code repair is identified in this review.
  2. Pause or close
    Do not merge this PR until maintainers decide whether the risk is worth taking.

Next step before merge

  • [P2] Human maintainer review is the next action because no narrow repair remains and the unresolved decision is visual/product acceptance for a broad protected chat UI redesign.

Maintainer decision needed

  • Question: Should this PR's broad Control UI composer and model-picker redesign land as the maintained direction after current-head visual/product acceptance?
  • Rationale: The code review no longer has a concrete blocker, but the PR changes a protected, high-traffic chat surface where final layout, interaction, and proof tolerance are maintainer product choices.
  • Likely owner: steipete — Peter has the strongest observed current-main ownership signal for the overlapping composer and Talk controls.
  • Options:
    • Land After Acceptance (recommended): Accept the redesign after a maintainer checks the current-head composer/model-picker behavior and required checks are green.
    • Request Fresh Web UI Proof: Ask for a fresh proof-only web UI chat pass if screenshots or live interaction evidence are needed before the product decision.
    • Split Or Pause The Redesign: Hold the branch if maintainers want the model picker, microphone, run-state, or message-action fixes separated from the broad redesign.

Security
Cleared: No concrete security or supply-chain regression was found in the reviewed diff; the new SVG assets were bounded by an allowlist and checked for executable or external-reference constructs.

Review details

Best possible solution:

Land only after maintainer visual/product acceptance and required current-head checks are green; no contributor-facing code repair is identified in this review.

Do we have a high-confidence way to reproduce the issue?

Not applicable: this is a maintainer feature/redesign PR with targeted regression coverage for included UI behavior fixes, not a standalone current-main bug report.

Is this the best way to solve the issue?

Yes, with product acceptance: the branch keeps composer behavior in the Control UI and model availability in the gateway method, while the remaining question is whether maintainers want this broad redesigned interaction to land as-is.

AGENTS.md: found and applied where relevant.

Codex review notes: model internal, reasoning high; reviewed against c7295e417d5d.

Label changes

Label justifications:

  • P2: This is a normal-priority web UI feature/fix PR with substantial user-facing surface but no urgent outage, data loss, or security blocker shown.
  • rating: 🐚 platinum hermit: Overall readiness is 🐚 platinum hermit; proof is 🐚 platinum hermit and patch quality is 🐚 platinum hermit.
  • status: 👀 ready for maintainer look: ClawSweeper has no concrete contributor-facing blocker left for this PR. Not applicable: The external-contributor proof gate does not apply to this maintainer-labeled MEMBER PR, though the body and comments include focused UI, build, i18n, Crabbox, and autoreview proof with stated hardware gaps.
Evidence reviewed

Acceptance criteria:

  • [P1] Maintainer visual/product acceptance of the current-head composer and model-picker behavior.
  • [P1] Required current-head checks complete or are triaged as unrelated.
  • [P1] Optional proof-only web UI chat pass for send, attachment menu, staged Save/Discard, and mobile IME send-state.

What I checked:

Likely related people:

What the crustacean ranks mean
  • 🦀 challenger crab: rare, exceptional readiness with strong proof, clean implementation, and convincing validation.
  • 🦞 diamond lobster: very strong readiness with only minor maintainer review expected.
  • 🐚 platinum hermit: good normal PR, likely mergeable with ordinary maintainer review.
  • 🦐 gold shrimp: useful signal, but proof or patch confidence is still limited.
  • 🦪 silver shellfish: thin signal; proof, validation, or implementation needs work.
  • 🧂 unranked krab: not merge-ready because proof is missing/unusable or there are serious correctness or safety concerns.
  • 🌊 off-meta tidepool: rating does not apply to this item.

Shiny media proof means a screenshot, video, or linked artifact directly shows the changed behavior. Runtime, network, CSP, and security claims still need visible diagnostics.

How this review workflow works
  • ClawSweeper keeps one durable marker-backed review comment per issue or PR.
  • Re-runs edit this comment so the latest verdict, findings, and automation markers stay together instead of adding duplicate bot comments.
  • A fresh review can be triggered by eligible @clawsweeper re-review comments, exact-item GitHub events, scheduled/background review runs, or manual workflow dispatch.
  • PR/issue authors and users with repository write access can comment @clawsweeper re-review or @clawsweeper re-run on an open PR or issue to request a fresh review only.
  • Maintainers can also comment @clawsweeper review to request a fresh review only.
  • Fresh-review commands do not start repair, autofix, rebase, CI repair, or automerge.
  • Maintainer-only repair and merge flows require explicit commands such as @clawsweeper autofix, @clawsweeper automerge, @clawsweeper fix ci, or @clawsweeper address review.
  • Maintainers can comment @clawsweeper explain to ask for more context, or @clawsweeper stop to stop active automation.
Review history (19 earlier review cycles; latest 8 shown)
  • reviewed 2026-07-06T13:05:19.765Z sha abdfff0 :: needs changes before merge. :: [P2] Keep model picks under Save/Discard
  • reviewed 2026-07-06T13:56:56.422Z sha c99d611 :: needs maintainer review before merge. :: none
  • reviewed 2026-07-06T14:06:41.143Z sha c99d611 :: needs maintainer review before merge. :: none
  • reviewed 2026-07-06T14:59:51.937Z sha 1e3418e :: needs maintainer review before merge. :: none
  • reviewed 2026-07-06T18:06:06.424Z sha 6768528 :: needs maintainer review before merge. :: none
  • reviewed 2026-07-06T19:26:56.312Z sha acf6d17 :: needs maintainer review before merge. :: none
  • reviewed 2026-07-06T19:43:53.077Z sha acf6d17 :: needs changes before merge. :: [P3] Localize the new Talk option labels
  • reviewed 2026-07-06T19:53:01.111Z sha acf6d17 :: needs changes before merge. :: [P3] Localize the new Talk option labels

@clawsweeper clawsweeper Bot added rating: 🦪 silver shellfish Thin PR readiness signal; proof, validation, or implementation needs work. status: ⏳ waiting on author ClawSweeper has contributor-facing work open and is waiting for author action. P2 Normal backlog priority with limited blast radius. proof: sufficient ClawSweeper judged the real behavior proof convincing. proof: 🎥 video Contributor real behavior proof includes video or recording evidence. labels Jul 5, 2026
@clawsweeper clawsweeper Bot added rating: 🐚 platinum hermit Good normal PR readiness with ordinary maintainer review expected. status: 👀 ready for maintainer look ClawSweeper has no concrete contributor-facing blocker left for this PR. and removed rating: 🦪 silver shellfish Thin PR readiness signal; proof, validation, or implementation needs work. status: ⏳ waiting on author ClawSweeper has contributor-facing work open and is waiting for author action. labels Jul 5, 2026
@clawsweeper clawsweeper Bot added the merge-risk: 🚨 auth-provider 🚨 May break OAuth, tokens, provider routing, model choice, or credentials. label Jul 5, 2026
@fuller-stack-dev fuller-stack-dev self-assigned this Jul 5, 2026
@clawsweeper clawsweeper Bot mentioned this pull request Jul 5, 2026
Merged
@fuller-stack-dev

fuller-stack-dev commented Jul 6, 2026

Copy link
Copy Markdown
Member Author

Merged via squash.

@github-actions github-actions Bot mentioned this pull request Jul 6, 2026
Open
@fuller-stack-dev fuller-stack-dev mentioned this pull request Jul 7, 2026
Closed
This was referenced Jul 7, 2026
Merged
Merged
@steipete steipete mentioned this pull request Jul 7, 2026
Closed
This was referenced Jul 7, 2026
Closed
Merged
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

@fuller-stack-dev fuller-stack-dev

Labels

app: web-ui App: web-ui gateway Gateway runtime maintainer Maintainer-authored PR P2 Normal backlog priority with limited blast radius. rating: 🐚 platinum hermit Good normal PR readiness with ordinary maintainer review expected. scripts Repository scripts size: XL status: 👀 ready for maintainer look ClawSweeper has no concrete contributor-facing blocker left for this PR.

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@fuller-stack-dev