Add display name and priority support to endpoints

playground/TestShop/TestShop.AppHost/Program.cs

@@ -38,6 +38,10 @@
 
 builder.AddProject<Projects.MyFrontend>("frontend")
        .WithExternalHttpEndpoints()
+       .WithModifiedEndpoints(c =>
+       {
+           c.DisplayProperties.DisplayName = "TestShop frontend access";
+       })
        .WithReference(basketService)
        .WithReference(catalogService);
 

playground/TestShop/TestShop.AppHost/ResourceBuilderExtensions.cs

@@ -0,0 +1,24 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+
+namespace Aspire.Hosting;
+
+public static class ResourceBuilderExtensions
+{
+    public static IResourceBuilder<T> WithModifiedEndpoints<T>(this IResourceBuilder<T> builder, Action<EndpointAnnotation> callback) where T : IResourceWithEndpoints
+    {
+        ArgumentNullException.ThrowIfNull(builder);
+
+        if (!builder.Resource.TryGetAnnotationsOfType<EndpointAnnotation>(out var endpoints))
+        {
+            return builder;
+        }
+
+        foreach (var endpoint in endpoints)
+        {
+            callback(endpoint);
+        }
+
+        return builder;
+    }
+}

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

@@ -63,14 +63,50 @@
                         @FilteredEndpoints.Count()
                     </FluentBadge>
                 </div>
-                <PropertyGrid
-                    TItem="DisplayedEndpoint"
-                    Items="@FilteredEndpoints"
-                    ContentAfterValue="(vm) => GetContentAfterValue(vm)"
-                    ValueSort="_endpointValueSort"
-                    IsValueMaskedChanged="@OnValueMaskedChanged"
-                    HighlightText="@_filter"
-                    GridTemplateColumns="1fr 1.5fr" />
+
+                @{
+                    var hasAnyEndpointDisplayNames = FilteredEndpoints.Any(e => e.DisplayName != null);
+                }
+
+                <FluentDataGrid TGridItem="DisplayedEndpoint"
+                                ItemKey="@(vm => ((IPropertyGridItem)vm).Key)"
+                                Items="@FilteredEndpoints"
+                                ColumnResizeLabels="@_resizeLabels"
+                                ColumnSortLabels="@_sortLabels"
+                                HeaderCellAsButtonWithMenu="true"
+                                ResizableColumns="true"
+                                ResizeType="DataGridResizeType.Discrete"
+                                Style="width:100%"
+                                RowSize="DataGridRowSize.Medium"
+                                GridTemplateColumns="@(hasAnyEndpointDisplayNames ? "1fr 1.5fr 1.5fr" : "1.5fr 1.5fr")"
+                                ShowHover="true">
+                    <AspireTemplateColumn Sortable="true" SortBy="@(GridSort<DisplayedEndpoint>.ByAscending(i => i.Name))" Title="@ControlStringsLoc[nameof(ControlsStrings.NameColumnHeader)]">
+                        <GridValue ValueDescription="@ControlStringsLoc[nameof(ControlsStrings.NameColumnHeader)]"
+                                   Value="@context.Name"
+                                   EnableHighlighting="@(!string.IsNullOrEmpty(_filter))"
+                                   HighlightText="@_filter" />
+                    </AspireTemplateColumn>
+                    @if (hasAnyEndpointDisplayNames)
+                    {
+                        <AspireTemplateColumn Sortable="true" SortBy="@(GridSort<DisplayedEndpoint>.ByAscending(i => i.Name))" Title="@ControlStringsLoc[nameof(ControlsStrings.DisplayNameColumnHeader)]">
+                            @if (context.DisplayName is not null)
+                            {
+                                <GridValue ValueDescription="@ControlStringsLoc[nameof(ControlsStrings.DisplayNameColumnHeader)]"
+                                           Value="@context.DisplayName"
+                                           EnableHighlighting="@(!string.IsNullOrEmpty(_filter))"
+                                           HighlightText="@_filter" />
+                            }
+                        </AspireTemplateColumn>
+                    }
+                    <AspireTemplateColumn Sortable="true" SortBy="@_endpointValueSort" Title="@ControlStringsLoc[nameof(ControlsStrings.PropertyGridValueColumnHeader)]">
+                        <GridValue ValueDescription="@ControlStringsLoc[nameof(ControlsStrings.NameColumnHeader)]"
+                                   Value="@context.OriginalUrlString"
+                                   ContentAfterValue="vm => GetContentAfterValue(context)"
+                                   EnableHighlighting="@(!string.IsNullOrEmpty(_filter))"
+                                   IsMaskedChanged="@(_ => OnValueMaskedChanged(context))"
+                                   HighlightText="@_filter" />
+                    </AspireTemplateColumn>
+                </FluentDataGrid>
             </FluentAccordionItem>
             @if (Resource.IsContainer())
             {

src/Aspire.Dashboard/Model/ResourceEndpointHelpers.cs

@@ -22,10 +22,13 @@ public static List<DisplayedEndpoint> GetEndpoints(ResourceViewModel resource, b
                 endpoints.Add(new DisplayedEndpoint
                 {
                     Name = url.Name,
-                    Text = url.Url.OriginalString,
                     Address = url.Url.Host,
                     Port = url.Url.Port,
-                    Url = url.Url.Scheme is "http" or "https" ? url.Url.OriginalString : null
+                    Url = url.Url.Scheme is "http" or "https" ? url.Url.OriginalString : null,
+                    SortOrder = url.DisplayProperties?.SortOrder,
+                    DisplayName = url.DisplayProperties?.DisplayName,
+                    OriginalUrlString = url.Url.OriginalString,
+                    Text = url.DisplayProperties?.DisplayName ?? url.Url.OriginalString
                 });
             }
         }
