<script>
    import {locals} from "../../../ts/stores.js";
    import NavMenuItem from "../../components/NavMenuItem.svelte";
    import {hasRoute, route} from "../../../../common/Routing";
    import NavMenuDropdown from "../../components/NavMenuDropdown.svelte";
    import BaseNavMenuAuthAccountDropdownAdditionalLinks from "./BaseNavMenuAuthAccountDropdownAdditionalLinks.svelte";

    export let noLoginLink = false;
    let accountItemHovered;
</script>

{#if hasRoute('auth')}
    {#if $locals.user}
        {#if $locals.user.is_admin}
            <NavMenuItem href={route('backend')} icon="settings" text="Backend"/>
        {/if}

        <NavMenuItem href={route('account')} icon="user" text={$locals.user.name || 'Account'} bind:hovered={accountItemHovered}>
            <NavMenuDropdown bind:open={accountItemHovered}>
                <BaseNavMenuAuthAccountDropdownAdditionalLinks/>
                <NavMenuItem href={route('logout')} icon="log-out" text="Logout" action/>
            </NavMenuDropdown>
        </NavMenuItem>
    {:else if !noLoginLink}
        <NavMenuItem href={route('auth')} icon="log-in" text="Log in / Register"/>
    {/if}
{/if}
