<script>
    import Avatar from "../common/Avatar.svelte";
    // import Dropdown from "../svelte/common/Dropdown.svelte";
    let { channel, user } = $props();
</script>

<div class="top-nav">
    <a class="top-nav-item" href="{channel.lucentUrl}/members">Members</a>
    <a class="top-nav-item" href="{channel.lucentUrl}/schemas">Schemas</a>

    <!-- {#if channel.commands.length > 0}
        <Dropdown>
            <div slot="button">Actions</div>
            {#each channel.commands as command}
                <a
                    href="{channel.lucentUrl}/command-report/{command.signature}"
                    class="top-nav-item">{command.name}</a
                >
            {/each}
        </Dropdown>
    {/if} -->
    <!--        <div>-->
    <!--            <form method="GET">-->
    <!--                <input type="search" name="filter[search_regex]" placeholder="Search"-->
    <!--                       class="form-control" required/>-->
    <!--            </form>-->
    <!--        </div>-->
    <a href="{channel.lucentUrl}/profile">
        <Avatar side="28" name={user.name} />
    </a>
</div>
