import { notFound } from "next/navigation";
import { StorefrontFooter } from "@/components/storefront/storefront-footer";
import { StorefrontHeader } from "@/components/storefront/storefront-header";
import { themeToCssVars } from "@/components/storefront/theme";
import { buildContext, getShell } from "./storefront-data";

interface StorefrontLayoutProps {
  children: React.ReactNode;
  params: Promise<{ slug: string }>;
}

/**
 * Chrome for a store's own website. Deliberately shares nothing with the
 * marketplace layout — no Alqove nav, no cart, no search — because this page
 * can be served from the seller's own domain and should read as their site.
 */
export default async function StorefrontLayout({ children, params }: StorefrontLayoutProps) {
  const { slug } = await params;
  const shell = await getShell(slug);

  if (!shell) notFound();

  const ctx = await buildContext(slug, shell);

  return (
    <div className="flex min-h-screen flex-col" style={themeToCssVars(shell.theme)}>
      <StorefrontHeader ctx={ctx} />
      <main className="flex-1">{children}</main>
      <StorefrontFooter ctx={ctx} />
    </div>
  );
}