Add target attribute to Menu (#15636)

--------- Co-authored-by: Mike Alhayek <[email protected]> Co-authored-by: Hisham Bin Ateya <[email protected]>
OrchardCMS · Jun 6, 2024 · f1daaa7 · f1daaa7
1 parent 77e9773
commit f1daaa7
Show file tree

Hide file tree

Showing 28 changed files with 109 additions and 8 deletions.
diff --git a/src/OrchardCore.Modules/OrchardCore.AdminMenu/AdminNodes/LinkAdminNodeDriver.cs b/src/OrchardCore.Modules/OrchardCore.AdminMenu/AdminNodes/LinkAdminNodeDriver.cs
@@ -33,6 +33,7 @@ public override IDisplayResult Edit(LinkAdminNode treeNode)
                 model.LinkText = treeNode.LinkText;
                 model.LinkUrl = treeNode.LinkUrl;
                 model.IconClass = treeNode.IconClass;
+                model.Target = treeNode.Target;
 
                 var permissions = await _adminMenuPermissionService.GetPermissionsAsync();
 
@@ -56,10 +57,11 @@ public override IDisplayResult Edit(LinkAdminNode treeNode)
         public override async Task<IDisplayResult> UpdateAsync(LinkAdminNode treeNode, IUpdateModel updater)
         {
             var model = new LinkAdminNodeViewModel();
-            await updater.TryUpdateModelAsync(model, Prefix, x => x.LinkUrl, x => x.LinkText, x => x.IconClass, x => x.SelectedPermissionNames);
+            await updater.TryUpdateModelAsync(model, Prefix, x => x.LinkUrl, x => x.LinkText, x => x.Target, x => x.IconClass, x => x.SelectedPermissionNames);
 
             treeNode.LinkText = model.LinkText;
             treeNode.LinkUrl = model.LinkUrl;
+            treeNode.Target = model.Target;
             treeNode.IconClass = model.IconClass;
 
             var selectedPermissions = (model.SelectedPermissionNames == null ? [] : model.SelectedPermissionNames.Split(',', StringSplitOptions.RemoveEmptyEntries));

diff --git a/src/OrchardCore.Modules/OrchardCore.AdminMenu/AdminNodes/LinkAdminNodeNavigationBuilder.cs b/src/OrchardCore.Modules/OrchardCore.AdminMenu/AdminNodes/LinkAdminNodeNavigationBuilder.cs
@@ -59,6 +59,7 @@ public Task BuildNavigationAsync(MenuItem menuItem, NavigationBuilder builder, I
 
                 // Add the actual link.
                 itemBuilder.Url(nodeLinkUrl);
+                itemBuilder.Target(node.Target);
                 itemBuilder.Priority(node.Priority);
                 itemBuilder.Position(node.Position);
 

diff --git a/src/OrchardCore.Modules/OrchardCore.AdminMenu/AdminNodes/LinkAdminNodeViewModel.cs b/src/OrchardCore.Modules/OrchardCore.AdminMenu/AdminNodes/LinkAdminNodeViewModel.cs
@@ -12,6 +12,8 @@ public class LinkAdminNodeViewModel
         [Required]
         public string LinkUrl { get; set; }
 
+        public string Target { get; set; }
+
         public string IconClass { get; set; }
 
         public string SelectedPermissionNames { get; set; }

diff --git a/...rchardCore.Modules/OrchardCore.AdminMenu/Views/Items/LinkAdminNode.Fields.TreeEdit.cshtml b/...rchardCore.Modules/OrchardCore.AdminMenu/Views/Items/LinkAdminNode.Fields.TreeEdit.cshtml
@@ -24,6 +24,18 @@
     <span class="hint">@T["The url of the link. A link will be shown only if it or one of their children have a url. The url will be relative to the root of the admin site"]</span>
 </div>
 
+<div class="mb-3">
+    <label asp-for="Target" class="form-label">@T["Target"]</label>
+    <input asp-for="Target" list="targetOptions" class="form-control" />
+    <datalist id="targetOptions">
+        <option value="_self">@T["Opens the linked document in the same frame as it was clicked (this is default)."]</option>
+        <option value="_blank">@T["Opens the linked document in a new window or tab."]</option>
+        <option value="_parent">@T["Opens the linked document in the parent frame."]</option>
+        <option value="_top">@T["Opens the linked document in the full body of the window."]</option>
+    </datalist>
+    <span class="hint">@T["The target attribute of the A tag, see more:"] <a class="seedoc" target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target">target</a></span>
+</div>
+
 <div class="mb-3">
     <label asp-for="IconClass" class="form-label">@T["Icon"]</label>
 

diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/Drivers/HtmlMenuItemPartDisplayDriver.cs b/src/OrchardCore.Modules/OrchardCore.Menu/Drivers/HtmlMenuItemPartDisplayDriver.cs
@@ -67,6 +67,7 @@ public override IDisplayResult Edit(HtmlMenuItemPart part)
             {
                 model.Name = part.ContentItem.DisplayText;
                 model.Url = part.Url;
+                model.Target = part.Target;
                 model.Html = part.Html;
                 model.MenuItemPart = part;
             });
@@ -81,6 +82,7 @@ public override async Task<IDisplayResult> UpdateAsync(HtmlMenuItemPart part, IU
             part.ContentItem.DisplayText = model.Name;
             part.Html = settings.SanitizeHtml ? _htmlSanitizerService.Sanitize(model.Html) : model.Html;
             part.Url = model.Url;
+            part.Target = model.Target;
 
             var urlToValidate = part.Url;
 

diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/Drivers/LinkMenuItemPartDisplayDriver.cs b/src/OrchardCore.Modules/OrchardCore.Menu/Drivers/LinkMenuItemPartDisplayDriver.cs
@@ -59,6 +59,7 @@ public override IDisplayResult Edit(LinkMenuItemPart part)
             {
                 model.Name = part.ContentItem.DisplayText;
                 model.Url = part.Url;
+                model.Target = part.Target;
                 model.MenuItemPart = part;
             });
         }
@@ -70,6 +71,7 @@ public override async Task<IDisplayResult> UpdateAsync(LinkMenuItemPart part, IU
             await updater.TryUpdateModelAsync(model, Prefix);
 
             part.Url = model.Url;
+            part.Target = model.Target;
             part.ContentItem.DisplayText = model.Name;
 
             var urlToValidate = part.Url;

diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/GraphQL/HtmlMenuItemQueryObjectType.cs b/src/OrchardCore.Modules/OrchardCore.Menu/GraphQL/HtmlMenuItemQueryObjectType.cs
@@ -10,6 +10,7 @@ public HtmlMenuItemQueryObjectType()
             Name = "HtmlMenuItemPart";
 
             Field(x => x.Url, nullable: true);
+            Field(x => x.Target, nullable: true);
             Field(x => x.Html, nullable: true);
         }
     }

diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/Models/HtmlMenuItemPart.cs b/src/OrchardCore.Modules/OrchardCore.Menu/Models/HtmlMenuItemPart.cs
@@ -9,6 +9,11 @@ public class HtmlMenuItemPart : ContentPart
         /// </summary>
         public string Url { get; set; }
 
+        /// <summary>
+        /// The target of the link to create.
+        /// </summary>
+        public string Target { get; set; }
+
         /// <summary>
         /// The raw html to display for this link.
         /// </summary>

diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/Models/LinkMenuItemPart.cs b/src/OrchardCore.Modules/OrchardCore.Menu/Models/LinkMenuItemPart.cs
@@ -8,5 +8,10 @@ public class LinkMenuItemPart : ContentPart
         /// The url of the link to create.
         /// </summary>
         public string Url { get; set; }
+
+        /// <summary>
+        /// The target of the link to create.
+        /// </summary>
+        public string Target { get; set; }
     }
 }
diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/ViewModels/HtmlMenuItemPartEditViewModel.cs b/src/OrchardCore.Modules/OrchardCore.Menu/ViewModels/HtmlMenuItemPartEditViewModel.cs
@@ -9,6 +9,8 @@ public class HtmlMenuItemPartEditViewModel
 
         public string Url { get; set; }
 
+        public string Target { get; set; }
+
         public string Html { get; set; }
 
         [BindNever]

diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/ViewModels/LinkMenuItemPartEditViewModel.cs b/src/OrchardCore.Modules/OrchardCore.Menu/ViewModels/LinkMenuItemPartEditViewModel.cs
@@ -9,6 +9,8 @@ public class LinkMenuItemPartEditViewModel
 
         public string Url { get; set; }
 
+        public string Target { get; set; }
+
         [BindNever]
         public LinkMenuItemPart MenuItemPart { get; set; }
     }

diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/Views/HtmlMenuItemPart.Edit.cshtml b/src/OrchardCore.Modules/OrchardCore.Menu/Views/HtmlMenuItemPart.Edit.cshtml
@@ -15,6 +15,20 @@
     </div>
 </div>
 
+<div class="@Orchard.GetWrapperClasses()">
+    <label asp-for="Target" class="@Orchard.GetLabelClasses()">@T["Target"]</label>
+    <div class="@Orchard.GetEndClasses()">
+        <input asp-for="Target" list="targetOptions" class="form-control" />
+        <datalist id="targetOptions">
+            <option value="_self">@T["Opens the linked document in the same frame as it was clicked (this is default)."]</option>
+            <option value="_blank">@T["Opens the linked document in a new window or tab."]</option>
+            <option value="_parent">@T["Opens the linked document in the parent frame."]</option>
+            <option value="_top">@T["Opens the linked document in the full body of the window."]</option>
+        </datalist>
+        <span class="hint">@T["The target attribute of the A tag, see more:"] <a class="seedoc" target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target">target</a></span>
+    </div>
+</div>
+
 <div class="@Orchard.GetWrapperClasses()">
     <label asp-for="Html" class="@Orchard.GetLabelClasses()">@T["Html"]</label>
     <div class="@Orchard.GetEndClasses()">

diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/Views/LinkMenuItemPart.Edit.cshtml b/src/OrchardCore.Modules/OrchardCore.Menu/Views/LinkMenuItemPart.Edit.cshtml
@@ -14,3 +14,17 @@
         <input asp-for="Url" class="form-control" />
     </div>
 </div>
+
+<div class="@Orchard.GetWrapperClasses()">
+    <label asp-for="Target" class="@Orchard.GetLabelClasses()">@T["Target"]</label>
+    <div class="@Orchard.GetEndClasses()">
+        <input asp-for="Target" list="targetOptions" class="form-control" />
+        <datalist id="targetOptions">
+            <option value="_self">@T["Opens the linked document in the same frame as it was clicked (this is default)."]</option>
+            <option value="_blank">@T["Opens the linked document in a new window or tab."]</option>
+            <option value="_parent">@T["Opens the linked document in the parent frame."]</option>
+            <option value="_top">@T["Opens the linked document in the full body of the window."]</option>
+        </datalist>
+        <span class="hint">@T["The target attribute of the A tag, see more:"] <a class="seedoc" target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target">target</a></span>
+    </div>
+</div>
diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/Views/MenuItemLink-HtmlMenuItem.cshtml b/src/OrchardCore.Modules/OrchardCore.Menu/Views/MenuItemLink-HtmlMenuItem.cshtml
@@ -17,6 +17,12 @@
     }
 
     tag.Attributes["href"] = url;
+
+    if (!string.IsNullOrEmpty(htmlMenuItemPart.Target))
+    {
+        tag.Attributes["target"] = htmlMenuItemPart.Target;
+    }
+
     tag.InnerHtml.AppendHtml(Html.Raw(htmlMenuItemPart.Html));
 }
 @tag
diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/Views/MenuItemLink-LinkMenuItem.cshtml b/src/OrchardCore.Modules/OrchardCore.Menu/Views/MenuItemLink-LinkMenuItem.cshtml
@@ -16,6 +16,7 @@
         url = Url.Content(linkMenuItemPart.Url);
     }
 
+    tag.Attributes["target"] = linkMenuItemPart.Target;
     tag.Attributes["href"] = url;
     tag.InnerHtml.Append(contentItem.DisplayText);
 }

diff --git a/src/OrchardCore.Modules/OrchardCore.Menu/Views/MenuItemLink.cshtml b/src/OrchardCore.Modules/OrchardCore.Menu/Views/MenuItemLink.cshtml
@@ -1 +1 @@
-<a href="@(Model.Href ?? "#")">@Model.Text</a>
+<a href="@(Model.Href ?? "#")" target="@(!string.IsNullOrEmpty(Model.Target) ? Model.Target : "_self")">@Model.Text</a>
diff --git a/src/OrchardCore.Modules/OrchardCore.Navigation/Views/NavigationItemLink.cshtml b/src/OrchardCore.Modules/OrchardCore.Navigation/Views/NavigationItemLink.cshtml
@@ -5,4 +5,4 @@
     Model.Metadata.Alternates.Add("NavigationItemText_Id__" + Model.Id);
 }
 
