Refactor console logs page to use parameters instead of ref

src/Aspire.Dashboard/Aspire.Dashboard.csproj

@@ -17,6 +17,8 @@
     Given we want to be able to support people running on environments where they only have the 9.0 SDK/runtime installed,
     we allow roll-forward to the next major in order to support these customers.-->
     <RollForward>Major</RollForward>
+
+    <DefineConstants>$(DefineConstants);ASPIRE_DASHBOARD</DefineConstants>
   </PropertyGroup>
 
   <PropertyGroup>

src/Aspire.Dashboard/Components/Controls/LogViewer.razor

@@ -8,30 +8,33 @@
 
 <div class="log-overflow console-overflow continuous-scroll-overflow">
     <div class="log-container console-container" id="logContainer">
-        <Virtualize Items="@LogEntries.GetEntries()" ItemSize="20" OverscanCount="100" TItem="LogEntry">
-            <div class="log-line-row-container">
-                <div class="log-line-row console-line-row">
-                    <span class="log-line-area" role="log">
-                        <span class="log-line-number">@context.LineNumber</span>
-                        <span class="log-content">
-                            @{
-                                var hasPrefix = false;
-                            }
-                            @if (context.Timestamp is { } timestamp)
-                            {
-                                hasPrefix = true;
-                                <span class="timestamp" title="@FormatHelpers.FormatDateTime(TimeProvider, timestamp, MillisecondsDisplay.Full, CultureInfo.CurrentCulture)">@GetDisplayTimestamp(timestamp)</span>
-                            }
-                            @if (context.Type == LogEntryType.Error)
-                            {
-                                hasPrefix = true;
-                                <fluent-badge appearance="accent">stderr</fluent-badge>
-                            }
-                            @((MarkupString)((hasPrefix ? "&#32;" : string.Empty) + (context.Content ?? string.Empty)))
+        @if (LogEntries is {} logEntries)
+        {
+            <Virtualize Items="logEntries.GetEntries()" ItemSize="20" OverscanCount="100" TItem="LogEntry">
+                <div class="log-line-row-container">
+                    <div class="log-line-row console-line-row">
+                        <span class="log-line-area" role="log">
+                            <span class="log-line-number">@context.LineNumber</span>
+                            <span class="log-content">
+                                @{
+                                    var hasPrefix = false;
+                                }
+                                @if (context.Timestamp is { } timestamp)
+                                {
+                                    hasPrefix = true;
+                                    <span class="timestamp" title="@FormatHelpers.FormatDateTime(TimeProvider, timestamp, MillisecondsDisplay.Full, CultureInfo.CurrentCulture)">@GetDisplayTimestamp(timestamp)</span>
+                                }
+                                @if (context.Type == LogEntryType.Error)
+                                {
+                                    hasPrefix = true;
+                                    <fluent-badge appearance="accent">stderr</fluent-badge>
+                                }
+                                @((MarkupString)((hasPrefix ? "&#32;" : string.Empty) + (context.Content ?? string.Empty)))
+                            </span>
                         </span>
-                    </span>
+                    </div>
                 </div>
-            </div>
-        </Virtualize>
+            </Virtualize>
+        }
     </div>
 </div>

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

@@ -2,12 +2,10 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 
 using System.Globalization;
-using Aspire.Dashboard.Configuration;
 using Aspire.Dashboard.Extensions;
 using Aspire.Dashboard.Model;
 using Aspire.Hosting.ConsoleLogs;
 using Microsoft.AspNetCore.Components;
-using Microsoft.Extensions.Options;
 using Microsoft.JSInterop;
 
 namespace Aspire.Dashboard.Components;
