How to highlight parent menu items

There are scenarios where an add-on has a few views, but only some of them should be accessible through the menu. For example, the add-on "Email manager" has three views available in its menu:

• Overview
• Create email
• Reports

The menu provider looks like this:

 [MenuProvider]
    public class EmailsMenuProvider : IMenuProvider
    {
        public IEnumerable<MenuItem> GetMenuItems()
        {
            // parent
            var emailsSection = new SectionMenuItem("Email manager", "/global/emails")
            {
                IsAvailable = (request) => true
            };

            var overview = new UrlMenuItem("Overview", "/global/emails/overview", ResolveMenuUrl("Overview"))
            {
                IsAvailable = (request) => true,
                SortIndex = 100
            };
            var create = new UrlMenuItem("Create email", "/global/emails/create", ResolveMenuUrl("Create"))
            {
                IsAvailable = (request) => true,
                SortIndex = 200
            };
            var reports = new UrlMenuItem("Reports", "/global/emails/reports", ResolveMenuUrl("Reports"))
            {
                IsAvailable = (request) => true,
                SortIndex = 300
            };

            return new MenuItem[]
            {
                emailsSection,
                overview,
                create,
                reports,
            };
        }

        public static string ResolveMenuUrl(string item)
        {
            var moduleUrl = Paths.ToResource(typeof(EmailsMenuProvider), "emails");
            return UriUtil.Combine(moduleUrl, item);
        }
    }

Create email is a form with a regular submit button. After a user sends an email, they are redirected to the Mail sent confirmation page, which is not rendered in the menu; however, it should have the Create email menu item highlighted.

To do this, the Mail sent view should also be added to the provider with its path based on the Create email path (/global/emails/create/mailsent) and the IsAvailable option set to false. Then, the option is not rendered in the menu, but will highlight its direct parent.

 [MenuProvider]
    public class EmailsMenuProvider : IMenuProvider
    {
        public IEnumerable<MenuItem> GetMenuItems()
        {
            // parent
            var emailsSection = new SectionMenuItem("Email manager", "/global/emails")
            {
                IsAvailable = (request) => true
            };

            var overview = new UrlMenuItem("Overview", "/global/emails/overview", ResolveMenuUrl("Overview"))
            {
                IsAvailable = (request) => true,
                SortIndex = 100
            };
            var create = new UrlMenuItem("Create email", "/global/emails/create", ResolveMenuUrl("Create"))
            {
                IsAvailable = (request) => true,
                SortIndex = 200
            };
            var reports = new UrlMenuItem("Reports", "/global/emails/reports", ResolveMenuUrl("Reports"))
            {
                IsAvailable = (request) => true,
                SortIndex = 300
            };
            var mailSent = new UrlMenuItem(string.Empty, "/global/emails/create/mailsent", ResolveMenuUrl("ResendMessage"))
            {
                IsAvailable = (request) => false,
                SortIndex = 400
            };

            return new MenuItem[]
            {
                emailsSection,
                overview,
                create,
                reports,
                mailSent
            };
        }

        public static string ResolveMenuUrl(string item)
        {
            var moduleUrl = Paths.ToResource(typeof(EmailsMenuProvider), "emails");
            return UriUtil.Combine(moduleUrl, item);
        }
    }

Last updated: Jul 02, 2021