-<a href="@(Model.Href ?? "#")">@await DisplayAsync(Model)</a>
+<a href="@(Model.Href ?? "#")" target="@(!string.IsNullOrEmpty(Model.Target) ? Model.Target : "_self")">@await DisplayAsync(Model)</a>
diff --git a/src/OrchardCore.Themes/TheAdmin/Views/NavigationItemLink-admin.cshtml b/src/OrchardCore.Themes/TheAdmin/Views/NavigationItemLink-admin.cshtml
@@ -22,6 +22,11 @@
         tag.Attributes["href"] = Model.Href;
     }
 
+    if (!string.IsNullOrEmpty(Model.Target))
+    {
+        tag.Attributes["target"] = Model.Target;
+    }
+
     // Extract classes that are not icons from 'Model.Classes'.
     var notIconClasses = ((IEnumerable<string>)Model.Classes)
         .Where(c => !c.StartsWith(NavigationConstants.CssClassPrefix, StringComparison.OrdinalIgnoreCase))

diff --git a/src/OrchardCore.Themes/TheAgencyTheme/Views/MenuItemLink-HtmlMenuItem.liquid b/src/OrchardCore.Themes/TheAgencyTheme/Views/MenuItemLink-HtmlMenuItem.liquid
@@ -1,2 +1,2 @@
 {% assign link = Model.ContentItem.Content.HtmlMenuItemPart %}
-<a class="nav-link" href="{{ link.Url | href }}">{{ link.Html | raw }}</a>
+<a class="nav-link" href="{{ link.Url | href }}" target="{{ link.Target }}">{{ link.Html | raw }}</a>
diff --git a/src/OrchardCore.Themes/TheAgencyTheme/Views/MenuItemLink-LinkMenuItem.liquid b/src/OrchardCore.Themes/TheAgencyTheme/Views/MenuItemLink-LinkMenuItem.liquid
@@ -1,5 +1,5 @@
 {% assign link = Model.ContentItem.Content.LinkMenuItemPart %}
-<a class="nav-link" href="{{ link.Url | href }}"
+<a class="nav-link" href="{{ link.Url | href }}" target="{{ link.Target }}"
     {% if link.Url contains "#" %}
         data-bs-target="{{ link.Url | split: '/' | last }}"
     {% endif %}>

diff --git a/src/OrchardCore.Themes/TheBlogTheme/Views/MenuItemLink-HtmlMenuItem.liquid b/src/OrchardCore.Themes/TheBlogTheme/Views/MenuItemLink-HtmlMenuItem.liquid
@@ -3,5 +3,5 @@
 {% if Model.HasItems %}
     <a href="{{ link.Url | href }}" class="nav-link px-lg-3 py-3 py-lg-4 dropdown-toggle" data-bs-toggle="dropdown">{{ link.Html | raw }}<b class="caret"></b></a>
 {% else %}
-    <a class="nav-link px-lg-3 py-3 py-lg-4" href="{{ link.Url | href }}">{{ link.Html | raw }}</a>
-{% endif %}
+    <a class="nav-link px-lg-3 py-3 py-lg-4" href="{{ link.Url | href }}" target="{{ link.Target }}">{{ link.Html | raw }}</a>
+{% endif %}
diff --git a/src/OrchardCore.Themes/TheBlogTheme/Views/MenuItemLink-LinkMenuItem.liquid b/src/OrchardCore.Themes/TheBlogTheme/Views/MenuItemLink-LinkMenuItem.liquid
@@ -3,5 +3,5 @@
 {% if Model.HasItems %}
     <a href="{{ link.Url | href }}" class="nav-link px-lg-3 py-3 py-lg-4 dropdown-toggle" data-bs-toggle="dropdown">{{ Model.ContentItem.DisplayText }}<b class="caret"></b></a>
 {% else %}
-    <a class="nav-link px-lg-3 py-3 py-lg-4" href="{{ link.Url | href }}">{{ Model.ContentItem.DisplayText }}</a>
+    <a class="nav-link px-lg-3 py-3 py-lg-4" href="{{ link.Url | href }} target="{{ link.Target }}">{{ Model.ContentItem.DisplayText }}</a>
 {% endif %}
