Skip to content

Apply design-system composer to app chat UI - #1

Open
karkarl wants to merge 12 commits into
mainfrom
karkarl-winui-composer-design
Open

Apply design-system composer to app chat UI#1
karkarl wants to merge 12 commits into
mainfrom
karkarl-winui-composer-design

Conversation

@karkarl

@karkarl karkarl commented Jul 10, 2026 •
edited
Loading

Copy link
Copy Markdown
Owner

Apply the newly seeded design-system ChatComposer pattern to the real WinUI 3 chat UI. This PR targets main and contains only the app-code changes (composer + Settings); it is independent and no longer stacked on the seed design-system branch.

Part A — Composer restyle

  • Rebuilt the composer as a single rounded surface (md/8px radius, 1px line border) wrapping a transparent auto-growing textarea above a space-between toolbar row.
  • LEFT cluster: subtle Add (+) icon button, model picker, reasoning-effort picker. RIGHT cluster: subtle mic (Dictate) icon button + primary accent Send (up-arrow). Only Send carries the accent.
  • Subtle controls use native Fluent theme resources — SubtleFillColorSecondaryBrush (hover) / SubtleFillColorTertiaryBrush (pressed), TextOnAccentFillColorPrimaryBrush for the Send glyph. No hard-coded hex, so light/dark/high-contrast stay correct.
  • Converted the model + reasoning-effort ComboBoxes to menu-flyout pickers (DropDownButton + menu), preserving grouping, disabled rows, model Default/clear, and current-selection semantics.
  • Preserved the composerInput identity contract.

Follow-up refinements (in this branch)

  • Model + reasoning menus use ToggleMenuFlyoutItem (checkmark) instead of radio dots for the selected option.
  • Session/channel picker is a two-line ContentFlyout: session title with its associated model as muted subtext + a leading checkmark for the current session.
  • Model picker patches the current session, so changing the model updates the session's model subtext.
  • ContentFlyout presenter uses a symmetric 4px inset so floating rows have even margins on all sides, matching the menu flyouts.

Part B — Settings "Chat" section

  • New Settings "Chat" section with a tool-calls visibility toggle.
  • SettingsData.ShowChatToolCalls persisted setting + OpenClawChatRoot.SetToolCallsVisible applier.
  • 5 new UI strings localized across all 5 locales (en-us / fr-fr / nl-nl / zh-cn / zh-tw).

Validation

  • ./build.ps1 — all projects built, 0 warnings / 0 errors.
  • Shared tests — 2703 passed, 0 failed.
  • Tray tests — 1586 passed, 0 failed.
  • Rubber-duck review — clean (2 non-blocking findings applied).

Co-authored-by: Copilot App 223556219+Copilot@users.noreply.github.com

