package layout

templ navBar() {
	<nav class="navbar" role="navigation" aria-label="main navigation">
		<div class="navbar-brand">
			<a class="navbar-item" href="/">Newsbot</a>
			<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
				<span aria-hidden="true"></span>
				<span aria-hidden="true"></span>
				<span aria-hidden="true"></span>
				<span aria-hidden="true"></span>
			</a>
		</div>
		<div id="navbarBasicExample" class="navbar-menu">
			<div class="navbar-start">
				<a class="navbar-item" href="/articles">Articles</a>
				<a class="navbar-item" href="/sources">Sources</a>
				<a class="navbar-item">{ getUsername(ctx) }</a>
			</div>
			<div class="navbar-end">
				<div class="navbar-item">
					<div class="buttons">
						if getUsername(ctx) == "" {
							<a class="button is-primary" href="/users/signup"><strong>Sign up</strong></a>
							<a class="button is-light" href="/users/login">Log in</a>
						} else {
							<div class="navbar-item has-dropdown is-hoverable">
								<a class="navbar-link">{ getUsername(ctx) }</a>
								<div class="navbar-dropdown">
									<a class="navbar-item" href="/users/profile">Profile</a>
									<a class="navbar-item" href="/users/logout">Logout</a>
								</div>
							</div>
						}
					</div>
				</div>
			</div>
		</div>
	</nav>
}