diff --git a/src/OrchardCore.Themes/TheTheme/Views/MenuItemLink-HtmlMenuItem.cshtml b/src/OrchardCore.Themes/TheTheme/Views/MenuItemLink-HtmlMenuItem.cshtml
@@ -18,6 +18,12 @@
     }
 
     tag.Attributes["href"] = url;
+
+    if (!string.IsNullOrEmpty(htmlMenuItemPart.Target))
+    {
+        tag.Attributes["target"] = htmlMenuItemPart.Target;
+    }
+
     tag.InnerHtml.AppendHtml(Html.Raw(htmlMenuItemPart.Html));
 
     if (Model.Level == 0 && Model.HasItems)

diff --git a/src/OrchardCore/OrchardCore.Navigation.Core/MenuItem.cs b/src/OrchardCore/OrchardCore.Navigation.Core/MenuItem.cs
@@ -36,6 +36,11 @@ public MenuItem()
         /// </summary>
         public string Href { get; set; }
 
+        /// <summary>
+        /// The html target of the menu item.
+        /// </summary>
+        public string Target { get; set; }
+
         /// <summary>
         /// The optional url the menu item should link to.
         /// </summary>

diff --git a/src/OrchardCore/OrchardCore.Navigation.Core/NavigationHelper.cs b/src/OrchardCore/OrchardCore.Navigation.Core/NavigationHelper.cs
@@ -68,6 +68,7 @@ private static async Task<dynamic> BuildMenuItemShapeAsync(dynamic shapeFactory,
             var menuItemShape = (await shapeFactory.NavigationItem())
                 .Text(menuItem.Text)
                 .Href(menuItem.Href)
+                .Target(menuItem.Target)
                 .Url(menuItem.Url)
                 .LinkToFirstChild(menuItem.LinkToFirstChild)
                 .RouteValues(menuItem.RouteValues)

diff --git a/src/OrchardCore/OrchardCore.Navigation.Core/NavigationItemBuilder.cs b/src/OrchardCore/OrchardCore.Navigation.Core/NavigationItemBuilder.cs
@@ -46,6 +46,13 @@ public NavigationItemBuilder Url(string url)
             return this;
         }
 
+        public NavigationItemBuilder Target(string target)
+        {
+            _item.Target = target;
+
+            return this;
+        }
+
         public NavigationItemBuilder Culture(string culture)
         {
             _item.Culture = culture;

diff --git a/src/OrchardCore/OrchardCore.Navigation.Core/NavigationManager.cs b/src/OrchardCore/OrchardCore.Navigation.Core/NavigationManager.cs
@@ -110,6 +110,7 @@ private static void Merge(List<MenuItem> items)
                             source.RouteValues = cursor.RouteValues;
                             source.Text = cursor.Text;
                             source.Url = cursor.Url;
+                            source.Target = cursor.Target;
 
                             source.Permissions.Clear();
                             source.Permissions.AddRange(cursor.Permissions);
@@ -133,6 +134,7 @@ private static void Merge(List<MenuItem> items)
                                 source.RouteValues = cursor.RouteValues;
                                 source.Text = cursor.Text;
                                 source.Url = cursor.Url;
+                                source.Target = cursor.Target;
 
                                 source.Permissions.Clear();
                                 source.Permissions.AddRange(cursor.Permissions);

diff --git a/src/docs/releases/2.0.0.md b/src/docs/releases/2.0.0.md
@@ -310,6 +310,10 @@ The `OrchardCore.Email` module has undergone a refactoring process with no break
  - If you were using the `OrchardCore_Email` configuration key to set up the SMTP provider for all tenants, please update the configuration key to `OrchardCore_Email_Smtp`. The `OrchardCore_Email` key continues to work but will be deprecated in a future release.
  - A new email provider was added to allow you to send email using Azure Communication Services Email. Click [here](../reference/modules/Email.Azure/README.md) to read more about the ACS module.
 
+### Menu
+
+`Menus` and `AdminMenus` now support specifying the target property.
+
 ### Admin Menu
 
 The admin menu has undergone performance enhancements, and new helpers have been added. When incorporating `INavigationProvider` in your project, you can now utilize `NavigationHelper.IsAdminMenu(name)` instead of the previous approach using `string.Equals(name, "admin", StringComparison.OrdinalIgnoreCase)`. Moreover, when passing route values to an action, it is advised to store them in a constant variable. An illustrative example is provided below.