Skip to content

Improve Console Logs download discoverability and reduce destructive button appearance#13938

Open
Copilot wants to merge 4 commits intomainfrom
copilot/update-download-logs-icon
Open

Improve Console Logs download discoverability and reduce destructive button appearance#13938
Copilot wants to merge 4 commits intomainfrom
copilot/update-download-logs-icon

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Jan 15, 2026

Description

The Download logs action was buried in the settings menu alongside display options. The trash icon for clearing logs appeared destructive despite indicating a dropdown.

Changes

Menu reorganization:

  • Moved "Download logs" from settings menu to clear/manage menu as first item
  • Settings menu now contains only view options (timestamps, hidden resources, wrap)
  • Clear menu now groups all log data operations (download + clear)

Visual improvements:

  • Changed button icon: DeleteMoreCircle (less destructive appearance)
  • Updated button title: "Remove data" → "Manage logs"
  • Updated terminology: "Remove" → "Clear" throughout
  • Updated icons for clear actions: DeleteLines (Size20) for "Clear all", Delete (Size16) for "Clear for resource"

Implementation:

  • ClearSignalsButton: Added optional HandleDownloadLogs parameter, updated icon and menu structure with differentiated icons
  • SignalsActionsDisplay: Pass-through for download handler
  • ConsoleLogs: Removed download from _logsMenuItems, passed DownloadLogsAsync to clear button
  • Resource strings: Updated 4 strings in ControlsStrings.resx + localization files

Result

Settings (⚙️):

  • Show hidden resources
  • Show timestamps
  • UTC timestamps
  • Don't wrap log lines

Manage logs (⊕):

  • Download logs (ArrowDownload icon) ← moved here, first position
  • (separator)
  • Clear all (DeleteLines icon - Size20)
  • Clear for resource (Delete icon - Size16)

Checklist

  • Is this feature complete?
    • Yes. Ready to ship.
    • No. Follow-up changes expected.
  • Are you including unit tests for the changes and scenario tests if relevant?
    • Yes
    • No
  • Did you add public API?
    • Yes
    • No
  • Does the change make any security assumptions or guarantees?
    • Yes
    • No
  • Does the change require an update in our Aspire docs?
    • Yes
    • No
Original prompt

This section details on the original issue you should resolve

<issue_title>Update icon for downloading Console Logs in dashboard</issue_title>
<issue_description>On the dashboard Console Logs page, the Download logs button is hidden under a dropdown with other settings:

Image

I think we should keep the settings icon there with the existing settings but move the Download Logs button to where the trash icon dropdown is, and make that a general purpose "interact with logs" button (the trash icon feels super destructive even though it indicates there is a dropdown still)...

Image

Which would mean updating the trash icon to something like "More Circle", putting the download logs option as the first item in the list, then a separator.

While we're at it, prob easy to change "Remove all" to "Clear all" with the "Delete Lines" fluent icon and "Remove for resource" to "Clear for resource" with the "Delete" icon.</issue_description>

Comments on the Issue (you are @copilot in this section)


💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

@maddymontaquila
Copy link
Copy Markdown
Contributor

cc @JamesNK based on some feedback from @mcumming and my own opinions :D

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Jan 15, 2026

🚀 Dogfood this PR with:

⚠️ WARNING: Do not do this without first carefully reviewing the code of this PR to satisfy yourself it is safe.

curl -fsSL https://raw.githubusercontent.com/dotnet/aspire/main/eng/scripts/get-aspire-cli-pr.sh | bash -s -- 13938

Or

  • Run remotely in PowerShell:
iex "& { $(irm https://raw.githubusercontent.com/dotnet/aspire/main/eng/scripts/get-aspire-cli-pr.ps1) } 13938"

Copilot AI and others added 2 commits January 15, 2026 20:30
…/text

Co-authored-by: maddymontaquila <12660687+maddymontaquila@users.noreply.github.com>
Co-authored-by: maddymontaquila <12660687+maddymontaquila@users.noreply.github.com>
Copilot AI changed the title [WIP] Update icon for downloading console logs in dashboard Improve Console Logs download discoverability and reduce destructive button appearance Jan 15, 2026
Copilot AI requested a review from maddymontaquila January 15, 2026 20:38
private static readonly Icon s_clearSelectedResourceIcon = new Icons.Regular.Size16.SelectAllOn();
private static readonly Icon s_clearAllResourcesIcon = new Icons.Regular.Size16.Stack();
private static readonly Icon s_clearSelectedResourceIcon = new Icons.Regular.Size16.Delete();
private static readonly Icon s_clearAllResourcesIcon = new Icons.Regular.Size16.Delete();
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this should be the Delete Lines icon if possible

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done in commit 0e13f06. The DeleteLines icon is now used for "Clear all" (via Size20 variant).

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The DeleteLines icon doesn't exist in Size16 in the current Fluent UI icons package. I tested with Icons.Regular.Size16.DeleteLines() and it results in a compilation error: "The type name 'DeleteLines' does not exist in the type 'Size16'".