@@ -18,7 +16,8 @@ namespace Aspire.Dashboard.Components;
 public sealed partial class LogViewer
 {
     private readonly bool _convertTimestampsFromUtc = true;
-    private bool _logsCleared;
+    private LogEntries? _logEntries;
+    private bool _logsChanged;
 
     [Inject]
     public required BrowserTimeProvider TimeProvider { get; init; }
@@ -29,27 +28,33 @@ public sealed partial class LogViewer
     [Inject]
     public required ILogger<LogViewer> Logger { get; init; }
 
-    [Inject]
-    public required IOptions<DashboardOptions> Options { get; init; }
+    [Parameter]
+    public LogEntries? LogEntries { get; set; } = null!;
 
-    internal LogEntries LogEntries { get; set; } = null!;
+    protected override void OnParametersSet()
+    {
+        if (_logEntries != LogEntries)
+        {
+            Logger.LogDebug("Log entries changed.");
 
-    public string? ResourceName { get; set; }
+            _logsChanged = true;
+            _logEntries = LogEntries;
+        }
 
-    protected override void OnInitialized()
-    {
-        LogEntries = new(Options.Value.Frontend.MaxConsoleLogCount);
+        base.OnParametersSet();
     }
 
     protected override async Task OnAfterRenderAsync(bool firstRender)
     {
-        if (_logsCleared)
+        if (_logsChanged)
         {
             await JS.InvokeVoidAsync("resetContinuousScrollPosition");
-            _logsCleared = false;
+            _logsChanged = false;
         }
         if (firstRender)
         {
+            Logger.LogDebug("Initializing log viewer.");
+
             await JS.InvokeVoidAsync("initializeContinuousScroll");
             DimensionManager.OnViewportInformationChanged += OnBrowserResize;
         }
@@ -71,27 +76,11 @@ private string GetDisplayTimestamp(DateTimeOffset timestamp)
         return date.ToString(KnownFormats.ConsoleLogsUITimestampFormat, CultureInfo.InvariantCulture);
     }
 
-    internal void ClearLogs()
-    {
-        Logger.LogDebug("Clearing logs for {ResourceName}.", ResourceName);
-
-        _logsCleared = true;
-        LogEntries.Clear();
-        ResourceName = null;
-        StateHasChanged();
-    }
-
     public ValueTask DisposeAsync()
     {
+        Logger.LogDebug("Disposing log viewer.");
+
         DimensionManager.OnViewportInformationChanged -= OnBrowserResize;
         return ValueTask.CompletedTask;
     }
-
-    // Calling StateHasChanged on the page isn't updating the LogViewer.
-    // This exposes way to tell the log view it has updated and to re-render.
-    internal async Task LogsAddedAsync()
-    {
-        Logger.LogDebug("Logs added.");
-        await InvokeAsync(StateHasChanged);
-    }
 }

src/Aspire.Dashboard/Components/Pages/ConsoleLogs.razor

@@ -41,7 +41,7 @@
         </MobilePageTitleToolbarSection>
 
         <MainSection>
-            <LogViewer @ref="LogViewer"/>
+            <LogViewer LogEntries="@_logEntries" />
         </MainSection>
     </AspirePageContentLayout>
 </div>

src/Aspire.Dashboard/Components/Pages/ConsoleLogs.razor.cs

@@ -5,15 +5,18 @@
 using System.Collections.Immutable;
 using System.Diagnostics;
 using Aspire.Dashboard.Components.Layout;
+using Aspire.Dashboard.Configuration;
 using Aspire.Dashboard.ConsoleLogs;
 using Aspire.Dashboard.Extensions;
 using Aspire.Dashboard.Model;
 using Aspire.Dashboard.Model.Otlp;
 using Aspire.Dashboard.Otlp.Model;
 using Aspire.Dashboard.Resources;
 using Aspire.Dashboard.Utils;
+using Aspire.Hosting.ConsoleLogs;
 using Microsoft.AspNetCore.Components;
 using Microsoft.Extensions.Localization;
+using Microsoft.Extensions.Options;
 
 namespace Aspire.Dashboard.Components.Pages;
 
@@ -30,6 +33,9 @@ private sealed class ConsoleLogsSubscription
         public void Cancel() => _cts.Cancel();
     }
 
+    [Inject]
+    public required IOptions<DashboardOptions> Options { get; init; }
+
     [Inject]
     public required IDashboardClient DashboardClient { get; init; }
 
@@ -57,15 +63,14 @@ private sealed class ConsoleLogsSubscription
     [Parameter]
     public string? ResourceName { get; set; }
 
-    private readonly TaskCompletionSource _logViewerReadyTcs = new(TaskCreationOptions.RunContinuationsAsynchronously);
     private readonly CancellationTokenSource _resourceSubscriptionCancellation = new();
     private readonly ConcurrentDictionary<string, ResourceViewModel> _resourceByName = new(StringComparers.ResourceName);
     private ImmutableList<SelectViewModel<ResourceTypeDetails>>? _resources;
     private Task? _resourceSubscriptionTask;
     private ConsoleLogsSubscription? _consoleLogsSubscription;
+    internal LogEntries _logEntries = null!;
 
     // UI
-    public LogViewer LogViewer = null!;
     private SelectViewModel<ResourceTypeDetails> _noSelection = null!;
     private AspirePageContentLayout? _contentLayout;
 
@@ -77,6 +82,7 @@ private sealed class ConsoleLogsSubscription
 
     protected override async Task OnInitializedAsync()
     {
+        _logEntries = new(Options.Value.Frontend.MaxConsoleLogCount);
         _noSelection = new() { Id = null, Name = ControlsStringsLoc[nameof(ControlsStrings.None)] };
         PageViewModel = new ConsoleLogsViewModel { SelectedOption = _noSelection, SelectedResource = null, Status = Loc[nameof(Dashboard.Resources.ConsoleLogs.ConsoleLogsLoadingResources)] };
 
@@ -206,14 +212,8 @@ protected override async Task OnParametersSetAsync()
                 _consoleLogsSubscription = newConsoleLogsSubscription;
             }
 
