fix(control-ui): declutter Settings and make Simple/Advanced switch persistent - #100147
Conversation
…ersistent Quick Settings read as competing panels and the Appearance card wrapped/clipped its segmented controls in a narrow side column. Switching to Advanced also had no visible way back — the only return was a "Quick Settings" link buried in the accordion nav. - Replace the one-way "Advanced" button and buried accordion back link with a persistent Simple/Advanced switch in the page header, mirrored into an in-body row at the mobile breakpoint where the header is hidden. - Give Appearance a full-width auto-fit grid so Theme/Mode/Roundness/Text size never wrap or clip. - Drop the duplicate Context Profile side panel for a compact summary line, and only show "Pending" when a change is actually staged (pass savedConfigObject). - Remove the redundant in-page "Quick Settings" heading and unused preset copy. Closes #100145
|
Codex review: needs maintainer review before merge. Reviewed July 4, 2026, 10:49 PM ET / 02:49 UTC. Summary PR surface: Source -348, Tests -6. Total -354 across 6 files. Reproducibility: Do we have a high-confidence way to reproduce the issue? Yes, at source level: current main still has the quick-only Advanced button, the buried accordion return link, the narrow Appearance side stack, and the missing saved-config comparison path described by the linked issue. Review metrics: none identified. Root-cause cluster Members:
Proposal only: this assessment does not dispatch repair, suppress jobs, mutate sibling items, close, or merge anything. Merge readiness Overall follows the weaker of proof and patch quality, so missing proof can cap an otherwise strong patch. Rank-up moves:
Next step before merge
Security Review detailsBest possible solution: Have maintainers review and land this PR as the linked Settings UX fix after protected-label handling; no separate automated repair is needed. Do we have a high-confidence way to reproduce the issue? Do we have a high-confidence way to reproduce the issue? Yes, at source level: current main still has the quick-only Advanced button, the buried accordion return link, the narrow Appearance side stack, and the missing saved-config comparison path described by the linked issue. Is this the best way to solve the issue? Is this the best way to solve the issue? Yes; moving the mode switch to AGENTS.md: found and applied where relevant. Codex review notes: model internal, reasoning high; reviewed against 58d707fbed34. Label changesLabel justifications:
Evidence reviewedPR surface: Source -348, Tests -6. Total -354 across 6 files. View PR surface stats
What I checked:
Likely related people:
What the crustacean ranks mean
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
Review history (1 earlier review cycle)
|
…ersistent (openclaw#100147) Quick Settings read as competing panels and the Appearance card wrapped/clipped its segmented controls in a narrow side column. Switching to Advanced also had no visible way back — the only return was a "Quick Settings" link buried in the accordion nav. - Replace the one-way "Advanced" button and buried accordion back link with a persistent Simple/Advanced switch in the page header, mirrored into an in-body row at the mobile breakpoint where the header is hidden. - Give Appearance a full-width auto-fit grid so Theme/Mode/Roundness/Text size never wrap or clip. - Drop the duplicate Context Profile side panel for a compact summary line, and only show "Pending" when a change is actually staged (pass savedConfigObject). - Remove the redundant in-page "Quick Settings" heading and unused preset copy. Presentation-only within ui/src/pages/config; net -354 non-test LOC. Closes openclaw#100145.
…, rebased on refactored view) Rebased onto the current Settings view after the openclaw#100147 declutter + Control UI architecture refactor moved the toolbar. Routes the Settings toolbar chrome through `t("settings.*")` in `ui/src/pages/config/view.ts`: Form/Raw mode toggle + tooltips, unsaved-changes/no-changes badge, raw-mode-disabled notice, Open/Clear, Apply/Applying, Update/Updating, and the search input placeholder/aria labels (Save uses the existing `common.save`/`common.saving`). Adds the `settings` block to `en.ts` and regenerates locale bundles + `.i18n` metadata via `pnpm ui:i18n:sync`. zh-CN and zh-TW resolve to native translations from the translation memory (表单/原始/清除/应用/更新/搜索设置…); remaining locales fall back to English pending the provider-backed translation pass, per the documented i18n pipeline. `ui:i18n:check` clean, `ui:build` passes.
Closes #100145
What Problem This Solves
Fixes an issue where the Control UI Settings page (
/config) was cluttered and had a one-way trap into Advanced mode.Why This Change Was Made
The redesign turns Quick Settings into a calmer dashboard and makes the simple/advanced choice a persistent, symmetric control:
config-page.ts), replacing the one-way "Advanced ›" button and the buried in-accordion "Quick Settings" back link. A mirrored in-body toggle row shows only at the mobile breakpoint, where the page header is hidden — so mobile users are never stranded in Advanced mode.savedConfigObjectis now passed so the diff is real).No config, protocol, or storage contract changes — this is presentation only within
ui/src/pages/configand its stylesheet.User Impact
Evidence
Before / After — Quick Settings (desktop)
Advanced view — the way back
Mobile — the page header is hidden at ≤768px, so the switch is mirrored into an in-body row (verified in Advanced mode; the Simple button returns to the quick view):
Validation (local, worktree checkout against a scratch gateway):
node scripts/run-vitest.mjs ui/src/pages/config/quick.test.ts ui/src/pages/config/presets.test.ts→ 19 passednode scripts/run-vitest.mjs ui/src/pages/config/view.browser.test.ts→ 27 passednode scripts/run-tsgo.mjs -p tsconfig.core.json→ clean (coversui/**)oxfmt --checkon all touched files → cleanautoreview --mode local) → clean after the mobile-visibility fix (it caught the original header-only toggle stranding mobile users; addressed by the mirrored in-body row).