@inherits LayoutComponentBase

<header class="app-bar">
    <a class="brand" href="/"><span class="mark">&#9646;</span> MXAccess Gateway</a>
    <span class="crumb">&rsaquo;</span>
    <span class="crumb">gateway dashboard</span>
    <span class="spacer"></span>
    <AuthorizeView>
        <Authorized Context="authState">
            <span class="meta">@authState.User.Identity?.Name</span>
            <span class="conn-pill" data-state="connected">
                <span class="dot"></span><span>signed in</span>
            </span>
        </Authorized>
        <NotAuthorized>
            <span class="conn-pill" data-state="disconnected">
                <span class="dot"></span><span>signed out</span>
            </span>
        </NotAuthorized>
    </AuthorizeView>
</header>

<div class="app-shell">
    <nav class="side-rail">
        <div class="rail-eyebrow">Overview</div>
        <NavLink class="rail-link" href="/" Match="NavLinkMatch.All">Dashboard</NavLink>

        <div class="rail-eyebrow">Runtime</div>
        <NavLink class="rail-link" href="/sessions" Match="NavLinkMatch.Prefix">Sessions</NavLink>
        <NavLink class="rail-link" href="/workers" Match="NavLinkMatch.Prefix">Workers</NavLink>
        <NavLink class="rail-link" href="/events" Match="NavLinkMatch.Prefix">Events</NavLink>
        <NavLink class="rail-link" href="/alarms" Match="NavLinkMatch.Prefix">Alarms</NavLink>

        <div class="rail-eyebrow">Galaxy</div>
        <NavLink class="rail-link" href="/galaxy" Match="NavLinkMatch.Prefix">Repository</NavLink>
        <NavLink class="rail-link" href="/browse" Match="NavLinkMatch.Prefix">Browse</NavLink>

        <div class="rail-eyebrow">Admin</div>
        <NavLink class="rail-link" href="/apikeys" Match="NavLinkMatch.Prefix">API keys</NavLink>
        <NavLink class="rail-link" href="/settings" Match="NavLinkMatch.Prefix">Settings</NavLink>

        <div class="rail-foot">
            <AuthorizeView>
                <Authorized Context="authState">
                    <div class="rail-eyebrow">Session</div>
                    <div class="rail-user">@authState.User.Identity?.Name</div>
                    <div class="rail-roles">
                        @string.Join(", ", authState.User.Claims
                            .Where(c => c.Type == System.Security.Claims.ClaimTypes.Role)
                            .Select(c => c.Value))
                    </div>
                    <form method="post" action="/logout">
                        <AntiforgeryToken />
                        <button class="rail-btn" type="submit">Sign out</button>
                    </form>
                </Authorized>
                <NotAuthorized>
                    <div class="rail-eyebrow">Session</div>
                    <a class="rail-btn" href="/login">Sign in</a>
                </NotAuthorized>
            </AuthorizeView>
        </div>
    </nav>

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