You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
Add dashboard close buttons and refine the resource sidebar - #21792
Make it straightforward to dismiss dashboard content and choose another resource without a separate sidebar-expansion control.
Desktop content panels now have a localized Close view X matching the adjacent toolbar buttons. Closing navigates to the parent route and shows the resource list across the canvas. Selecting a resource restores its content and the saved sidebar width; Select all reopens the current tab's all-resources content. Ordinary sidebar collapse, reopening, resizing, resource commands and terminal sessions remain unchanged.
Coverage includes resource/parameter overview, console logs, structured logs, traces and trace details, metrics and meter/instrument details, and terminal views. Unscoped tab content also supports close/reopen without losing its URL filters. Trace parent links retain resource selection and list filters, including direct links/new tabs. The separate terminal popout and transient dialogs are unchanged.
At 768px and narrower, the resource dropdown replaces the page X. The drawer dismiss button uses the same toolbar styling. Drawer navigation, filters and kind controls share aligned gutters and top spacing, with a fixed header/footer and one scrolling resource list.
The manual full-canvas toggle and its unused localized strings are removed. Existing full-canvas activity, row actions, selection animations and browser coverage are retained and updated for the close/Select all flow. Sidebar motion now uses a consistent 200ms eased transition rather than the previous 300ms collapse/400ms selection reveal, while retaining reduced-motion support and immediate pointer resizing.
Shared sidebar interactions use one in-flight registration across overlapping renders. Browser tests wait for the real close destination and interaction readiness rather than assuming a click means navigation and asynchronous setup have finished.
Review corrections preserve the closed presentation across destination-page saved-filter redirects, reopen a retained selected resource without deselecting it, recognize mixed-case route keywords, return query-based instruments to their meter parent, and preserve filters when Select all reopens top-level unscoped content. Directly opened trace and metric detail pages still navigate to the tab when choosing Select all. Drawer tests use 43 resources and verify actual overflow and positive scrolling.
Related issue: N/A (user-requested dashboard UX).
User-facing usage
Open a resource or parameter, then choose Close view. The parent overview appears as the full-canvas resource list; choose a resource to reopen its details.
Close Overview, Console logs, Structured logs, Traces, Metrics or Terminals, then choose Select all to reopen that tab's content. On Overview, this opens the all-resources summary.
Open a trace detail directly or in a new tab. Closing returns to its traces list with resource selection and filters retained. Instrument and meter routes return to their immediate metrics parent; resource terminal views return to the resource overview.
On phone/tablet dropdown layouts, open the resource dropdown, choose a resource or Select all, or dismiss the drawer with X. Filters and footer controls remain accessible while the list scrolls.
Validation
All tests use Release artifacts so the running Debug TestShop dashboard remains available. Latest review-correction validation is against commit 633deba325.
Passed: 182 tests. Includes parent routes, mixed-case route keywords, direct-link trace context, saved-session redirects with the destination Traces page rendered, same-URL close/Select all, retained-resource reopening, filter preservation, direct-detail Select all destination URLs, mobile drawer dismissal, viewport changes, retained sidebar interactions and no resource lifecycle commands. The new navigation regressions were reproduced before applying their fixes.
Passed: 69 tests. Includes responsive navigation, real overflowing-drawer scrolling, filtered close/reopen, retained-resource reopening, desktop/mobile Select all from direct trace and metrics detail links, retained full-canvas and motion tests, interrupted/reversed selection, keyboard focus, modifier selection, row actions and endpoint behavior. Collections ran serially on this shared development machine.
Outerloop coverage is intentionally enabled only for these explicitly selected browser scenarios. It covers 320, 390, 768, 769, 1024 and 1440px navigation/drawer behavior and desktop animation at 2000px.
The earlier combined regression run was 125 passed, 7 failed (132 total):
The change-related navigation/selection/timing failures were corrected and included in the passing focused selections (originally 57 tests, now 69 with review regressions). The combined 132-test selection was not rerun after the final corrections; it is not claimed fully green.
An isolated unchanged-main control at eef8a45871db9ad8fcbb153451001a3819a81aca reproduced the collapsed-filter-header selector timeout in FilterAndGrouping_StayInsideVisualViewportAcrossPaneModesAndResize and the focus assertion in SelectionAndResize_PreserveAvailableTracesTab; those pre-existing issues are not fixed here. The control command was:
Passed. Toggle string removals were propagated through generated XLF updates. Builds emit the existing NU1903 advisory for the repository-pinned Microsoft.DotNet.ILCompiler; dependencies were not changed.
Manual browser verification used this branch's source-built TestShop dashboard: desktop close/Select all, scoped trace parent navigation, normal sidebar collapse/reopen/resizing, and responsive dropdown/drawer flows. Screenshots below were captured after dismissing notification alerts and waiting for resource/activity loading in both themes. Review corrections do not change the captured styling or motion.
Screenshots / Recordings
This PR includes UI changes. The screenshots show both content and resource-list presentation from the source-built TestShop dashboard, with notification alerts dismissed.
Content
Resolution
Light
Dark
Desktop, 1440 x 900
Tablet, 768 x 1024
Mobile, 390 x 844
Resource list
Resolution
Light
Dark
Desktop, 1440 x 900
Tablet, 768 x 1024
Mobile, 390 x 844
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
If yes, did you have an API Review for it?
Yes
No
Did you add <remarks /> and <code /> elements on your triple slash comments?
Yes
No
No
Does the change make any security assumptions or guarantees?
Yes
If yes, have you done a threat model and had a security review?
This PR replaces the dashboard’s manual full-canvas toggle with a Close view / Select all flow, integrating dismissal and reopening into resource navigation.
Changes:
Adds desktop close buttons and parent-route handling, including trace selection and filter context.
Refines mobile drawer layout and standardizes sidebar transitions.
Updates component and browser coverage, documents the navigation flow, and removes unused toggle strings.
The reason will be displayed to describe this comment to others. Learn more.
🔵 Needs a closer look
Unresolved bugs can leave sidebar interactions unusable after reconnection, narrow all-source metrics views when closing details, and prevent browser Back navigation from reopening details.
No open issues 🎉
3 previously missed issues
In code that hasn't changed since last review
Keep browser Back navigation from hiding the metrics detail page
This also treats browser history navigation to a query-based detail as session-state restoration. For example, open /metrics?meter=Test directly, close it to /metrics, then press Back: both paths are /metrics and neither URL selects a resource, so restoringPageState is true and the meter page remains hidden/inert behind full canvas. Distinguish actual saved-state redirects from user/history navigation so Back reopens the detail, and add a regression for this sequence.
Clear failed pane interaction registration to allow reconnect retries
If the circuit disconnects during RegisterPaneInteractionsAsync, the outer JSDisconnectedException handler swallows the failure, but _paneInteractionsRegistration keeps the faulted task. After reconnection, every render awaits that same task and exits through the catch again, so unfinished sidebar handlers and the resizer can never register without a reload. Clear the cached task on failure while ensuring an older failed waiter cannot clear a newer registration.
Preserve all-sources metrics view when closing a detail page
In a standalone dashboard with metrics-emitting sources and no resource selection, closing /metrics?meter=Test&duration=30 selects the first metrics source instead of returning to /metrics?duration=30. The instance GetTabUrl(Metrics) applies a tab-switching fallback that silently narrows the all-sources view. Use the overload that takes the current selection explicitly, and add a standalone metrics regression.
The reason will be displayed to describe this comment to others. Learn more.
🟡 Changes recommended
Unresolved issues prevent sidebar registration from recovering after disconnects, lose trace filters through the View details action, and keep query-based metric details hidden after browser Back navigation.
- Mark the automatic page state restoration redirect with a history entry
state so browser back/forward to a query-based detail (for example
/metrics?meter=Test) reopens the content instead of being mistaken for a
restoration that keeps the full-canvas list.
- Clear a faulted pane interaction registration so it can be retried after
the circuit reconnects, without discarding a newer attempt.
- Route the trace row's View details action through the layout's contextual
trace detail URL so it keeps the list's selection and filters.
## Description
Make the resource sidebar explain what is available in the current view
without confusing availability, resource health, and selection.
This is the sidebar follow-up to #21792 and targets
`ievangelist-dashboard-detail-close-buttons`. Only the follow-up is
included in this diff; the parent PR is unchanged.
- Show localized **No logs**, **No traces**, **No metrics**, and **Not
applicable** badges with muted, still-interactive rows. Missing
telemetry means no data is currently available, not that the resource
cannot support it. Uninstrumented peers remain available in Traces.
- Explain why parameters do not produce console logs, structured logs,
traces, or metrics, or support terminals. Clicking or keyboard-selecting
a parameter opens its overview. Empty resources still open the existing
no-data view.
- Highlight **Select all** rather than every row for aggregate
selection. Individual, modifier-key, range, and group selection retain
their existing selection indicators and metadata.
Availability uses the existing telemetry-resource subscription and a
cached snapshot lookup. First-signal arrival and clearing update badges
without changing selection. Keep the data query scoped to the selected
resources when their first signal arrives, and refresh logs/traces when
the layout's initial resource snapshot finishes loading.
### User-facing usage
Open Structured logs, Traces, or Metrics and select a resource with a
no-data badge: its empty view opens normally. When that resource sends
telemetry, the badge disappears and its data becomes visible without
selecting it again; clearing that signal restores the badge and empty
state. A running resource can therefore be healthy and still have no
telemetry.
Hover or keyboard-focus a parameter in a telemetry, Console logs, or
Terminal view to see the feature-specific explanation, then press Enter
to open the parameter overview. Use **Select all** for the aggregate
view, Ctrl/Cmd-click to add or remove individual resources, or
Shift-click for a range.
### Screenshots / Recordings
> **This PR includes UI changes.** These 14 screenshots are from this
branch's Release build using deterministic synthetic resources and
telemetry. They show both themes at desktop (1440 x 900), tablet (768 x
1024), and mobile (390 x 844) sizes. No real credentials or application
data are used.
#### Responsive availability and aggregate selection
Only **Select all** is highlighted in the aggregate view. Running
resources with no telemetry are muted; parameters explain why the
current feature is not applicable.
| Viewport | Light | Dark |
| --- | --- | --- |
| Desktop, 1440 x 900 | 
| 
|
| Tablet, 768 x 1024 | 
| 
|
| Mobile, 390 x 844 | 
| 
|
#### First telemetry and clear, with the same resource selected
The gateway already has a log, but the selected catalog view does not
show it. Catalog's first log removes its badge and appears without
changing selection. Clearing catalog's logs restores the badge and empty
state.
| Selected resource, no logs yet | First log arrives | Catalog logs
cleared |
| --- | --- | --- |
| 
| 
| 
|
#### View-specific explanations and selection
| Scenario | Screenshot |
| --- | --- |
| Traces, dark: selected running resource with no traces | 
|
| Metrics, light: selected running resource with no metrics | 
|
| Console logs, light: nonparameters remain available; parameter
explains why it produces no console logs | 
|
| Parameter selection opens Overview and removes the contextual
unavailable badge | 
|
| Explicit multiselection retains individual rails while Select all is
not filled | 
|
### Validation
Run on Windows after `.\restore.cmd` (**passed**), with
`MSBUILDTERMINALLOGGER=false`. All commands below use the
repository-pinned SDK, Release configuration, and
Microsoft.Testing.Platform filters.
**Layout component suite: passed, 481 cases.**
```powershell
dotnet test --project tests\Aspire.Dashboard.Components.Tests\Aspire.Dashboard.Components.Tests.csproj -c Release --no-launch-profile -- --filter-namespace 'Aspire.Dashboard.Components.Tests.Layout' --filter-not-trait 'quarantined=true' --filter-not-trait 'outerloop=true'
```
**Availability and telemetry-page compatibility: passed, 81 cases**,
including 16 availability cases. This overlaps the layout suite; counts
are not additive.
```powershell
dotnet test --project tests\Aspire.Dashboard.Components.Tests\Aspire.Dashboard.Components.Tests.csproj -c Release --no-launch-profile -- --filter-class '*.ResourceRowAvailabilityTests' --filter-class '*.StructuredLogsTests' --filter-class '*.TracesTests' --filter-class '*.MetricsTests' --filter-not-trait 'quarantined=true' --filter-not-trait 'outerloop=true'
```
**Focused functional browser suite: passed, 49 cases.** Explicitly opted
into the selected outerloop browser scenarios; unrelated quarantined
tests remain excluded.
```powershell
dotnet test --project tests\Aspire.Dashboard.Playwright.Tests\Aspire.Dashboard.Playwright.Tests.csproj -c Release --no-launch-profile -- --filter-method '*.ExistingTelemetry_RemainsVisibleWhenAllResourcesViewReloads' --filter-method '*.UnavailableRows_RemainInteractiveAndUpdateWhenSignalsArriveAndClear' --filter-method '*.ParameterRows_ExplainEachUnavailableFeatureAndKeyboardSelectionOpensOverview' --filter-method '*.AvailabilityBadges_FollowTabChangesWithoutChangingSelection' --filter-method '*.SelectAll_*' --filter-method '*.AllResourcesRow_ClearsSelectionAndSummarizesAllResources' --filter-method '*.ResourceRowModifierClicks_SelectSeveralResources' --filter-method '*.ExtremeName_RetainsFullAccessibleAndHoverKeyboardDisclosure' --filter-method '*.IconTile_PreservesStylesAcrossPaneModesAndDensities' --filter-method '*.SelectionSurfaces_UseDashboardNeutralTokensAcrossThemes' --filter-method '*.DynamicRows_PreserveTokenGeometryAfterModelAndPresentationChanges' --filter-method '*.RowComposition_AlignsStatusAndSingleLineDetailsWithAccessibleContrast' --filter-method '*.PaneWidth_DisclosesMetadataWithoutChangingSelectionAndKeepsEndpointBehavior' --filter-not-trait 'quarantined=true'
```
Coverage includes all three signals arriving and being cleared at three
widths, unchanged selection and data scope, visible feature-specific
parameter explanations and keyboard navigation across five views,
tab-dependent labels, synthetic trace peers, long-name disclosure,
aggregate/individual/group selection, and Ctrl/Cmd-click from the
aggregate set. The initial logs snapshot failure was reproduced before
the lifecycle fix; both logs and traces now have passing load/reload
coverage. Existing styling/geometry tests were aligned with aggregate
selection; no new computed-color-only assertions were added.
`git diff --check`: **passed**. Screenshot capture assertions:
**passed**, including that another resource's log never appears in the
selected resource's view.
Builds report NU1903 for the repository-pinned
`Microsoft.DotNet.ILCompiler` 11.0.0-rc.2.26504.105
([GHSA-p3jp-9v83-76w9](GHSA-p3jp-9v83-76w9)).
This PR does not change dependencies or feeds.
Fixes # (issue)
## Checklist
- Is this feature complete?
- [x] Yes. Ready to ship.
- [ ] No. Follow-up changes expected.
- Are you including unit tests for the changes and scenario tests if
relevant?
- [x] Yes
- [ ] No
- Did you add public API?
- [ ] Yes
- If yes, did you have an API Review for it?
- [ ] Yes
- [ ] No
- Did you add `<remarks />` and `<code />` elements on your triple slash
comments?
- [ ] Yes
- [ ] No
- [x] No
- Does the change make any security assumptions or guarantees?
- [ ] Yes
- If yes, have you done a threat model and had a security review?
- [ ] Yes
- [ ] No
- [x] No
---------
Co-authored-by: IEvangelist <7679720+IEvangelist@users.noreply.github.com>
Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.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
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.
Description
Make it straightforward to dismiss dashboard content and choose another resource without a separate sidebar-expansion control.
Desktop content panels now have a localized Close view X matching the adjacent toolbar buttons. Closing navigates to the parent route and shows the resource list across the canvas. Selecting a resource restores its content and the saved sidebar width; Select all reopens the current tab's all-resources content. Ordinary sidebar collapse, reopening, resizing, resource commands and terminal sessions remain unchanged.
Coverage includes resource/parameter overview, console logs, structured logs, traces and trace details, metrics and meter/instrument details, and terminal views. Unscoped tab content also supports close/reopen without losing its URL filters. Trace parent links retain resource selection and list filters, including direct links/new tabs. The separate terminal popout and transient dialogs are unchanged.
At 768px and narrower, the resource dropdown replaces the page X. The drawer dismiss button uses the same toolbar styling. Drawer navigation, filters and kind controls share aligned gutters and top spacing, with a fixed header/footer and one scrolling resource list.
The manual full-canvas toggle and its unused localized strings are removed. Existing full-canvas activity, row actions, selection animations and browser coverage are retained and updated for the close/Select all flow. Sidebar motion now uses a consistent 200ms eased transition rather than the previous 300ms collapse/400ms selection reveal, while retaining reduced-motion support and immediate pointer resizing.
Shared sidebar interactions use one in-flight registration across overlapping renders. Browser tests wait for the real close destination and interaction readiness rather than assuming a click means navigation and asynchronous setup have finished.
Review corrections preserve the closed presentation across destination-page saved-filter redirects, reopen a retained selected resource without deselecting it, recognize mixed-case route keywords, return query-based instruments to their meter parent, and preserve filters when Select all reopens top-level unscoped content. Directly opened trace and metric detail pages still navigate to the tab when choosing Select all. Drawer tests use 43 resources and verify actual overflow and positive scrolling.
Related issue: N/A (user-requested dashboard UX).
User-facing usage
Validation
All tests use Release artifacts so the running Debug TestShop dashboard remains available. Latest review-correction validation is against commit
633deba325.Passed: 182 tests. Includes parent routes, mixed-case route keywords, direct-link trace context, saved-session redirects with the destination Traces page rendered, same-URL close/Select all, retained-resource reopening, filter preservation, direct-detail Select all destination URLs, mobile drawer dismissal, viewport changes, retained sidebar interactions and no resource lifecycle commands. The new navigation regressions were reproduced before applying their fixes.
Passed: 69 tests. Includes responsive navigation, real overflowing-drawer scrolling, filtered close/reopen, retained-resource reopening, desktop/mobile Select all from direct trace and metrics detail links, retained full-canvas and motion tests, interrupted/reversed selection, keyboard focus, modifier selection, row actions and endpoint behavior. Collections ran serially on this shared development machine.
Outerloop coverage is intentionally enabled only for these explicitly selected browser scenarios. It covers 320, 390, 768, 769, 1024 and 1440px navigation/drawer behavior and desktop animation at 2000px.
The earlier combined regression run was 125 passed, 7 failed (132 total):
The change-related navigation/selection/timing failures were corrected and included in the passing focused selections (originally 57 tests, now 69 with review regressions). The combined 132-test selection was not rerun after the final corrections; it is not claimed fully green.
An isolated unchanged-main control at
eef8a45871db9ad8fcbb153451001a3819a81acareproduced the collapsed-filter-header selector timeout inFilterAndGrouping_StayInsideVisualViewportAcrossPaneModesAndResizeand the focus assertion inSelectionAndResize_PreserveAvailableTracesTab; those pre-existing issues are not fixed here. The control command was:Control result: 21 passed, 3 failed (24 total).
Passed. Toggle string removals were propagated through generated XLF updates. Builds emit the existing NU1903 advisory for the repository-pinned
Microsoft.DotNet.ILCompiler; dependencies were not changed.Manual browser verification used this branch's source-built TestShop dashboard: desktop close/Select all, scoped trace parent navigation, normal sidebar collapse/reopen/resizing, and responsive dropdown/drawer flows. Screenshots below were captured after dismissing notification alerts and waiting for resource/activity loading in both themes. Review corrections do not change the captured styling or motion.
Screenshots / Recordings
Content
Resource list
Checklist
<remarks />and<code />elements on your triple slash comments?