fix(chat): never block composer mid-round + auto-grow, popout z-index, harness icons, home→full-screen#207
Merged
Merged
Conversation
… harness icons, home→full-screen
Five chat-composer UX fixes:
- MonacoEditorView.razor.js: auto-grow now sizes the OUTER .monaco-editor-container. The inner
.monaco-editor-view is pinned to `height:100% !important`, which overrode the inline height the
auto-grow set on it, so the box stayed at the 80px min-height and long input scrolled invisibly.
Sizing the outer container (which holds the min/max clamps, no !important) lets it grow with content.
- ThreadChatView.razor(.cs): remove the IsExecuting whole-round gate on Send + Enter. The composer
no longer blocks while a round runs — a mid-round message is accepted immediately (echoed via
PendingUserMessages) and drained when the round finishes; the input clears on submit. Esc still
cancels the in-flight round; TryBeginSubmit still dedups an accidental double-submit.
- ThreadSidePanelContent.razor.cs: a new chat started from the main/home screen (root URL) now opens
full-screen (/{threadPath}, the ApplicationPage catch-all) instead of the side panel; a "+" new
chat started inside the side panel keeps the in-panel behavior. Signal consumed first so it can't
re-navigate on return.
- MeshNodePickerView.razor.css: size inline avatar <svg> to fill the 28px box (unsized inline SVGs,
injected via MarkupString, rendered at the browser default and read as blank/generic harness icons);
lift the picker dropdown/overlay above app chrome (z-index 10000/9999) so the side-panel top bar no
longer covers the harness/model popout.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Contributor
There was a problem hiding this comment.
Pull request overview
Improves the chat/composer UX in the Blazor portal by fixing composer sizing, removing execution-time input blocking, correcting navigation behavior when starting a new chat from the home screen, and addressing picker popout/icon rendering issues.
Changes:
- Fix Monaco composer auto-grow by sizing the outer container and forcing a layout refresh.
- Allow Enter/Send submissions while a round is executing (queueing via pending messages) and adjust send-button disabled/tooltip logic.
- Update side-panel “new chat” navigation to open full-screen from the root page; raise picker dropdown z-index and constrain inline-SVG avatar sizing.
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| src/MeshWeaver.Blazor/Components/Monaco/MonacoEditorView.razor.js | Adjust auto-grow to resize the outer Monaco container and trigger layout. |
| src/MeshWeaver.Blazor/Components/MeshNodePickerView.razor.css | Constrain inline SVG avatars and lift overlay/dropdown z-index to avoid chrome overlap. |
| src/MeshWeaver.Blazor.Portal/Chat/ThreadSidePanelContent.razor.cs | Consume OpenThreadPath earlier and navigate to full-screen when invoked from the root URL. |
| src/MeshWeaver.Blazor.Portal/Chat/ThreadChatView.razor.cs | Remove “IsExecuting” gating for Enter submission; rely on submit handler + queuing behavior. |
| src/MeshWeaver.Blazor.Portal/Chat/ThreadChatView.razor | Remove “IsExecuting” from Send button disabled state and simplify tooltip text. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Test Results (shard 2) 15 files ± 0 15 suites ±0 5m 37s ⏱️ - 2m 6s Results for commit eb78aaa. ± Comparison against base commit ecb5c91. This pull request removes 145 tests.♻️ This comment has been updated with latest results. |
Test Results 54 files ± 0 54 suites ±0 17m 49s ⏱️ - 2m 28s Results for commit eb78aaa. ± Comparison against base commit ecb5c91. This pull request removes 145 and adds 3 tests. Note that renamed tests count towards both.♻️ This comment has been updated with latest results. |
…ear failure, strip query/fragment - MonacoEditorView.razor.js: guard editorInstance.layout() with getDomNode() — the editor can be disposed during the 50ms auto-grow debounce, and layout() then throws "Couldn't find the editor…". - ThreadSidePanelContent.razor.cs: log (Warning) when clearing OpenThreadPath fails instead of swallowing it — a silent failure could leave the signal set and re-navigate on the next subscribe. - ThreadSidePanelContent.razor.cs: strip query string / fragment before the root-URL "home" check so "/?x=1" or "/#y" still opens the new chat full-screen (ToBaseRelativePath keeps them). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Five chat-composer UX fixes reported during a live review.
Changes
MonacoEditorView.razor.js) — auto-grow set an inlineheighton the inner.monaco-editor-view, but CSS pins that element toheight:100% !important, which overrides an inline style — so the height was ignored and the box stayed at the 80pxmin-heightwhile long input scrolled invisibly. Now sizes the outer.monaco-editor-container(holds the min/max clamps, no!important) and re-lays out.ThreadChatView.razor+.razor.cs) — the Send button and Enter path were gated onThreadViewModel.IsExecuting, locking the composer for the whole round (only released whenStatus→Idlepropagated / a watchdog fired). Removed the gate: Enter/Send work anytime, input clears on submit (the receipt ack), and a mid-round message queues viaPendingUserMessagesand runs when the round finishes. Esc still cancels; the 500 ms same-text dedup still guards double-sends.ThreadSidePanelContent.razor.cs) — a new chat started from the root/home screen now navigates to/{threadPath}(theApplicationPagecatch-all) instead of opening in the side panel; a "+" new chat started inside the side panel keeps the in-panel behavior. TheOpenThreadPathsignal is consumed first so it can't re-navigate on return.MeshNodePickerView.razor.css) — Claude Code & Copilot embed their logo as an inline<svg>with aviewBoxbut no width/height, injected viaMarkupString(no CSS-isolation scope). Unsized, it renders at the browser default (~300×150) and overflows/collapses. Added::deep .mesh-node-picker-avatar svg { width:100%; height:100% }.MeshNodePickerView.razor.css) — the picker dropdown sat atz-index:10, under the side-panel header (10) and portal menu bar (1100). Lifted the dropdown to10000and its click-overlay to9999(the floating tier the slash-command palette already uses).Verification
MeshWeaver.Blazor.Portal) merged with currentmainunder the exact CI flags —-c Release -p:CIRun=true -warnaserror— 0 warnings / 0 errors.Note
If a harness still shows a generic bot glyph (not blank) after this, the harness nodes in that portal were seeded before the inline icons existed → stale data needing a re-seed, not this CSS.
🤖 Generated with Claude Code