shoc-backend/SeaHavenIndustries/Components/Layout/NavMenu.razor

@using Microsoft.AspNetCore.Identity
@using Microsoft.EntityFrameworkCore
@using global::Data.SeaHavenIndustries
@inject NavigationManager Navigation

<aside class="sidenav navbar navbar-vertical navbar-expand-xs border-0 border-radius-xl my-3 fixed-start ms-3 bg-gradient-dark"
       id="sidenav-main">
    <div class="sidenav-header">
        <i class="fas fa-times px-5 cursor-pointer opacity-5 position-absolute end-0 top-0 d-none d-xl-none"
           aria-hidden="true" id="iconSidenav"></i>
        <a class="navbar-brand m-0 mx-1" href="javascript:void(0)">
            <img src="./assets/img/Logo.png" class="navbar-brand-img h-90 img-fluid" alt="main_logo">
        </a>
    </div>
    <hr class="horizontal light mt-0 mb-2">
    <div class="collapse navbar-collapse w-auto h-auto" id="sidenav-collapse-main">
        <ul class="navbar-nav">
            <li class="nav-item mb-2 mt-0">
                <a data-bs-toggle="collapse" href="#ProfileNav" class="nav-link" aria-controls="ProfileNav" role="button" aria-expanded="false">
                    @if (AuthStat.Result.User.Identity.IsAuthenticated)
                    {
                         var user = UserManager.GetUserAsync(AuthStat.Result.User);
                        @* if (user.Result.UserImage != null)
                        {
                            <img src="@user.Result.UserImage" class="avatar loginUserProfile" alt="User Profile">
                        }
                        else
                        {
                            <img src="/assets/img/team-4.jpg" class="avatar loginUserProfile" alt="User Profile">
                        } *@
                        <span class="nav-link-text ms-2 ps-1">@user.Result.FirstName </span>
                    }
                </a>
                <div class="collapse" id="ProfileNav" style="">
                    <ul class="nav ">
                        <li class="nav-item">
                            <form action="Account/Logout" method="post">
                                <AntiforgeryToken />
                                <input type="hidden" name="ReturnUrl" value="@currentUrl" />
                                <button type="submit" class="nav-link logOutBtn border-0">
                                    <span class="sidenav-mini-icon"> L </span>
                                    <span class="sidenav-normal  ms-3  ps-1"> Logout </span>
                                </button>
                            </form>
                        </li>
                    </ul>
                </div>
            </li>
            <hr class="horizontal light mt-0">
            <AuthorizeView Roles="Admin,Manager">
                <Authorized>
                    <li class="nav-item">
                        <a class="nav-link @(currentUrl == "" ? "active" : "")" role="button" aria-expanded="false" href="" Match="NavLinkMatch.All">
                            <i class="material-icons-round opacity-10">home</i>
                            <span class="nav-link-text ms-2 ps-1" style="font-weight: 500;">Home</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link @(currentUrl == "workorderlist" || currentUrl.Contains("Workorderdetail") ? "active" : "")" role="button" aria-expanded="false" href="workorderlist" Match="NavLinkMatch.All">
                            <i class="material-icons-round opacity-10">list_alt</i>
                            <span class="nav-link-text ms-2 ps-1" style="font-weight: 500;">Work Orders</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link @(currentUrl == "quotes" || currentUrl.Contains("quotesdetails") || currentUrl.Contains("createquotes") ? "active" : "")" role="button" aria-expanded="false" href="quotes" Match="NavLinkMatch.All">
                            <i class="material-icons-round opacity-10">article</i>
                            <span class="nav-link-text ms-2 ps-1" style="font-weight: 500;">Quotes</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link @(currentUrl == "reporting" ? "active" : "")" role="button" aria-expanded="false" href="reporting" Match="NavLinkMatch.All">
                            <i class="material-icons-round opacity-10">account_box</i>
                            <span class="nav-link-text ms-2 ps-1" style="font-weight: 500;">Reporting</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link @(currentUrl == "contacts" ? "active" : "")" role="button" aria-expanded="false" href="contacts" Match="NavLinkMatch.All">
                            <i class="material-icons-round opacity-10">contact_page</i>
                            <span class="nav-link-text ms-2 ps-1" style="font-weight: 500;">Contacts</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link @(currentUrl == "addressbook" ? "active" : "")" role="button" aria-expanded="false" href="addressbook" Match="NavLinkMatch.All">
                            <i class="material-icons-round opacity-10">edit_location</i>
                            <span class="nav-link-text ms-2 ps-1" style="font-weight: 500;">Address Book</span>
                        </a>
                    </li>
                </Authorized>

            </AuthorizeView>
            <AuthorizeView Roles="Admin">
                <Authorized>
                    <li class="nav-item">
                        <a class="nav-link @(currentUrl == "users" ? "active" : "")" role="button" aria-expanded="false" href="users" Match="NavLinkMatch.All">
                            <i class="material-icons-round opacity-10">person</i>
                            <span class="nav-link-text ms-2 ps-1" style="font-weight: 500;">Users</span>
                        </a>
                    </li>
                </Authorized>

            </AuthorizeView>
            <AuthorizeView Roles="Admin,Manager">
                <Authorized>
                    <li class="nav-item">
                        <a class="nav-link @(currentUrl == "settings" ? "active" : "")" role="button" aria-expanded="false" href="settings" Match="NavLinkMatch.All">
                            <i class="material-icons-round opacity-10">settings</i>
                            <span class="nav-link-text ms-2 ps-1" style="font-weight: 500;">Settings</span>
                        </a>
                    </li>
                </Authorized>

            </AuthorizeView>
            <AuthorizeView Roles="User">
                <Authorized>
                    <li class="nav-item">
                        <a class="nav-link @(currentUrl == "UserHome" ? "active" : "")" role="button" aria-expanded="false" href="UserHome" Match="NavLinkMatch.All">
                            <i class="material-icons-round opacity-10">home</i>
                            <span class="nav-link-text ms-2 ps-1" style="font-weight: 500;">Home</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <NavLink href="userworkorders" class="nav-link" Match="NavLinkMatch.All" style="color:#3C4856!important;">
                            <i class="material-icons-round text-light pe-2   float-start">home</i>
                            <span class="nav-link-text text-light px-2 ps-0" style="font-weight: 500;">Work Orders</span>
                        </NavLink>
                    </li>
                    <li class="nav-item">
                        <NavLink href="usersettings" class="nav-link  " Match="NavLinkMatch.All" style="color:#3C4856 !important;">
                            <span class="material-icons material-symbols-outlined text-light pe-2 ">settings</span>
                            <span class="nav-link-text text-light  ps-1 " style="font-weight: 400">
                                Settings
                            </span>
                        </NavLink>
                    </li>
                </Authorized>
            </AuthorizeView>
        </ul>
    </div>

</aside>

@inject UserManager<ApplicationUser> UserManager

@code {

    [CascadingParameter] protected Task<AuthenticationState>? AuthStat { get; set; }
    private bool collapseNavMenu = true;
    private string? currentUrl;
    private string? NavMenuCssClass => collapseNavMenu ? "collapse" : null;
    protected override void OnInitialized()
    {
        currentUrl = Navigation.ToBaseRelativePath(Navigation.Uri);
        Navigation.LocationChanged += OnLocationChanged;
    }

    private void OnLocationChanged(object? sender, LocationChangedEventArgs e)
    {
        currentUrl = Navigation.ToBaseRelativePath(e.Location);
        StateHasChanged();
    }
    private void ToggleNavMenu()
    {
        collapseNavMenu = !collapseNavMenu;
    }
}