V2(ui): progressively harmonize the CodeNomad interface - #667
V2(ui): progressively harmonize the CodeNomad interface#667pascalandr wants to merge 21 commits into
Conversation
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33344555532 Artifacts expire in 7 days.
|
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33348221480 Artifacts expire in 7 days.
|
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33366562540 Artifacts expire in 7 days.
|
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33377154527 Artifacts expire in 7 days.
|
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33388869645 Artifacts expire in 7 days.
|
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33395095464 Artifacts expire in 7 days.
|
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33399030995 Artifacts expire in 7 days.
|
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33564958224 Artifacts expire in 7 days.
|
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33845879740 Artifacts expire in 7 days.
|
1 similar comment
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33845879740 Artifacts expire in 7 days.
|
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33845879740 Artifacts expire in 7 days.
|
Harmonize application surfaces, message chrome, project tabs, and right-panel tabs around the persisted theme palette. Active tabs now use neutral palette borders, project overflow scrolls from the top, and one-pixel seams and vertical overflow are removed. Extend embedded color schemes with editable overrides, named preset creation, reset and deletion flows, and light/dark selection persistence. Keep preference-window lifecycle handling aligned across Electron and Tauri and localize the new settings actions. Cover preset normalization, embedded overrides, and theme application regressions. Validated with the UI test suite, UI typecheck and production build, runtime palette flows, visual desktop checks, and git diff validation.
Prevent empty timeline frames by carrying Virtua measurement caches across keyed window replacements, keep directional bottom pins from moving upward, and restore escaped message anchors when the composer changes the viewport height. Preserve saved scroll snapshots while instance state is rehydrated. Harden Developer Mode discovery for concurrent sessions and worktrees by pruning dead local registrations, bounding registry reads, isolating inspected bridge pins per plugin setup, and requiring a genuinely new native generation after restart. Preserve the raw executable path when native canonicalization fails. Cover follow pin behavior, escaped snapshot persistence, parallel session isolation, registry pressure, distractor bridges, and restart generation filtering. Validated with UI and server typechecks, 646 UI tests, 8 automation plugin tests, 139 Rust tests, packaged release builds, and a runtime resize smoke test.
Move the shared horizontal scrollbar above both project tabs and right-panel tabs by applying matching vertical transforms to the scroll container and strip. Reserve the configured scrollbar height above project tabs while preserving the existing overflow and seam corrections. Validated with UI and Tauri release builds plus runtime overflow measurements for both tab bars.
Unify workspace chrome, tabs, panels, dialogs, notifications, messages, tool status, and startup surfaces around the shared square, low-density visual grammar. Keep agent, model, and thinking selectors in the composer footer, preserve keyboard focus behavior, and expand critical panel controls to touch-safe targets without loosening the mouse layout. Align the OpenCode V2 integration with beta-19059 by coalescing plugin activation waits for location-scoped catalogs, invalidating the affected metadata after native updates, preserving compacted model state, and fencing stale client or Location responses. Harden fs.list and session import authorization at the proxy boundary, and keep Windows process identity checks equivalent across Electron and Tauri. Remove the obsolete notification settings modal, localize link-open failures in every supported locale, and extend CI coverage for themes, plugin activation, metadata races, proxy ownership, and cross-host lifecycle behavior. Validated with workspace and server typechecks, UI and Tauri release builds, 36 pure UI tests, 99 browser-runtime UI tests, 42 focused server tests, desktop packaging invariants, the broader native/server/UI suites, release palette and responsive sweeps, and git diff --check.
d9177cc to
05027df
Compare
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/33866292752 Artifacts expire in 7 days.
|
Place the existing session-scoped worktree selector beside the agent, model, and thinking controls below the prompt so location context remains available where messages are composed. Keep the no-session draft on the safe three-control layout, and switch the active-session footer to a weighted four-column grid. Hide only the visible selector prefixes when the composer is 640px wide or narrower, preserving selected values and accessible names while avoiding cramped labels with open side panels and on mobile. Validated with the UI typecheck and production build, the Windows Tauri release and NSIS build, exact 640/641px breakpoint checks, wide and compact release screenshots, and 320x800 overflow verification.
Remove the entire redundant worktree footer beneath the session list now that worktree context lives below the prompt. Restore the timeline rail to 40px without changing compact-layout hiding or coarse-pointer behavior. Align Settings navigation with shared window primitives and improve standalone/mobile bounds and section scrolling. Let notification toolbars and long messages wrap, preserve nested keyboard actions, and keep touch and keyboard delete controls visible. Independent gatekeeper review identified one P2 focus-loss risk when Mark all read disabled itself. Use guarded aria-disabled semantics so activation preserves keyboard focus. UI typecheck, production UI build before the final accessibility adjustment, five timeline/sidebar tests, and diff checks passed. Native visual validation of these window changes remains pending.
Gatekeeper review - UI follow-upReviewed the six-file follow-up for sidebar/footer removal, the 40px timeline, Settings window layout, and Notifications keyboard/responsive behavior. Finding and resolution
No other actionable regressions were identified by the independent reviewer. Nested notification actions retain native Enter/Space behavior; Escape/focus return and Settings dirty-state guards remain intact. Validation and limits
Maintenance notes: settings-screen.css is approximately 848 lines; toast-history.css approximately 283 lines exceeds the preferred focused-CSS size. No size-only refactor included. Do not merge until final visual approval. |
Bring the merged binary compatibility, startup shell, Tauri window capture, and Linux automation registry fixes into this PR without changing its feature scope. Resolve the automation test overlap by retaining per-test registry isolation and the upstream temporary-root assertion. Windows and Linux registry variables are restored, and WSL discovery is disabled only inside isolated test fixtures so tests cannot touch the real desktop registry. Validation: all eight automation plugin tests pass; server and UI TypeScript checks pass; git diff --check passes. This conflict-resolution commit is not a final native-release gatekeeper approval.
Keep session rows on one line with colored kind icons, truncated titles and right-aligned badges. Show direct actions while their measured content fits, then fall back to an overflow menu without losing keyboard focus or unmounting an open virtualized row. Restore compact 12px action icons with muted idle colors and preserve larger touch targets. Apply measured overflow to message and tool headers rather than a global narrow-column breakpoint. Add a transcript filter popover with separate visibility and expansion controls, backed by the same profile-wide preferences as Chat settings. Preserve other effective settings when customizing a single tool, guard asynchronous saves, and provide labels in all ten locales. Separate tool presentation metadata from renderer imports so the shared visibility model can be tested independently. Extend the 40px timeline alongside the composer through a session-owned portal mount while retaining compact-layout hiding and the standalone fallback. Use muted colored timeline icons, interaction-only frames and subtle separators. Restore stemmed panel and floating-scroll arrows, scoped round controls and the shared selector chevron transition after moving controls below the prompt. Keep panel headers at 60px and give right-panel tabs the same height as project tabs. Reserve the horizontal scrollbar lane without forcing a visible scrollbar or shifting tabs when overflow appears. Correct active-tab junctions and the duplicate central header border. Restore internal Status cards with half-opacity borders instead of framing entire accordion content regions. Validation: UI typecheck and production build; 12 focused visibility, timeline, sidebar and drawer tests; 13 Edge/CDP session-action overflow and focus checks; translation key parity across ten locales; git diff --check. Verify the compiled UI in an isolated native profile, including tab heights and enlarged junctions, conditional scrollbars, filter states and Escape focus return, selector rotation, full-height timeline and muted session actions. Existing desktop processes and the shared OpenCode daemon were not stopped. Do not merge PR #667 in this commit.
Restore distinct transcript, composer and tool surfaces instead of flattening messages onto the darkest canvas. Add six soft light and four soft dark families inspired by documented Zed references, retaining the historical palette surfaces in a separate picker group. Keep user/agent identity separate from neutral selection and functional colors, with readable primary and muted text verified across actual surfaces rather than swatches alone. Preserve saved custom data while removing the empty default Custom duplicate. Render Classic edits, keep System automatic, and save System customization as a named fixed appearance. Await palette writes, retain errors, and keep the editor swatches consistent when a named preset is deleted. Translate names and grouping across all ten locales; document reference attribution. Include the validated session hierarchy follow-up: parent-aligned pixel-rounded branches at every depth, shorter connectors with corresponding child indents, and selection/RTL/touch geometry. Place transcript filters at the far right of the header with the shared icon-button treatment, a compact intrinsic-height popup, and accessible hidden explanatory text. Attenuate the Sessions title without changing its typography or validated panel/tab geometry. Validation: UI typecheck and production build; 69 targeted palette/transcript/ timeline/drawer tests; 17 native palette captures with hover/focus and distinct transcript/composer checks; 14 native settings checks; eight independent Edge pointer/RTL/width cases with touch targets at least 40px. The earlier hierarchy pass covered 584 mouse/touch geometry checks and 13 measured-overflow checks. Only the isolated profile's UI resources were refreshed: no running desktop host or shared OpenCode service was stopped or restarted.
Keep dev's Chat item order and translated labels in the shared preferences/popup model. Preserve the UI branch's activation barrier and non-generating command admission while integrating dev's serialized undo interruption/wait/retry and authoritative history fixes. Keep both fork/undo regression coverage and plugin-activation tests rather than choosing one conflict side. Validation: UI typecheck and 130 targeted tests passed with browser conditions and test-force-exit for store-owned handles. No desktop instance or shared OpenCode daemon was stopped. The merge updates the PR branch only; it does not merge PR #667 into dev.
Separate appearance mode from remembered light and dark palette selections, move palette controls first in General, flatten filtered choices, and preserve legacy custom colors and preset identities across edits and reloads. Restore V1 Classic light and dark defaults and place Classic first in each appearance list. Unify header and composer chrome through shared shade tokens, keep local subtle hover overlays above selections, and derive YOLO from the main accent without deleting legacy customization data. Simplify surface labels across all locales and align preferences with main panel surfaces. End the timeline at the composer footer boundary with resize-aware positioning and a blank chrome continuation below. Flatten and align composer buttons, restore the overflow menu width, remove bottom padding artifacts, and add shared separators. Attenuate usage metrics and add accessible colored participant icons to message headers. Add appearance migration, queued persistence, Classic mapping and browser palette coverage. Latest verification includes 71 passing targeted tests, UI typecheck and production build; earlier 26 browser checks precede final visual refinements. Document validation scope and refresh the beta client lock. Isolated renderer resources were updated without restarting the shared daemon or discarding drafts.
Keep search selection checkboxes on the root inline axis instead of indenting them with child sessions. Reserve selection space independently so expanders and labels retain their hierarchy in both LTR and RTL. Remove decorative tree connectors and the special first-child offset. Every child now advances by the same pixel-aligned step, while touch expander sizes remain unchanged. UI typecheck, production build and diff checks passed. Checkbox alignment was checked in mouse/touch and LTR/RTL fixtures before the subsequent connector removal; the final hierarchy change has not had a full browser regression run.
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/34403472302 Artifacts expire in 7 days.
|
Reconcile the latest dev changes with UI harmonization without dropping either test added to the PR validation workflow. Retain the existing theme-scheme regression suite alongside dev's new server-meta retry test. Includes upstream network/IPv6 and diagnostic settings updates, preserving the already published Turkish translations and approved palette, composer and session-tree changes. No product-code conflict required manual resolution. Validated workflow YAML and asserted both test paths occur exactly once. All 21 tests in the two conflicting suites passed, UI typecheck passed, and staged diff checks are clean. Full CI remains to run on the merge commit.
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/34408318525 Artifacts expire in 7 days.
|
## Summary Follow up on the MMB, wheel and keyboard scrolling regressions reported after #683. - Keep middle-button drags on the scrollers selected at pointerdown until release, even when the pointer leaves their bounds. Resolve horizontal and vertical owners independently for wide code nested inside a vertically scrolling shell. - Keep a continuous vertical wheel gesture on its starting scroller so a shell passing under a stationary pointer cannot steal it. Allow ancestor chaining at an edge; leave horizontal/Shift-wheel, zoom and uncancellable events to the browser. - Replace an outstanding Virtua imperative scroll only once on user intent instead of issuing `scrollBy(0)` on every wheel/key event and creating another measurement-time pin. - Leave navigation keys with a nested scroller that can consume them, and respect events already prevented by descendant controls. - End captured MMB gestures on release, cancellation, lost capture, blur, hidden/detached content or cleanup. Preserve normal link, editor and control behavior. ## Review and regressions Review identified three additional defects, each reproduced by a failing browser test before correction: 1. Horizontal code could swallow vertical MMB movement intended for the containing shell. 2. Hiding a session did not terminate its captured MMB gesture. 3. A prevented `Home` event could still navigate the transcript. The subsequent scoped review identified no remaining actionable findings. Existing MMB tests now drive actual mouse movement rather than writing `scrollTop` to simulate the drag. Tests exercise the real Solid virtual list/follow controllers and a real `ToolCall` fixture. ## Validation Validated source: `5b1926cf8e9464a8828ff68ec33852ca94567950`. - 43/43 Chromium browser tests, in two complete runs. - 57/57 focused virtual-scroll behavior, measurement and reader-settlement tests. - UI and Electron typechecks. - Windows Tauri release build (`--no-bundle`). - 14 targeted checks in the rebuilt Tauri/WebView2 application: both MMB starting zones, release, stationary-cursor wheel routing across a passing shell, six navigation keys in a focused shell, and repeated transcript Arrow/Page keys. - Verified that the loaded source maps match the reviewed source files; captured native screenshot evidence. - `git diff --check`. Native release executable SHA-256: `BC2EDF02138440691008DD1E1F4B28EF12E5C76555F681D299D6ED8827013735`. These are targeted checks, not a claim of exhaustive desktop or cross-platform coverage. An initial native test run lost its target DOM element; the completed-shell-targeted rerun passed all 14 checks. The user's separate UI #667 executable was restored unchanged after validation; no UI-worktree changes are included here. GitHub CI remains separate from these local checks. ## Scope / maintenance Only four files change. No preferences, translations, dependencies or native-host implementation changes. `packages/ui/src/components/virtual-follow-list.tsx` is an existing oversized file (~1,188 lines); the gesture routing is isolated in a focused helper rather than adding a general refactor.
Capture every built-in light and dark palette from an isolated native UI Harmonisation Tauri build with English application chrome. Keep CodeNomad, OpenCode, Gaffer, Blender and OpenWork open and vary the active project, session, right-panel tab, popover and Preferences section for the PR demonstration. Include losslessly optimized full-resolution PNGs, dark/light contact sheets, an offline HTML gallery and a capture manifest. Document that conversations retain their original language and that the local build includes the follow-up tab-scroll refinements. Verify all seventeen palette IDs are unique, all captures are 1584x1031, five project tabs remain open throughout and all five projects appear as the active workspace. Review contact sheets and retake loading-state captures before publication.
Integrate dev ea37f97 and its opt-in selective-pruning RPC implementation into UI Harmonisation. Resolve the lockfile overlap by retaining the complete npm/plugin dependency graph and the shared beta-19271 client, protocol and schema versions; keep palette, server-metadata and native pruning CI coverage. Preserve the connected transport setup in the projection regression. The installed client immediately projects a model switch and performs one authoritative message read, so assert exactly one SDK-owned refresh at the rotation boundary rather than incorrectly expecting none. Validated with npm ci --ignore-scripts, UI/Electron/server typechecks, pruning bundle compilation, 103 server/palette tests, 70 browser-condition store integration tests and four desktop dependency-closure tests. Workflow YAML and diff checks pass.
MCP enable switches used the same SUID component as Yolo but still inherited the blanket square-corner override. Move switch geometry into a shared component stylesheet so both controls use the same circular thumb and rounded track across on, off and disabled states. Keep caller-owned accent/status colors and native input handlers intact. Document the shared switch exception in the styling conventions. Checked the rendered SUID controls in light and dark appearance and built the production UI successfully.
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/34473718625 Artifacts expire in 7 days.
|
Use one Lucide icon map for the message-content menu, timeline, and nested task rows, preserving the underlying tool icon while permission styling supplies its status color. Raise resting timeline visibility and give session status tags one current-color outline treatment. Restore the localized user speaker label, place queued prompt status in the header immediately before its actions, and remove the synthetic sending indicator without affecting real assistant generation. Extend the browser regression to verify the queued placement and absence of the false status. Validated with the UI typecheck, focused timeline and visibility tests, the delayed-admission browser test, and a Tauri release build.
|
PR builds are available as GitHub Actions artifacts: https://github.com/NeuralNomadsAI/CodeNomad/actions/runs/34486376953 Artifacts expire in 7 days.
|
Promote the fourteen saved palette calibrations into the built-in defaults without changing stable IDs. Put language first, align the palette picker and its actions beside two rows of half-height color wells, and have Auto follow the resolved system appearance through a single mode control. Update the explanatory text in all ten locales and preserve dirty drafts when the system appearance changes. Finish the shared chrome polish: tags, status labels, context and token counters use one radius token; project and right-panel tabs use the same upright TabScroll primitive. Native scrollbars remain above the content, with fractional overflow measurement that avoids false scrollbars when tabs fit and preserves wheel, keyboard, RTL, drag-reordering and touch behavior. Document the profile-only cleanup of the legacy saved customization and Iris 2 experiment. Saved contrast choices are retained exactly, with exceptions bounded to their palette, field and color pair; all unrelated emphasis fields retain their contrast guards. An independent gatekeeper found an overbroad test exemption in round one; after correction, round two reported no actionable findings and confirmed a 1:1 status-color mutation is rejected. Validated UI typecheck and production build, 60 palette/theme tests, both appearance browser tests including the seventeen-palette hover matrix, all five tab tests including Electron native zoom, and 24 English/French/Hebrew responsive layout combinations. Refreshed and restarted the usual Tauri profile and verified palette cleanup and the final settings layout.
Goal
Harmonize CodeNomad into a calm, compact workstation UI while preserving its multi-agent workflow, native OpenCode V2 behavior, and operational visibility.
Visual demo — all 17 built-in palettes
English interface · native Tauri · five real projects open: CodeNomad, OpenCode, Gaffer, Blender and OpenWork.
The workspace views alternate the selected project/session, Git, files, status, command palette, model/agent selectors and panel customization. Preferences views show different sections of the separate native Settings window. Existing conversations retain their original language.
Captured from the local UI Harmonisation release build on 10 September 2026, including the follow-up tab-scroll refinements. Click any screenshot for the 1584 × 1031 original.
Gallery and capture details · Dark contact sheet · Light contact sheet
Dark palettes (10)
CodeNomad — release summary and session status
OpenCode — database repair review and contribution guide
Gaffer — VFX architecture review and command palette
Blender — branch comparison and message-content options
OpenWork — multi-agent task review and model picker
CodeNomad — Git diff alongside the release conversation
Gaffer — integration architecture and agent picker
OpenCode — session search and documentation preview
OpenWork — multi-agent review and panel customization
CodeNomad — subagent hierarchy, selection controls and task plan
Light palettes (7)
General settings — appearance modes and original light colors
Chat settings — visibility and initial expansion of content
Notification settings — session events and sound preferences
Speech settings — transcription, playback and voice controls
CodeNomad — selected subagent and contribution documentation
OpenCode settings — runtime discovery and configuration
Advanced settings — desktop window behavior
Delivered
PromptContextControlsprimitive; narrow composers retain only the selected values.OpenCode V2 coverage
@opencode-ai/client, protocol, and schema to0.0.0-beta-19059from the root lock.beta-18230throughbeta-19059, the 52 commits frombeta-18999tobeta-19059, generated declarations, npm tarballs, OpenAPI, and official V2 docs. The release bodies are empty, so the implementation audit uses those authoritative artifacts.SessionInfo.location, and fences stale client/location responses.plugin.await-activationproxy route; generic RPC and plugin mutation routes remain blocked.fs.listand session-import ownership, including WSL path translation and NUL rejection.opencode2runtime free of an exact startup version gate and never stops the shared daemon.Optional native surfaces that do not currently change CodeNomad's product behavior—persistent PTY UI,
vcs.base, plugin package diagnostics, MCP references, typed plugin RPC, and richer plugin inventory UI—remain intentionally deferred rather than being exposed without a product use case and security review.Validation
git diff --checkMerge gate
The implementation is pushed and CI is running. Do not merge until final visual approval is given.