2025-03-03 18:46:09 +01:00

42 lines
1.0 KiB
TypeScript

import type { BaseContext } from "koa";
import { button } from "src/back/elements/button.js";
import { tempstream, type FlatTemplatable } from "tempstream";
export async function default_navbar(ctx: BaseContext): Promise<FlatTemplatable> {
const { items: navbar_items } = await ctx.$app.collections["navbar-links"]
.list(ctx.$context)
.fetch();
const linkData = navbar_items.map((e) => ({
text: e.get("label"),
url: e.get("href"),
}));
const linksHTML = linkData
.map(
(link) => /* HTML */ tempstream`<li>
${button({
text: link.text || "",
href: link.url || "",
variant: "accent1",
disabled: link.url == new URL(ctx.url, "https://a.com").pathname, // checking if it's the current path we're looking at
})}
</li>`
)
.join("\n");
return /* HTML */ `<nav>
<a href="/" class="nav-logo">
<img
src="/assets/logo"
alt="${ctx.$app.manifest.name} - logo"
width="50"
height="50"
/>
${ctx.$app.manifest.name}
</a>
<ul>
${linksHTML}
</ul>
</nav>`;
}