"use client";

import { usePathname } from "next/navigation";

import { SiteFooter } from "@/components/layout/site-footer";
import { SiteHeader } from "@/components/layout/site-header";
import { cn } from "@/lib/utils";

const FULL_HEIGHT_ROUTES = ["/editor"];

type Props = { children: React.ReactNode };

/**
 * Page chrome wrapper. Editor routes get a full-height layout with no footer
 * so the page itself never scrolls — only the editor's internal panes do.
 */
export function SiteShell({ children }: Props) {
  const pathname = usePathname() ?? "/";
  const isFullHeight = FULL_HEIGHT_ROUTES.some(
    (route) => pathname === route || pathname.startsWith(`${route}/`),
  );

  return (
    <div
      className={cn(
        "flex flex-col",
        isFullHeight ? "h-dvh overflow-hidden" : "min-h-dvh",
      )}
    >
      <SiteHeader />
      <main id="main" className={cn(isFullHeight ? "min-h-0 flex-1" : "flex-1")}>
        {children}
      </main>
      {isFullHeight ? null : <SiteFooter />}
    </div>
  );
}