Why: avatars, cards, and settings are base capabilities now (user
decision 2026-09-30); the host must eat its own dogfood so plugins get
the identical surfaces.
Evidence:
- Local icons.tsx removed; Icon/Avatar/BrandMark/primitives/Settings
Shell imported from @ui; message stream gains avatar columns (user
initial from /api/me name, assistant brand mark); SettingsModal
rebuilt on SettingsShell (side-nav sections with badges, EmptyState
for plugins, iconified actions); AdminUsersModal rows show shared
avatars.
- tsconfig paths pin react/react-dom types to the frontend copy — the
source-composed ui package otherwise resolves a second @types/react
through its own node_modules during make frontend (npm ci), which
breaks type identity (surfaced by SVGProps crossing the boundary);
vite dedupe already guarantees one runtime copy.
- Headless on the real binary: avatar columns render, settings shell
switches sections with badges, admin rows show avatars, zero console
errors; build + vitest green.
Impact: visual/structural only; no API or state changes.
Refs: Agent-System-Documents proposal 2026-09-30-ui-redesign-and-auth.md
Why: user feedback (2026-09-30) — the UI still lacked the polish and
modern feel of ZCode; per its design system (calm/dense/operational)
this is the R4 visual convergence pass.
Evidence:
- New icons.tsx: 32 Lucide-style linear SVG icons replacing every emoji/
glyph (grep for the old glyph set now returns 0 in components); brand
mark + workspace-icon mapping shared by sidebar, rail, login, menus.
- Login/change gates gain a wide-screen brand panel (gradient + radial
glows + feature list), segmented tabs, focus-ring inputs, glowing
submit; sidebar gets a solid accent New Task CTA, inline-icon search,
selected task with accent bar, hover-reveal row actions, account
footer chips; chat area gains floating rounded composer with focus
glow, calmer header/tool blocks, greener HITL confirmations, empty
state mark; modals gain backdrop blur + spring-in.
- Two headless review iterations on the real binary (--auth on, both
themes): fixed bubble padding, headline break, and lifted the panel
step for clearer three-column separation; final walk shows 21 SVGs,
zero leftover glyphs, zero console errors, build + vitest + full make
test green.
Impact: pure visual layer (CSS + icon components + class-level JSX);
no behavior, API, or state changes; both themes driven by the new token
scale in the ui repo.
Refs: Agent-System-Documents proposal 2026-09-30-ui-redesign-and-auth.md (R4)
Why: accounts are admin-issued (user decision 2026-09-30, no self
registration); initial and admin-reset passwords must force a change on
first login.
Evidence:
- LoginPage: password (primary) + API key tabs; ChangePasswordGate
blocks the app until the forced change completes (mismatch/length
validation inline); App auth state machine checking -> login ->
mustchange -> ok, session cookie flows through fetch automatically.
- Account menu gains change-password and admin-only user management;
AdminUsersModal: create account (random initial password generator,
admin checkbox), reset password, status table (ADMIN/USER, pending
change chips).
- Fixed a real bug found in the headless walk: menu toggles passed
e.currentTarget into the setState updater where React nulls it by
render time, so anchor was null and the menu never rendered; capture
the element before the updater.
- Headless journey on the real binary with --auth on: admin bootstrap
via CLI -> first-login forced change -> app; admin creates bob (bob
sees no user management); alice reset via CLI -> forced change on
next login; API-key tab login; logout; zero console errors. npm run
build + vitest green; make test full suite exit 0.
Impact: replaces the old API-key-only LoginGate; embedded no-auth mode
unchanged (no login page shown).
Refs: proposal 2026-09-30-ui-redesign-and-auth.md section 5 (R2,
admin-issued variant)
Why: creation entries were split (project + at sidebar top-left, new
session at bottom-left) and the project tree forced per-project
navigation; the approved option A design makes one primary New Task
entry, organization a view mode, and identity always present.
Evidence:
- New TaskSidebar: single New Task split button (current-project context,
Cmd-N, secondary menu for new project / new task in project), project
<-> timeline organization with persisted collapse, pinned section,
archive view toggle, hover row actions, account footer fed by
/api/me (embedded mode shows local tenant; logout clears the key),
workspace icon strip retained (D25 shared list with Cmd-1..9).
- store: tasks = cross-project list via GET /api/conversations; openTask
switches project context; pin/archive optimistic + refresh; last
project context persisted; stale conversations field removed.
- tasklist.ts pure helpers + 6 vitest cases; npm run build passes;
headless walk on the real binary: cross-project open, pinned-first,
archive hide/show/restore, new-task flow, zero console errors.
Impact: ProjectNav removed; contracts.ts regenerated from core
(pinned/archived); no composer/right-pane changes (D25/D26/D31 intact).
Refs: Agent-System-Documents docs/proposals/2026-09-30-ui-redesign-and-auth.md