@@ -36,7 +39,8 @@ public static List<DisplayedEndpoint> GetEndpoints(ResourceViewModel resource, b
         // - other urls
         // - endpoint name
         var orderedEndpoints = endpoints
-            .OrderByDescending(e => e.Url?.StartsWith("https") == true)
+            .OrderByDescending(e => e.SortOrder ?? 0)
+            .ThenByDescending(e => e.Url?.StartsWith("https") == true)
             .ThenByDescending(e => e.Url != null)
             .ThenBy(e => e.Name, StringComparers.EndpointAnnotationName)
             .ToList();
@@ -45,14 +49,17 @@ public static List<DisplayedEndpoint> GetEndpoints(ResourceViewModel resource, b
     }
 }
 
-[DebuggerDisplay("Name = {Name}, Text = {Text}, Address = {Address}:{Port}, Url = {Url}")]
+[DebuggerDisplay("Name = {Name}, Text = {Text}, Address = {Address}:{Port}, Url = {Url}, DisplayName = {DisplayName}, OriginalUrlString = {OriginalUrlString}, SortOrder = {SortOrder}")]
 public sealed class DisplayedEndpoint : IPropertyGridItem
 {
     public required string Name { get; set; }
     public required string Text { get; set; }
     public string? Address { get; set; }
     public int? Port { get; set; }
     public string? Url { get; set; }
+    public int? SortOrder { get; set; }
+    public string? DisplayName { get; set; }
+    public required string OriginalUrlString { get; set; }
 
     /// <summary>
     /// Don't display a plain string value here. The URL will be displayed as a hyperlink

src/Aspire.Dashboard/Model/ResourceViewModel.cs

@@ -324,18 +324,22 @@ public sealed class UrlViewModel
     public string Name { get; }
     public Uri Url { get; }
     public bool IsInternal { get; }
+    public UrlDisplayPropertiesViewModel? DisplayProperties { get; }
 
-    public UrlViewModel(string name, Uri url, bool isInternal)
+    public UrlViewModel(string name, Uri url, bool isInternal, UrlDisplayPropertiesViewModel? displayProperties = null)
     {
         ArgumentException.ThrowIfNullOrWhiteSpace(name);
         ArgumentNullException.ThrowIfNull(url);
 
         Name = name;
         Url = url;
         IsInternal = isInternal;
+        DisplayProperties = displayProperties;
     }
 }
 
