@using Microsoft.AspNetCore.Authentication
@inherits LayoutComponentBase
@inject NavigationManager NavManager

<RadzenComponents @rendermode="InteractiveAuto" />

<div class="page">
    <!-- NAV MENU MANAGEMENT -->
    <header class="navbar navbar-expand-md d-print-none">
        <div class="container-xl">
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbar-menu" aria-controls="navbar-menu" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <h1 class="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-md-3">
                <a href="/">
                    <img src="/Logo_dac.png" width="80" class="">
                </a>
            </h1>
            <AuthorizeView>
                <Authorized>
                    <div class="navbar-nav flex-row order-md-last">
                        <div class="nav-item dropdown">
                            <a href="#" class="nav-link d-flex lh-1 text-reset p-0" data-bs-toggle="dropdown" aria-label="Open user menu">
                                <span class="avatar avatar-sm" style="background-image: url('/Logo_dac.png')"></span>
                                <div class="d-none d-xl-block ps-2">
                                    <div>@context.User.Identity?.Name</div>
                                </div>
                            </a>
                            <div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
                                <a href="/management/profile" class="dropdown-item">Il mio profilo</a>
                                <div class="dropdown-divider"></div>
                                <a href="/account/logout" class="dropdown-item"> Logout </a>
                            </div>
                        </div>
                    </div>
                </Authorized>
            </AuthorizeView>
        </div>
    </header>
    <header class="navbar-expand-md">
        <div class="collapse navbar-collapse" id="navbar-menu">
            <div class="navbar">
                <div class="container-xl">
                    <div class="row flex-column flex-md-row flex-fill align-items-center">
                        <div class="col">
                            <!-- BEGIN NAVBAR MENU -->
                            <ul class="navbar-nav">
                                <li class="nav-item @GetActiveClass("/management")">
                                    <a class="nav-link" href="/management">
                                        <span class="nav-link-icon d-md-none d-lg-inline-block">
                                            <i class="fa-solid fa-house"></i>
                                        </span>
                                        <span class="nav-link-title"> Home </span>
                                    </a>
                                </li>
                                <li class="nav-item @GetActiveClass("/management/Utenti")">
                                    <a class="nav-link" href="/management/Utenti">
                                        <span class="nav-link-icon d-md-none d-lg-inline-block">
                                            <i class="fa-solid fa-user"></i>
                                        </span>
                                        <span class="nav-link-title"> Utenti </span>
                                    </a>
                                </li>
                                <li class="nav-item @GetActiveClass("/management/Clienti")">
                                    <a class="nav-link" href="/management/Clienti">
                                        <span class="nav-link-icon d-md-none d-lg-inline-block">
                                            <i class="fa-solid fa-address-card"></i>
                                        </span>
                                        <span class="nav-link-title"> Clienti </span>
                                    </a>
                                </li>
                                <li class="nav-item @GetActiveClass("/management/Eventi")">
                                    <a class="nav-link" href="/management/Eventi">
                                        <span class="nav-link-icon d-md-none d-lg-inline-block">
                                            <i class="fa-solid fa-calendar"></i>
                                        </span>
                                        <span class="nav-link-title"> Eventi </span>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>
</div>

@Body

@code {
    [CascadingParameter]
    public HttpContext? httpContext { get; set; }

    private string currentUrl = string.Empty;

    protected override async Task OnInitializedAsync()
    {
        base.OnInitializedAsync();
        currentUrl = NavManager.ToBaseRelativePath(NavManager.Uri);
    }

    private string GetActiveClass(string href)
    {
        string currentClean = currentUrl.Split("management").Last();
        string hrefClean = href.Split("management").Last();


        if (currentClean.Contains("?"))
            currentClean = currentClean.Substring(0, currentClean.IndexOf("?"));

        var isActive = (currentClean.Contains(hrefClean, StringComparison.OrdinalIgnoreCase) && !string.IsNullOrEmpty(hrefClean)
                        || (string.IsNullOrEmpty(hrefClean) && string.IsNullOrEmpty(currentClean)));

        return isActive ? "active" : "";
    }

}