<script lang="ts">
import { logout_user } from "lib/NovaAPI";
import { user } from "lib/UserStore";
</script>

{#if $user !== null}
	<ul>
		<li>Username: {$user.username}</li>
		{#if $user.email === ""}
			<li class="highlight_blue" style="text-align: initial;">
				No e-mail address configured. You will not be able to recover your
				account if you lose your password. Set an e-mail address on the <a
				href="/user/settings">Settings</a> page.
			</li>
		{:else}
			<li>
				E-mail address: {$user.email}
			</li>
		{/if}
		<li>
			<i class="icon">settings</i>
			<a href="/user/settings">Account settings</a>
		</li>
	</ul>
{/if}

<h3>Quick navigation</h3>

<div class="button_row">
	<a href="/d/me" class="button">
		<i class="icon">folder</i>
		Filesystem
	</a>
	<button onclick={()=> logout_user("/")}>
		<i class="icon">logout</i>
		Log out
	</button>
</div>

<style>
.button_row {
	display: flex;
	flex-wrap: wrap;
}
.button_row > * {
	flex: 1 1 auto;
}
ul {
	margin: 0;
}
h3 {
	font-size: 1.3em;
}
</style>
