@using MP.INVE.Components
@using MP.INVE.Data

<div class="top-row ps-2 navbar navbar-dark">
    <div class="container-fluid px-0">
        @if (!showText)
        {
            <a class="navbar-brand p-0" @onclick="() => ToggleCompress()">MI <i class="fas fa-caret-square-right"></i></a>
        }
        else
        {
            <a class="navbar-brand" @onclick="() => ToggleCompress()">MP.INVE <i class="fas fa-caret-square-left compresser"></i></a>
        }
        <button title="Navigation menu" class="navbar-toggler" @onclick="ToggleNavMenu">
            <span class="navbar-toggler-icon"></span>
        </button>
    </div>
</div>

<div class="@NavMenuCssClass" @onclick="ToggleNavMenu">
    @if (!NavigationManager.Uri.Contains("OperatoreLogin"))
    {

        <nav class="flex-column">
            <div class="nav-item px-2 col-12">
                <NavLink class="nav-link px-2" href="" Match="NavLinkMatch.All">
                    <div class="col-2">
                        <span class="fa-solid fa-house px-2" aria-hidden="true"></span>
                    </div>
                    <div>
                        <span class="@hideText">Home</span>
                    </div>
                </NavLink>
            </div>

            <div class="nav-item px-2 col-12">
                <NavLink class="nav-link px-2" href="ElencoMagazzini">
                    <div class="col-2">
                        <span class="px-2" aria-hidden="true"><i class="fa-solid fa-warehouse"></i></span>
                    </div>
                    <div>
                        <span class="@hideText">Magazzini</span>
                    </div>
                </NavLink>
            </div>
            <div class="nav-item px-2 col-12">
                <NavLink class="nav-link px-2" href="OperatoreQR">
                    <div class="col-2">
                        <span class="px-2" aria-hidden="true"><i class="fa-solid fa-qrcode"></i></span>
                    </div>
                    <div>
                        <span class="@hideText">Login Operatore</span>
                    </div>
                </NavLink>
            </div>
            <div class="nav-item px-2 col-12">
                <NavLink class="nav-link px-2" href="InveSession">
                    <div class="col-2">
                        <span class="px-2" aria-hidden="true"><i class="fa-solid fa-boxes-stacked"></i></span>
                    </div>
                    <div>
                        <span class="@hideText">Sessioni di inventario</span>
                    </div>
                </NavLink>
            </div>
            <div class="nav-item px-2 col-12">
                <NavLink class="nav-link px-2" href="Contacts">
                    <div class="col-2">
                        <span class="px-2" aria-hidden="true"><i class="fa-solid fa-envelope"></i></span>
                    </div>
                    <div>
                        <span class="@hideText">Contatti</span>
                    </div>
                </NavLink>
            </div>
        </nav>
    }
</div>