ASP.NET Core The view component name X matched multiple types:

Question

Currently I have multiple Areas,

I have a view Component called

Sidebar

In each area the structure is the following

Areas
    Area 1
        Pages
            Shared
                Components
                    Sidebar
    Area 2
        Pages
            Shared
                Components
                    Sidebar

here is the code

    public class SidebarViewComponent : ViewComponent
    {
        public async Task<IViewComponentResult> InvokeAsync()
        {
            var sidebar = new SidebarViewModel();
    
            sidebar.Items = new List<SidebarItemViewModel>();
    
            var sidebarItem = new SidebarItemViewModel
            {
                Nome = "Producao",
                Icon = "<i class='nav-icon fas fa-calendar-alt'></i>",
                Url = null
            };
    
            var subItems = new List<SidebarItemSubItemViewModel>();
    
            subItems.Add(new SidebarItemSubItemViewModel
            {
                Nome = "Consultar",
                Icon = "<i class='nav-icon fas fa-search'></i>",
                Url = "/FrontEnd/Account/Producao/Index"
            });
    
            subItems.Add(new SidebarItemSubItemViewModel
            {
                Nome = "Adicionar",
                Icon = "<i class='nav-icon fas fa-plus'></i>",
                Url = "/FrontEnd/Account/Producao/Create"
            });
    
            sidebarItem.SubItems = subItems;
    
            sidebar.Items.Add(sidebarItem);
    
            return View(sidebar);
        }
    }

when I try to enter the index page on an area i get the exception

InvalidOperationException: The view component name 'Sidebar' matched multiple types:

Is there a way handle this issue? I tried

@await Component.InvokeAsync("Areas/Area1/Pages/Shared/Components/SidebarFrontEnd")

but it doesn't work

Answer 1

I managed it to work with typeof

@await Component.InvokeAsync(typeof(Areas.Area1.Pages.Shared.Components.Sidebar.SidebarViewComponent))

Hopefully this helps someone in future

Answer 2

Use the following code:

 @await Component.InvokeAsync("ProjectName.Areas.AreaName.Components.ComponentName")