+public record UrlDisplayPropertiesViewModel(string? DisplayName, int? SortOrder);
+
 public sealed record class VolumeViewModel(int index, string Source, string Target, string MountType, bool IsReadOnly) : IPropertyGridItem
 {
     string IPropertyGridItem.Name => Source;

src/Aspire.Dashboard/ResourceService/Partials.cs

@@ -93,7 +93,7 @@ ImmutableArray<UrlViewModel> GetUrls()
             return (from u in Urls
                     let parsedUri = Uri.TryCreate(u.FullUrl, UriKind.Absolute, out var uri) ? uri : null
                     where parsedUri != null
-                    select new UrlViewModel(u.Name, parsedUri, u.IsInternal))
+                    select new UrlViewModel(u.Name, parsedUri, u.IsInternal, u.DisplayProperties is not null ? new UrlDisplayPropertiesViewModel(u.DisplayProperties.HasDisplayName ? u.DisplayProperties.DisplayName : null, u.DisplayProperties.HasSortOrder ? u.DisplayProperties.SortOrder : null) : null))
                     .ToImmutableArray();
         }
 

src/Aspire.Dashboard/Resources/ControlsStrings.resx

@@ -181,6 +181,9 @@
   <data name="NameColumnHeader" xml:space="preserve">
     <value>Name</value>
   </data>
+  <data name="DisplayNameColumnHeader" xml:space="preserve">
+    <value>Display name</value>
+  </data>
   <data name="PropertyGridValueColumnHeader" xml:space="preserve">
     <value>Value</value>
   </data>
@@ -437,4 +440,4 @@
   <data name="ClearPendingSelectedResource" xml:space="preserve">
     <value>Remove for resource</value>
   </data>
-</root>
+</root>

src/Aspire.Hosting.Azure.CosmosDB/AzureCosmosDBExtensions.cs

@@ -288,10 +288,11 @@ public static IResourceBuilder<AzureCosmosDBEmulatorResource> WithDataExplorer(t
             endpoint.UriScheme = "http";
             endpoint.TargetPort = 1234;
             endpoint.Port = port;
+            endpoint.DisplayProperties = new EndpointDisplayProperties { DisplayName = "Data Explorer" };
         });
     }
 
-    /// <summary>    
+    /// <summary>
     /// Configures the resource to use access key authentication with Azure Cosmos DB.
     /// </summary>
     /// <param name="builder">The Azure Cosmos DB resource builder.</param>

src/Aspire.Hosting/ApplicationModel/CustomResourceSnapshot.cs

@@ -177,8 +177,16 @@ public sealed record EnvironmentVariableSnapshot(string Name, string? Value, boo
 /// <param name="Name">Name of the url.</param>
 /// <param name="Url">The full uri.</param>
 /// <param name="IsInternal">Determines if this url is internal.</param>
+/// <param name="DisplayProperties">The UI display properties for the url.</param>
 [DebuggerDisplay("{Url}", Name = "{Name}")]
-public sealed record UrlSnapshot(string Name, string Url, bool IsInternal);
+public sealed record UrlSnapshot(string Name, string Url, bool IsInternal, UrlDisplayPropertiesSnapshot? DisplayProperties = null);
+
+/// <summary>
+/// A snapshot of the display properties for a url.
+/// </summary>
+/// <param name="DisplayName">The display name of the url.</param>
+/// <param name="SortOrder">The order of the url in UI. Higher numbers are displayed first in the UI.</param>
+public sealed record UrlDisplayPropertiesSnapshot(string? DisplayName = null, int? SortOrder = null);
 
 /// <summary>
 /// A snapshot of a volume, mounted to a container.