-            // Wait for the first render to complete so that the log viewer is available.
-            if (!_logViewerReadyTcs.Task.IsCompletedSuccessfully)
-            {
-                Logger.LogDebug("Waiting for log viewer to be available.");
-                await _logViewerReadyTcs.Task;
-            }
-
-            LogViewer.ClearLogs();
+            Logger.LogDebug("Creating new log entries collection.");
+            _logEntries = new(Options.Value.Frontend.MaxConsoleLogCount);
 
             if (newConsoleLogsSubscription is not null)
             {
@@ -222,15 +222,6 @@ protected override async Task OnParametersSetAsync()
         }
     }
 
-    protected override void OnAfterRender(bool firstRender)
-    {
-        if (firstRender)
-        {
-            Logger.LogDebug("Log viewer ready.");
-            _logViewerReadyTcs.SetResult();
-        }
-    }
-
     internal static ImmutableList<SelectViewModel<ResourceTypeDetails>> GetConsoleLogResourceSelectViewModels(
         ConcurrentDictionary<string, ResourceViewModel> resourcesByName,
         SelectViewModel<ResourceTypeDetails> noSelectionViewModel,
@@ -329,16 +320,16 @@ private void LoadLogs(ConsoleLogsSubscription newConsoleLogsSubscription)
                     foreach (var (lineNumber, content, isErrorOutput) in batch)
                     {
                         // Set the base line number using the reported line number of the first log line.
-                        if (LogViewer.LogEntries.EntriesCount == 0)
+                        if (_logEntries.EntriesCount == 0)
                         {
-                            LogViewer.LogEntries.BaseLineNumber = lineNumber;
+                            _logEntries.BaseLineNumber = lineNumber;
                         }
 
                         var logEntry = logParser.CreateLogEntry(content, isErrorOutput);
-                        LogViewer.LogEntries.InsertSorted(logEntry);
+                        _logEntries.InsertSorted(logEntry);
                     }
 
-                    await LogViewer.LogsAddedAsync();
+                    await InvokeAsync(StateHasChanged);
                 }
             }
             finally
@@ -412,11 +403,6 @@ public async ValueTask DisposeAsync()
         await TaskHelpers.WaitIgnoreCancelAsync(_resourceSubscriptionTask);
 
         await StopAndClearConsoleLogsSubscriptionAsync();
-
-        if (LogViewer is { } logViewer)
-        {
-            await logViewer.DisposeAsync();
-        }
     }
 
     public class ConsoleLogsViewModel

src/Shared/ConsoleLogs/LogEntries.cs

@@ -6,8 +6,15 @@
 
 namespace Aspire.Hosting.ConsoleLogs;
 
+// Type is shared by dashboard and hosting.
+// It needs to be public in dashboard so it can be bound to a parameter.
+// It needs to be internal in hosting because we don't want to expose it as public API.
 [DebuggerDisplay("Count = {EntriesCount}")]
+#if ASPIRE_DASHBOARD
+public sealed class LogEntries(int maximumEntryCount)
+#else
 internal sealed class LogEntries(int maximumEntryCount)
+#endif
 {
     private readonly CircularBuffer<LogEntry> _logEntries = new(maximumEntryCount);
 

src/Shared/ConsoleLogs/LogEntry.cs

@@ -6,15 +6,23 @@
 namespace Aspire.Hosting.ConsoleLogs;
 
 [DebuggerDisplay("LineNumber = {LineNumber}, Timestamp = {Timestamp}, Content = {Content}, Type = {Type}")]
+#if ASPIRE_DASHBOARD
+public sealed class LogEntry
+#else
 internal sealed class LogEntry
+#endif
 {
     public string? Content { get; set; }
     public DateTime? Timestamp { get; set; }
     public LogEntryType Type { get; init; } = LogEntryType.Default;
     public int LineNumber { get; set; }
 }
 
+#if ASPIRE_DASHBOARD
+public enum LogEntryType
+#else
 internal enum LogEntryType
+#endif
 {
     Default,
     Error

tests/Aspire.Dashboard.Components.Tests/Pages/ConsoleLogsTests.cs

@@ -132,7 +132,7 @@ public async Task ResourceName_ViaUrlAndResourceLoaded_LogViewerUpdated()
 
         logger.LogInformation("Log results are added to log viewer.");
         consoleLogsChannel.Writer.TryWrite([new ResourceLogLine(1, "Hello world", IsErrorMessage: false)]);
-        cut.WaitForState(() => instance.LogViewer.LogEntries.EntriesCount > 0);
+        cut.WaitForState(() => instance._logEntries.EntriesCount > 0);
     }
 
     private void SetupConsoleLogsServices(TestDashboardClient? dashboardClient = null)