Add Console/Terminal view toggle to ConsoleLogs dashboard page

docs/specs/with-terminal.md

@@ -116,6 +116,51 @@ to connect to an arbitrary local socket — it can only ask for
 `(resource, replica)` pairs that are present in the resource snapshot
 stream.
 
+### Console / Terminal view toggle
+
+For a terminal-enabled resource the dashboard `ConsoleLogs` page mounts
+**both** `LogViewer` (the resource's standard log stream) and
+`TerminalView` (the interactive xterm.js terminal) at the same time and
+flips between them via a pair of checkable **Console logs** / **Terminal**
+items rendered inside the toolbar's options (⋯) `AspireMenuButton`:
+
+- The page defaults to **Console** on resource selection so any pre-PTY
+  hosting messages — `WaitFor` notifications, startup failures, image
+  pull progress — are visible immediately.
+- The page **auto-switches to Terminal** the first time the JS terminal
+  reports a non-`connecting` toolbar status (PTY attached). Reconnects do
+  not re-trigger the auto-switch.
+- The page **auto-switches back to Console** on either of two triggers,
+  so the user sees the final log lines including the hosting exit
+  message:
+  - The JS terminal raises `client.onExit` (PTY exited cleanly from the
+    guest side, e.g. `exit` at the shell).
+  - `OnResourceChanged` observes the resource snapshot transitioning
+    from a running state to a stopped/finished state (e.g. the user
+    presses **Stop** in the dashboard or the resource crashes before
+    the PTY reports exit). This path deliberately does **not** synthesize
+    a `connecting` toolbar status to re-arm the attach edge — a stale
+    in-flight `primary` snapshot arriving after we flip to Console
+    would then look like a fresh attach and yank the user back to
+    Terminal. Instead the `_selectedTerminalResourceStopped` gate
+    suppresses the auto-switch until the resource leaves the stopped
+    state, and the genuine WebSocket close → open on restart drives a
+    real `connecting → connected` edge which the auto-switch picks up.
+- Once the user manually picks a view from the menu the page
+  **latches** their choice for the rest of that resource's session and
+  ignores subsequent auto-switch triggers. The latch resets when a
+  different resource is selected.
+- Both views stay mounted across flips (visibility is toggled with
+  `display:none` on a wrapper `<div>`); the log subscription and the
+  xterm/HMP1 consumer session are kept alive so neither view loses
+  scrollback or has to re-handshake on toggle. After a `display:none →
+  visible` transition the page calls `refreshLayout` on the JS terminal
+  to guarantee xterm rebinds to the new available space.
+
+The console log stream is now subscribed to for terminal-enabled
+resources too (previously it was suppressed), which is what makes the
+Console view non-empty for a `WithTerminal()` resource.
+
 ## CLI
 
 `aspire terminal <resource> [--replica N]` (`Aspire.Cli/Commands/TerminalCommand.cs`)

src/Aspire.Dashboard/Components/Controls/TerminalView.razor.cs

@@ -20,6 +20,19 @@ public sealed partial class TerminalView : ComponentBase, IAsyncDisposable
     private int _terminalId;
     private string? _connectedResourceName;
     private int _connectedReplicaIndex = -1;
+    // Guards against concurrent or re-entrant initialization. OnAfterRenderAsync
+    // can fire again while the first InitializeTerminalAsync await is still in
+    // flight (Blazor does not serialize OnAfterRenderAsync calls when re-renders
+    // happen during awaits). Without this latch, the non-firstRender branch
+    // below would see _connectedResourceName == null, mistake that for "rebind
+    // needed", call ReconnectAsync, and — because _terminalId is also still 0
+    // — fall through to InitializeTerminalAsync a second time. Each
+    // initTerminal call appends a brand-new xterm host element to the same
+    // Blazor container, leaving multiple stacked terminals in the DOM that
+    // mirror the same input/output stream. This pattern is easy to trigger
+    // on a resource stop+restart where the dashboard fires a burst of
+    // resource-snapshot-driven re-renders right after the page mounts.
+    private bool _initStarted;
 
     /// <summary>
     /// Gets or sets the user-facing display name of the resource that owns the
@@ -45,6 +58,16 @@ public sealed partial class TerminalView : ComponentBase, IAsyncDisposable
     [Parameter]
     public EventCallback<TerminalToolbarState> OnToolbarStateChanged { get; set; }
 
+    /// <summary>
+    /// Raised when the JS side reports that the workload (PTY) has exited.
+    /// The host page subscribes so it can auto-switch the view back to the
+    /// resource's console logs — the workload has stopped producing
+    /// terminal bytes and the final exit code / hosting messages live in
+    /// the console log stream.
+    /// </summary>
+    [Parameter]
+    public EventCallback<TerminalExitInfo> OnExited { get; set; }
+
     [Inject]
     public required IJSRuntime JS { get; init; }
 
@@ -60,12 +83,25 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
 
         if (firstRender)
         {
+            _initStarted = true;
             await InitializeTerminalAsync();
             _connectedResourceName = ResourceName;
             _connectedReplicaIndex = ReplicaIndex;
             return;
         }
 
+        // If a re-render fires while the very first initTerminal call is still
+        // in flight, do nothing here. Once that call completes the firstRender
+        // path will set _connectedResourceName / _connectedReplicaIndex and
+        // any future rebind needed will be caught on the next render after
+        // that. Without this guard the rebind branch below would re-enter
+        // initialization and stack a second xterm onto the same container —
+        // see the comment on _initStarted.
+        if (_initStarted && _terminalId == 0)
+        {
+            return;
+        }
+
         // The same TerminalView instance is reused across resource/replica
         // switches in the parent (e.g. ConsoleLogs page selects a different
         // terminal-enabled resource). Detect that here and rebind the
@@ -157,6 +193,26 @@ public async Task ReconnectAsync(string? newResourceName, int newReplicaIndex)
         }
     }
 
