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.