aspire icon indicating copy to clipboard operation
aspire copied to clipboard

Metrics: Instrument tree incorrectly highlights selected item after change

Open JamesNK opened this issue 2 years ago • 4 comments

The metrics page has UI for selecting an instrument:

  • A dropdown to select the resource to view metrics for
  • Once a resource is selected, a tree of the resource's meters (first level) a instruments (second level)

Issue:

  1. Select a resource. This displays the tree.
  2. Select the first instrument in the tree. It is highlighted in the tree.
  3. Change the resource. This updates the tree with new values. The bug is the first instrument in the tree is still selected.

The tree should reset to nothing being selected when the dropdown value changes.

Demo: metrics-tree-selection

JamesNK avatar Dec 07 '23 01:12 JamesNK

I think the problem is the InitiallySelected bindings don't force the tree to forget what is selected.

Source: https://github.com/dotnet/aspire/blob/2b15a508b3ee5406615ffe76987dad714f0b36cb/src/Aspire.Dashboard/Components/Pages/Metrics.razor#L32-L44

A fix would be to force Blazor to re-render the tree from a blank slate. Is that possible? Another idea is to get a reference to the FluentTreeView in the code behind and explicitly set FluentTreeView.CurrentSelected to null when the resource changes.

@vnbaaij @tlmii Do you have any thoughts here?

JamesNK avatar Dec 07 '23 01:12 JamesNK

Another idea is to get a reference to the FluentTreeView in the code behind and explicitly set FluentTreeView.CurrentSelected to null when the resource changes.

I tried this. It creates a warning because CurrentSelected is a parameter. However, I noticed the parameter is already bound to a _selectedTreeItem field. Explicitly setting the field to null when the resource changes doesn't fix the issue.

It feels like this is a bug in FluentTreeView.

JamesNK avatar Dec 07 '23 02:12 JamesNK

After digging into this a bit, I filed https://github.com/microsoft/fluentui-blazor/issues/1087 to see what the folks over there think. It appears to me like there's a disconnect in the CurrentSelected parameter and the underlying web component and I'm not exactly sure what to do about it.

InitiallySelected bindings don't force the tree to forget what is selected.

This is correct, it is only checked during Initialize for the tree view item it is set on.

I filed #1283 as a workaround to make the behavior correct. Small change and seems to make it work, though it doesn't fix the underlying binding issues from the issue I filed above.

tlmii avatar Dec 07 '23 21:12 tlmii

@tlmii to verify that this issue has been resolved.

leslierichardson95 avatar May 14 '24 22:05 leslierichardson95