---
import { getMenu, getSiteSettings } from "emdash";
import {
	WidgetArea,
	EmDashHead,
	EmDashBodyStart,
	EmDashBodyEnd,
} from "emdash/ui";
import { createPublicPageContext } from "emdash/page";
import LiveSearch from "emdash/ui/search";
import { resolveStarterSiteIdentity } from "../utils/site-identity";

interface Props {
	title: string;
	pageTitle?: string | null;
	description?: string | null;
	image?: string | null;
	canonical?: string | null;
	/** Pass content reference for plugin page contributions on content pages */
	content?: { collection: string; id: string; slug?: string | null };
}

const { title, pageTitle, description, image, canonical, content } = Astro.props;
const { siteTitle, siteTagline, siteLogo } = resolveStarterSiteIdentity(await getSiteSettings());
const fullTitle = title.includes(siteTitle) ? title : `${title} — ${siteTitle}`;
const pageDescription = description ?? siteTagline;

const menu = await getMenu("primary");

const pageCtx = createPublicPageContext({
	Astro,
	kind: content ? "content" : "custom",
	pageType: "website",
	title: fullTitle,
	pageTitle: pageTitle ?? title,
	description: pageDescription,
	canonical,
	image,
	content,
	siteName: siteTitle,
});
---

<!doctype html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>{fullTitle}</title>
		{pageDescription && <meta name="description" content={pageDescription} />}
		{canonical && <link rel="canonical" href={canonical} />}
		<EmDashHead page={pageCtx} />
	</head>
	<body>
		<EmDashBodyStart page={pageCtx} />

		<header>
			<nav>
				<a href="/">
					{siteLogo
						? <img src={siteLogo.url} alt={siteLogo.alt || siteTitle} style="height:48px;width:auto;margin:-8px 0;display:block;" />
						: siteTitle
					}
				</a>
				{
					menu?.items.map((item) => (
						<a href={item.url} target={item.target}>
							{item.label}
						</a>
					))
				}
				<LiveSearch placeholder="Search..." collections={["posts", "pages"]} />
			</nav>
		</header>

		<main>
			<slot />
		</main>

		<footer>
			<WidgetArea name="sidebar" />
		</footer>

		<EmDashBodyEnd page={pageCtx} />
	</body>
</html>