@karkarl
karkarl marked this pull request as draft July 10, 2026 19:48
@karkarl karkarl mentioned this pull request Jul 10, 2026
Draft
@karkarl
karkarl force-pushed the karkarl-winui-composer-design branch from c3ec13b to c2db183 Compare July 13, 2026 17:43
@karkarl
karkarl changed the base branch from karkarl-seed-design-system to main July 13, 2026 17:43
calebeden and others added 6 commits July 13, 2026 11:46
@calebeden @shanselman
Add opt-in OpenTelemetry diagnostics groundwork (openclaw#963)
5c57666 
* Add OpenTelemetry endpoint probe

Add Diagnostics UI for configuring an OpenTelemetry connection with explicit OTLP/gRPC or OTLP/HTTP protocol selection. Persist the endpoint and protocol settings, create a probe-only tray connector, and send a single minimal OpenTelemetry probe when a saved endpoint is configured.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

* Add OpenTelemetry helper API

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

* Refine OpenTelemetry helper API

Split shared telemetry names from span-local attributes, keep span names at point of use, and make helper outcome tagging consistent across success, failure, and cancellation.

Validation:

.\build.ps1

dotnet test .\tests\OpenClaw.Shared.Tests\OpenClaw.Shared.Tests.csproj --no-restore

dotnet test .\tests\OpenClaw.Tray.Tests\OpenClaw.Tray.Tests.csproj --no-restore

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

* Add OpenTelemetry metrics helpers

Add shared System.Diagnostics.Metrics helpers and emit a probe counter alongside the existing OTLP trace probe. Register and flush both trace and metric providers from the tray-owned exporter path.

Validation:

.\build.ps1

dotnet test .\tests\OpenClaw.Shared.Tests\OpenClaw.Shared.Tests.csproj --no-restore

dotnet test .\tests\OpenClaw.Tray.Tests\OpenClaw.Tray.Tests.csproj --no-restore

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

* Add OpenTelemetry log export probe

Wire the tray-owned OpenTelemetry sink to emit a safe structured log probe alongside trace and metric probes. Add an allowlisted log export policy, include log flushing in probe lifecycle checks, and cover the policy in tray tests.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

* Harden OpenTelemetry endpoint handling

Reject credential-bearing or parameterized endpoint URLs, reset protocol defaults on clear, and make probe sink disposal best-effort during reconfiguration and shutdown.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

* Fix OTLP HTTP signal endpoints

Derive trace, metric, and log HTTP/protobuf exporter URLs from the configured collector base while preserving gRPC endpoint behavior. Normalize version-only and signal-specific HTTP paths before appending signal suffixes, and add focused coverage for base paths, /v1 paths, signal-specific inputs, mixed-case suffixes, and gRPC pass-through.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

* Document OpenTelemetry diagnostics boundary

Add telemetry documentation covering opt-in behavior, current probe-only exports, future instrumentation boundaries, endpoint handling, and plain HTTP guidance.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

* Add telemetry guardrails for agents

Point agents at the durable telemetry conventions and summarize the operational rules for safe OpenTelemetry changes.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

* Address telemetry review follow-ups

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

* Allow retrying telemetry probes

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: 4f0e93ff-d320-454d-b00a-865dac727d0c

---------

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Co-authored-by: Scott Hanselman <scott@hanselman.com>
@hannesrudolph
chore: align pull request template (openclaw#979)
9169355 
* chore: align pull request template

* chore: preserve Windows validation in PR template
@dependabot
build(deps): bump github/gh-aw-actions/setup-cli from 0.82.2 to 0.82.8 (
76d21b9 
openclaw#975)

Bumps [github/gh-aw-actions/setup-cli](https://github.com/github/gh-aw-actions) from 0.82.2 to 0.82.8.
- [Release notes](https://github.com/github/gh-aw-actions/releases)
- [Changelog](https://github.com/github/gh-aw-actions/blob/main/CHANGELOG.md)
- [Commits](github/gh-aw-actions@3fac1cf...99d9d88)

---
updated-dependencies:
- dependency-name: github/gh-aw-actions/setup-cli
  dependency-version: 0.82.8
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@dependabot
Bump GitVersion.MsBuild from 6.8.1 to 6.8.2 (openclaw#976)
f206602 
---
updated-dependencies:
- dependency-name: GitVersion.MsBuild
  dependency-version: 6.8.2
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@dependabot
Bump gitversion.tool from 6.8.1 to 6.8.2 (openclaw#977)
9c04f3e 
---
updated-dependencies:
- dependency-name: gitversion.tool
  dependency-version: 6.8.2
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@dependabot
Bump Microsoft.ML.OnnxRuntime from 1.27.0 to 1.27.1 (openclaw#978)
77c4244 
---
updated-dependencies:
- dependency-name: Microsoft.ML.OnnxRuntime
  dependency-version: 1.27.1
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@karkarl
karkarl marked this pull request as ready for review July 13, 2026 21:24
RomneyDa and others added 6 commits July 14, 2026 08:22
@RomneyDa
docs: add Crabbox Windows validation skill (openclaw#982)
785facf 
* docs: add Crabbox Windows validation skill

* docs: clarify Crabbox provider authentication

* docs: harden Crabbox validation paths

* docs: add native Windows Crabbox setup
@bkudiess
Add architecture ledger and shared test fixtures (refactor PR 1) (ope…
af96e1f 
…nclaw#990)

Foundation for the god-object refactor's anti-regression mechanism.

- docs/ARCHITECTURE.md: living ownership ledger (schema + rows) and AGENTS.md pointer
- ArchitectureLedgerConsistencyTests: validates ledger schema, guard-test Type.Method
  format, and that named guard tests actually exist in the tests source
- tests/OpenClaw.TestSupport (Shared-only): TempDirectory, EnvironmentScope, CliHarness,
  FakeMcpServer, SettingsDataBuilder
- GatewayRecordBuilder lives in OpenClaw.Connection.Tests so the shared lib stays
  Connection-free (no transitive Connection dep on CLI tests)
- Migrated GatewayRegistryTests to TempDirectory; de-duplicated the WinNode FakeMcpServer

No production (src/) changes: tests and docs only.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
@karkarl
Fix WhatsApp pairing failure to show actionable recovery (openclaw#957)…
af024ea 
… (openclaw#988)

When starting WhatsApp/web-login QR pairing against a gateway that has no
web-login provider loaded, the Channels page dumped a raw
System.InvalidOperationException plus a .NET stack trace containing internal
CI build paths, instead of actionable recovery.

Root cause is a Windows-node UX defect, not a WhatsApp-API workaround: the
'web login provider is not available' message is gateway-generated and relayed
by the node, but the node (1) leaked its own stack trace via
RawResponse = ex.ToString() and (2) never translated the known gateway signal
into recovery.

Changes:
- WebLoginStartResult gains two detection properties mirroring
  ChannelStartResult.LooksLikeMissingPlugin: LooksLikeMissingWebLoginProvider
  (provider not loaded -> install guidance) and LooksLikeWebLoginUnsupported
  (gateway too old to implement web.login -> upgrade guidance).
- OpenClawGatewayClient web-login catch blocks surface ex.Message instead of
  ex.ToString(), so no internal stack trace / build paths reach the UI.
- ChannelsPage renders distinct, actionable recovery (copyable install command
  or upgrade guidance) and keeps the clean gateway detail in the collapsed
  diagnostic.
- Adds Shared detection tests and a Tray source-contract test.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
@calebeden
feat: add operator and node gateway lifecycle telemetry (openclaw#986)
0d1c8e3 
* Add gateway lifecycle telemetry

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: 23d8c6ac-3d44-4b96-adfe-1e8509594f79

* Preserve telemetry state ordering

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: 23d8c6ac-3d44-4b96-adfe-1e8509594f79

* Preserve ambient trace context

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: 23d8c6ac-3d44-4b96-adfe-1e8509594f79

* Instrument node connection lifecycle

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: 23d8c6ac-3d44-4b96-adfe-1e8509594f79

* Stabilize telemetry concurrency test

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

Copilot-Session: 23d8c6ac-3d44-4b96-adfe-1e8509594f79

---------

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
@karkarl @arturict
@bkudiess
fix(chat): replace NativeElement escape hatch with FunctionalUI Combo…
a0042af 
…Box primitive (supersedes openclaw#973) (openclaw#991)

* fix(chat): keep session picker stable during renders

* fix(chat): stabilize native session picker host

Keep the session picker ComboBox attached as a declarative native child across FunctionalUI renders, and harden native control lifecycle handling for mount, ownership, and event routing.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

* fix(ui): clean up native controls across render paths

* refactor(chat): replace NativeElement escape hatch with FunctionalUI ComboBox primitive

The openclaw#970 fix originally reached around FunctionalUI with a raw NativeElement
snapshot to keep the session picker open across status re-renders. Promote that
into a first-class rich ComboBox primitive so re-render stability is a framework
guarantee, not a per-call escape hatch.

- Add ComboItem + ItemComboBoxElement with static ItemsEqual; ConfigureItemComboBox
  only rebuilds items when the list actually changes, preserving an open flyout.
- Migrate both the session picker and the model picker (which had the same
  unfixed openclaw#970-class bug) onto the primitive.
- Remove NativeElement and its tests entirely.
- Add pure ItemComboBoxTests and source-contract ComposerSessionPickerTests
  guarding against escape-hatch regressions.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>

---------

Co-authored-by: arturict <arturict@users.noreply.github.com>
Co-authored-by: bakudies@microsoft.com <bakudies@microsoft.com>
Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
@karkarl @shanselman
Apply design-system composer to app chat UI
6220c85 
Rebase the final composer redesign onto current main, preserve the
FunctionalUI picker fix, stabilize menu flyouts across rerenders, localize
Chat settings, and retain current speaker and Send/Stop behavior.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: fef25ef9-fa78-442c-beb0-d0a6f9a8fb92
@shanselman
shanselman force-pushed the karkarl-winui-composer-design branch from 8434453 to 6220c85 Compare July 15, 2026 00:34
@github-actions

github-actions Bot commented Jul 29, 2026

Copy link
Copy Markdown

This pull request has been automatically marked as stale due to inactivity.
Please update it or it will be closed.

@github-actions github-actions Bot added the stale label Jul 29, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

stale

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

5 participants

@karkarl @calebeden @hannesrudolph @RomneyDa @bkudiess