Repository navigation
Conversation
… row, phone top bar Sidebar on surface-2 with a hairline; the current nav item is a white pill with a 3 px accent inset bar; the wordmark reads OpenClaw Enterprise in ink. The account row shows initials, name and email, and its menu says Sign out. At phone width a 56 px top bar holds the navigation toggle, the wordmark and an avatar that opens the account menu without the drawer. The focus ring is 2 px in the new --color-focus (navy) token.
…t follow the new shell The wordmark now runs under a text Close navigation button, so the drawer's close is a 44 px icon button with the same accessible name. The Mobile drawer story clicks the toggle by class, and the Settings email checks look inside main, since the account row also shows the email.
Prettier on the touched files; the test reads computed style through globalThis. The suite entry sits after console-namespace-create, so it does not collide with open PRs that append to the end of checks-browser.
The account row's accessible name carries the signed-in person's name and email; this test's member is named late-download, so a substring match on Download found the account row too.
|
🦞👀 Pull request received. I will update this pull request when review starts. ClawSweeper review completeClawSweeper finished reviewing this revision. The review result is being finalized. |
clawsweeper
Bot
added
clawsweeper:intake:feature
|
Codex review: needs maintainer review before merge. What this changesThis PR refreshes console navigation, displays account identity, adds a phone account menu, and changes keyboard focus styling. Example: Demo Operator opens Agents at a 390 px viewport.
Review scores
ProductKind: Feature · Worth it: Yes · Fix scope: Complete Merge readiness✅ Ready for maintainer review Keep this maintainer-authored PR open: the console refresh has clear scope, and review found no actionable code defect. Priority: P3 Before mergeNone. FindingsNone. Tests
Agent review detailsHow this fits togetherThe controller serves the console shell, which turns session identity, route, and Namespace state into navigation and account controls using the existing navigation and sign-out handlers. flowchart TB
A[Session and route state] --> B[Console shell]
C[Shared stylesheet] --> B
B --> D[Desktop sidebar]
B --> E[Phone top bar and drawer]
D --> F[Navigation and account actions]
E --> F
Technical reviewBest possible solution: Keep the refresh within the existing shell and shared stylesheet while preserving menu retention, navigation guards, and server authorization. Do we have a high-confidence way to reproduce the issue? This is a presentation improvement rather than a reported runtime bug; source and inspected desktop captures establish the existing and proposed shell differences. Is this the best way to solve the issue? The implementation uses the existing shell owner and shared tokens, extracts shared account-menu behavior, and preserves the earlier retention and responsive-navigation repairs. AGENTS.md: found and applied where relevant. Codex review notes: model internal, reasoning medium; reviewed against a920060d1bd9. Provenance checked
TestingProof path: in-process harness. SecurityNone. EvidenceWhat I checked:
Likely related people:
LabelsLabel changes: No label changes. Label justifications:
Rank-up movesOptional improvements that raise the rating; they are not merge blockers.
Rating scale6/6 🦀 challenger crab · 5/6 🦞 diamond lobster · 4/6 🐚 platinum hermit · 3/6 🦐 gold shrimp · 2/6 🦪 silver shellfish · 1/6 🧂 unranked krab. Overall follows the weaker of proof and patch quality; ✨ marks media proof (a screenshot, video, or linked artifact) that directly shows the changed behavior. WorkflowClawSweeper edits this one comment on every review. Comment HistoryReviewed October 19, 2026, 9:13 PM ET / October 20, 2026, 01:13 UTC (Revision 3). |
…forced-colours text still Review nits: a menu left open in the sidebar stayed open when the layout switched to phone and reappeared in the drawer, so any layout change now closes both account menus. In forced colours the current-page bar is a border, so its padding gives the 3 px back and the text does not shift.
The sidebar mark is now the wordmark, so the build-identification note, the navigation table and the debug-fields table follow it (review item).
|
@clawsweeper re-review |
|
🦞👀 Re-review progress:
|
clawsweeper
Bot
added
clawsweeper:intake:feature
# Conflicts: # docs/reference/console/debug-fields.md
|
@clawsweeper re-review |
|
🦞👀 Re-review progress:
|
clawsweeper
Bot
added
the
clawsweeper:intake:feature
clawsweeper
Bot
removed
the
clawsweeper:intake:feature
1 participant
Problem
The console shell does not read as premium: the sidebar is the page colour, so chrome and content blur together; the current nav item is an accent-tinted pill with accent text (one of 7 accent elements on the Agents page); the brand is "OCE" in accent caps; the account control is a product-name button that never says who is signed in; and at phone width an "Open navigation" text button sits above the page header, pushing the Agents header to 245 px. The focus ring is 3 px accent, so a focused empty required field reads as a validation error.
UX spec
docs/analysis/ux-design-1019/spec.mdrow P2 (section 3.1, S1a, "warm quiet" direction V1), plus the shell-wide focus ring token (spec 6.1 Q1, provisional owner answer: 2 px navy).Change
--color-surface-2background with the 1 px--color-borderright edge. Wordmark = 20 px mascot + "OpenClaw Enterprise" in--color-text-strong,--text-basesemibold, normal case (the shared.brandrule, so the sign-in brand is ink and not caps too; its 40 px mascot and alignment are left to P11, which owns the sign-in page).--radius-md, 12 px gap, 16 px icon; the current item is a white pill,--color-text-strongsemibold, withbox-shadow: inset 3px 0 0 var(--color-accent)(square on the bar side; forced-colors gets aHighlightborder). Hover--color-surface-hover.session.user.name, email as fallback) + name (--text-basemedium) + email (--text-smmuted), both ellipsised, + chevron, on a white bordered--radius-mdcard. Its accessible name is the name and email. The menu keeps Settings; "Logout" becomes "Sign out".--color-surfacewith a hairline: icon "Open navigation" toggle (44 px, same accessible name), the wordmark, and a 44 px avatar button (Account: <name>) that opens its own account menu under it, without the drawer. Opening the drawer closes that menu. The drawer is the same sidebar; its close button is now a 44 px icon (same "Close navigation" name), because the wordmark ran under the old text button. Drawer links keep a 44 px target. Content gutters 16 px.--color-focus(=--color-info, navy) and--focus-ring: 2px solid var(--color-focus); offsets unchanged.Highlightborder inside the same padding, so the text does not move.Verification
Acceptance (spec section 5, P2), measured with the spec's
shots.mjsand a probe on the Storybook frames:#faf9f7rgb(244, 241, 236)=#f4f1ecrgb(189, 69, 49) 3px 0px 0px 0px inset, 36 px (44 in the drawer)rgb(30, 58, 95)Tests:
tests/browser/console-shell.test.mjs(mapped tochecks-browser): desktop sidebar surface, wordmark, current-nav bar, account row and Sign out; focus ring colour and width; phone top bar height, 44 px targets, avatar menu without the drawer, Escape focus return, drawer surface and 44 px links, Settings from the avatar. A fourth checks that a layout change closes the account menu it hides. All four fail on main and pass here (the fourth also fails without this PR's resize fix); 20/20 at 2 CPUs (four tests a run). The three editedconsole.test.mjstests and the edited agent-logs download test are also 20/20 at 2 CPUs.console.test.mjs(48),console-refocus-focus(6),console-drafts-kept(18),console-focus-ring(4),console-retained-revalidation(65),console-agent-presets(32),console-agent-logs(49; one member-named lookup made exact). Updated selectors only where the shell changed: the account toggle by class (it now carries the person's name), menuitem "Sign out", the sidebar wordmark text, and three Settings email checks scoped to#main(the account row shows the email too).docs-compute-matrix(github-sluggeris not installed in this local worktree), unrelated.debug-fields.mdrow, main's wording kept with "Hash beside wordmark"):console-shell20/20 again at 2 CPUs (four tests a run), and in fullconsole.test.mjs(48),console-agent-logs(49),console-agent-presets(32),console-retained-revalidation(65),console-refocus-focus(6),console-focus-ring(4),console-drafts-kept(18), plus main's newconsole-button-hierarchy(10),console-form-fields(13),console-form-fields-2(12) andconsole-namespace-create(7): all green.node scripts/ci/run-tests.mjs auditclean; prettier and eslint clean on touched files. The keycloak integration test only had its menu clicks renamed (not run locally: needs the Keycloak lane).Internal design review (screenshots against the spec and mockups): match with nits; the two code nits (menu left open across a layout change, forced-colours text shift) are fixed here, and the sign-in brand size is P11's.
Open PRs (3-way
merge-tree, conflict hunks against main vs against this head): #2972 0/0, #2596 4/4, #2524 6/6, #2445 9/9 (the suite entry sits mid-list to avoid its append), #1619 18/18, #2922, #2833, #2518, #2258, #2255, #2253 0/0, #2505 2/2, #2502 6/6, #2958 2/1, #1605 7/6, #2268 18/18. One new hunk: #906 rewrites the sameagent-details.mdparagraph ("Logout" menu); unavoidable without leaving that guide stale.Screenshots
Before / after / mockup, Agents at 1440 (Storybook "Pages/Agents · Populated"):
Agents at 390 (first screen) and the top-bar reference from the spec's phone mockup:
Account menu at 1440 and from the phone avatar, the drawer at 390, and the navy focus ring on the Create Namespace field:
Recordings (final revision): desktop account menu, keyboard and Escape focus return · phone avatar menu, drawer open, Escape and close button with focus return.
Stories: Components/Navigation · Account menu, Mobile account menu (new), Mobile drawer; Pages/Agents · Populated; Pages/Namespaces · create dialog. Mockup render liberties per spec section 2 (sample data, icon set, mascot drawing, larger wordmark) are not reproduced; sizes follow the spec (20 px mascot,
--text-basewordmark).Risks
Visual only plus two copy changes ("Logout" to "Sign out", "OCE" to "OpenClaw Enterprise"); any external script that clicked "Logout" or the "OpenClaw Enterprise" button by name needs the new names. The phone top bar has a second copy of the account menu (separate id), retained across a load's two renders like the sidebar one; focus restoration maps its items to its avatar. P3 (header and compact Namespace control) and P11 (sign-in) touch neighbouring rules and will merge on top.