import type { ReactNode } from "react";
import type { SitePayload, MenuItem, MetaPayload } from "@/lib/api";
import { LOCALES, type LocaleCode } from "@/lib/locales";
import type { Translator } from "@/lib/i18n";
import HtmlAttributes from "./HtmlAttributes";
import PageContext from "./PageContext";
import MediaImage from "./ui/MediaImage";
import MobileNav from "./MobileNav";
import SidePanel from "./SidePanel";
import FloatingContact from "./FloatingContact";
import { formLabels } from "./sections";
import CodeSnippets from "./CodeSnippets";
/**
* Header, main and footer — the markup of partials/header.blade.php and
* partials/footer.blade.php.
*
* `data-page` sits on the outermost wrapper rather than on . All 85
* occurrences of that attribute in site.css are *descendant* selectors
* (`body[data-page="project"] .x`) and none style body itself, so scoping them
* to a wrapper that is body's only child matches an identical element set. The
* stylesheet was rewritten accordingly, once, with sed.
*
* The reason for moving it: Next's App Router only lets the root layout emit
* , and the root layout cannot see the resolved template of a deep dynamic
* segment without opting the whole route out of static rendering. Setting it
* from client JS instead would break the "renders without JavaScript"
* requirement — 29 rules would not apply for a reader without scripting.
*/
export default function SiteChrome({
children,
site,
locale,
path,
dir,
dataPage,
meta,
t,
}: {
children: ReactNode;
site: SitePayload | null;
locale: LocaleCode;
path: string;
dir: "rtl" | "ltr";
dataPage: string;
meta: MetaPayload;
t: Translator;
}) {
const brand = site?.siteName ?? "";
/*
* Per-URL features are only paid for when they are in use.
*
* Both of these force an uncacheable request on every page view, because a
* cached response would serve one URL's targeting to another. The counts come
* from the cached /site payload, so a site with none configured skips them
* entirely.
*/
const flags = site?.hasPageContext;
const snippetsEnabled = flags?.snippets ?? true;
const contextEnabled = (flags?.popups ?? true) || (flags?.actionBars ?? true);
return (
<>
{/*
Mirrors lang/dir onto , which only the root layout may render.
The wrapper below already carries them server-side, so a reader without
JavaScript still gets a correctly-directioned page; this exists for
document-level behaviour and for locale switches during client-side
navigation, where no new document is parsed.
*/}
{/*
`dir` and `lang` are on the wrapper, not only on , and that is
deliberate: both are global attributes that apply to their subtree, so
the Arabic RTL default renders correctly in the server HTML with no
script involved.
*/}
{/*
Editor-managed tags, resolved during the server render so they fire in
the same order they did on the Blade site. Fetching them after
hydration would change when analytics run and break attribution.
*/}
{t("ui.skip_to_content")}
)}