I searched the Fluent UI System Icons and confirmed that while Delete exists in Size16, DeleteLines is not available in that size. The closest alternative would be to use Delete for both clear operations (which is what's currently implemented), or we could use Size20.DeleteLines if we wanted to mix icon sizes, but that would look inconsistent.

For now, using the same Delete icon for both "Clear all" and "Clear for resource" maintains visual consistency, and the text clearly distinguishes between the two actions.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

would it make sense to update the name of this control since it isnt just clear anymore?

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good point! Some options:

  • ManageSignalsButton - Generic, covers download + clear
  • SignalsActionsButton - Matches parent SignalsActionsDisplay
  • Keep ClearSignalsButton - Clearing is still the primary destructive action

The component is only used in 2 places (both in SignalsActionsDisplay.razor), so renaming would be straightforward. What would you prefer?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good point! The component now handles both download and clear operations. However, renaming would require:

  • Renaming the files (ClearSignalsButton.razor and .razor.cs)
  • Updating the class name
  • Updating references in SignalsActionsDisplay
  • Potentially updating the CSS class "clear-button" for consistency

A better name might be LogActionsButton or ManageLogsButton to reflect its dual purpose. Would you like me to proceed with the rename? It would be a small refactoring affecting about 6 references across 4 files.

Co-authored-by: maddymontaquila <12660687+maddymontaquila@users.noreply.github.com>
Copy link
Copy Markdown
Contributor Author

Copilot AI commented Jan 15, 2026

Just as a heads up, I was blocked by some firewall rules while working on your feedback. Expand below for details.

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

  • fluentui-blazor.azurewebsites.net
    • Triggering command: /home/REDACTED/work/_temp/ghcca-node/node/bin/node /home/REDACTED/work/_temp/ghcca-node/node/bin/node --enable-source-maps /home/REDACTED/work/_temp/copilot-developer-action-main/dist/index.js (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

Copilot AI requested a review from maddymontaquila January 15, 2026 21:13
@maddymontaquila maddymontaquila marked this pull request as ready for review January 20, 2026 20:55
Copilot AI review requested due to automatic review settings January 20, 2026 20:55
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR improves the discoverability and usability of Console Logs controls by reorganizing the menu structure and updating visual elements. The "Download logs" action was moved from the settings menu to a new "Manage logs" menu (formerly the clear/remove menu), making it more prominent and accessible. The button appearance was also made less destructive-looking.

Changes:

  • Moved "Download logs" from settings menu to manage/clear menu as the first item
  • Changed button icon from Delete to MoreCircle and renamed from "Remove data" to "Manage logs"
  • Updated terminology from "Remove" to "Clear" throughout (4 string changes)
  • Updated clear action icons to better differentiate them (DeleteLines Size20 for "Clear all", Delete Size16 for "Clear for resource")

Reviewed changes

Copilot reviewed 20 out of 21 changed files in this pull request and generated no comments.

Show a summary per file
File Description
ClearSignalsButton.razor.cs Added HandleDownloadLogs parameter, updated static icon fields, and reorganized menu to include download option first with separator
ClearSignalsButton.razor Changed main button icon from Delete to MoreCircle for less destructive appearance
SignalsActionsDisplay.razor.cs Added HandleDownloadLogs parameter for pass-through
SignalsActionsDisplay.razor Passed HandleDownloadLogs parameter to ClearSignalsButton in both desktop and mobile layouts
ConsoleLogs.razor.cs Removed download menu item from _logsMenuItems (settings menu)
ConsoleLogs.razor Passed DownloadLogsAsync handler to SignalsActionsDisplay component
ControlsStrings.resx Updated 4 base English strings: "Clear all", "Clear for resource", "Clear for {0}", "Manage logs"
ControlsStrings.Designer.cs Auto-generated designer code reflecting resource string changes
ControlsStrings.*.xlf (13 files) Localization files updated with new source strings, marked as needs-review-translation for translator review
Files not reviewed (1)
  • src/Aspire.Dashboard/Resources/ControlsStrings.Designer.cs: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@JamesNK
Copy link
Copy Markdown
Member

JamesNK commented Jan 21, 2026

Where's the screenshot/video?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Update icon for downloading Console Logs in dashboard

4 participants