Sidebar not showing items

[CosminCAS123]

Hey! New to blazor bootstrap and blazor in general(Web App interactive auto template ). In client project, I defined a layout that'll use the SideBar component . I simplified it for this issue ( no data provider) :

@inherits LayoutComponentBase


<div class="bb-page">
    <Sidebar Title="For relationships" IconName="IconName.Apple">
                 < NavItem Href="/home" IconName="IconName.House" Text="Home" />
    
    </Sidebar>

    <main class="content">
        @Body
    </main>
</div>

then the Home page (client project) looks like this :

@page "/home"
@rendermode InteractiveAuto
@layout Layouts.SidebarLayout

<h1>HOME PAGE WITH SIDEBAR LAYOUT</h1>

And the result is :

I also tried the layout on my starting auth interactive SSR pages (login and register) from the server, and the same thing happens.

I installed blazor bootstrap accordingly to the web app interactive auto tutorial. If you need any more information ,please tell me. Thanks!

[gvreddy04]

@CosminCAS123 Thank you for trying BlazorBootstrap. Here is the example:

<Sidebar Href="/"
         IconName="IconName.BootstrapFill"
         Title="Blazor Bootstrap"
         DataProvider="SidebarDataProvider" />

@code {
    IEnumerable<NavItem>? navItems;

    private async Task<SidebarDataProviderResult> SidebarDataProvider(SidebarDataProviderRequest request)
    {
        if (navItems is null)
            navItems = GetNavItems();

        return await Task.FromResult(request.ApplyTo(navItems));
    }

    private IEnumerable<NavItem> GetNavItems()
    {
        navItems = new List<NavItem>
        {
            new NavItem { Href = "/getting-started", IconName = IconName.HouseDoorFill, Text = "Getting Started"},
            new NavItem { Href = "/alerts", IconName = IconName.CheckCircleFill, Text = "Alerts"},
            new NavItem { Href = "/autocomplete", IconName = IconName.InputCursorText, Text = "Auto Complete"},
            new NavItem { Href = "/breadcrumb", IconName = IconName.SegmentedNav, Text = "Breadcrumb"},
            new NavItem { Href = "/sidebar", IconName = IconName.LayoutSidebarInset, Text = "Sidebar"},
        };
        return navItems;
    }
}

Link: https://demos.blazorbootstrap.com/sidebar

[CosminCAS123]

yes, i followed the tutorial , but I simplified my sidebar for the sake of example. still endless loading happening.

[zabeda]

I am having a similar problem and I think I may have tracked down what is happening. It appears that the menu has the collapse class added to it, so it is never displayed. If I manually remove the collapse class in the browser, the menu appears. Is there something else that needs to be done to have this not include the collapse class? I looked at the code for SideBar and I didn't see how this could be done from the outside. It looks like collapseNavMenu is initialized to true, but there isn't a way to flip it.

Any assistance would be appreciated. Thank you.