+    /// <summary>
+    /// Invoked by the JS terminal when the workload (PTY) exits. The JS side
+    /// also writes a "[workload exited with code N]" line into the xterm
+    /// buffer; this callback exists so the host page can react beyond the
+    /// in-terminal message (e.g. flip the visible view back to console logs).
+    /// </summary>
+    [JSInvokable]
+    public Task OnTerminalExited(int terminalId, int exitCode)
+    {
+        // Drop stale notifications that arrive after this view was rebound to
+        // a different resource/replica — the previous JS terminal id is no
+        // longer relevant to the currently displayed resource.
+        if (_terminalId != 0 && terminalId != _terminalId)
+        {
+            return Task.CompletedTask;
+        }
+
+        return OnExited.InvokeAsync(new TerminalExitInfo { TerminalId = terminalId, ExitCode = exitCode });
+    }
+
     /// <summary>
     /// Invoked by the JS terminal whenever its role/size/font state changes.
     /// Forwards the snapshot to the host page via <see cref="OnToolbarStateChanged"/>.
@@ -177,26 +233,6 @@ public Task OnTerminalStateChanged(TerminalToolbarState state)
         return OnToolbarStateChanged.InvokeAsync(state);
     }
 
-    /// <summary>
-    /// Requests primary control of the producer session. No-op if the terminal
-    /// JS module hasn't initialized yet or if we're already primary; JS
-    /// performs the authoritative role checks.
-    /// </summary>
-    public async Task TakePrimaryAsync()
-    {
-        if (_jsModule is null || _terminalId == 0)
-        {
-            return;
-        }
-        try
-        {
-            await _jsModule.InvokeVoidAsync("takePrimaryFromHost", _terminalId);
-        }
-        catch (JSDisconnectedException)
-        {
-        }
-    }
-
     /// <summary>
     /// Sets the terminal font size and switches sizing back to "Auto" (font-
     /// driven) mode. Out-of-range values are clamped by the JS side.
@@ -279,6 +315,29 @@ public async Task RefreshToolbarStateAsync()
         }
     }
 
+    /// <summary>
+    /// Asks the JS terminal to recompute its layout. Called by the host
+    /// page when the terminal element transitions from hidden back to
+    /// visible (e.g. the user flips the page-level View dropdown from
+    /// Console back to Terminal) — display:none → visible does not always
+    /// trigger ResizeObserver, so forcing a relayout here guarantees the
+    /// terminal fills the available space immediately.
+    /// </summary>
+    public async Task RefreshLayoutAsync()
+    {
+        if (_jsModule is null || _terminalId == 0)
+        {
+            return;
+        }
+        try
+        {
+            await _jsModule.InvokeVoidAsync("refreshLayout", _terminalId);
+        }
+        catch (JSDisconnectedException)
+        {
+        }
+    }
+
     private string BuildWebSocketUrl(string resource, int replica)
     {
         var baseUri = new Uri(NavigationManager.BaseUri);
@@ -357,10 +416,34 @@ public sealed record TerminalToolbarState
 
     /// <summary>Current xterm grid height.</summary>
     public int Rows { get; init; }
+
+    /// <summary>
+    /// Cols the terminal would take on if switched to Fit mode right now,
+    /// computed from the container size and the last font-driven font. 0
+    /// when calibration hasn't produced cell metrics yet. Distinct from
+    /// <see cref="Cols"/>, which reflects the actual current grid (which
+    /// may be locked by a fixed preset).
+    /// </summary>
+    public int FitCols { get; init; }
+
+    /// <summary>Rows counterpart to <see cref="FitCols"/>.</summary>
+    public int FitRows { get; init; }
 }
 
 /// <summary>
 /// A named size preset surfaced by the JS terminal (used to populate the
 /// host page's size dropdown).
 /// </summary>
 public sealed record TerminalSizePreset(string Value, string Label, int Cols, int Rows);
+
+/// <summary>
+/// Payload pushed up from the JS terminal when the workload (PTY) exits.
+/// </summary>
+public sealed record TerminalExitInfo
+{
+    /// <summary>The JS-side terminal id that emitted the exit notification.</summary>
+    public int TerminalId { get; init; }
+
+    /// <summary>The workload's exit code, or <c>-1</c> when the JS side did not receive one.</summary>
+    public int ExitCode { get; init; }
+}