import { SiteHeader } from "@/components/layout/site-header";
import { SiteSidebar } from "@/components/layout/site-sidebar";
import { SiteBottomNav } from "@/components/layout/site-bottom-nav";
import { AppShell } from "@/components/layout/app-shell";
import { SiteFooter } from "@/components/layout/site-footer";
import { VerifyEmailBanner } from "@/components/auth/verify-email-banner";
import { PushPrompt } from "@/components/push/push-prompt";

/**
 * Default app layout — the reading-app chrome that wraps the home page, all
 * the book / letter / transcription / etc. routes, the user profile, and
 * the auth pages.
 *
 * Sibling groups (e.g. `(legal)/`) opt out of this chrome by living in their
 * own route group with their own layout. Everything in the root layout
 * (providers, fonts, toaster, floating audio player) still wraps this layer.
 *
 * The text-selection toolbar and its highlight/bookmark companions live in
 * the nested `(reader)/` group instead of here, so they only mount over the
 * scripture library and never fire on chrome text (home, search, profile,
 * settings, …).
 */
export default function AppLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <>
      <VerifyEmailBanner />
      <SiteSidebar />
      <AppShell>
        <SiteHeader />
        {children}
        <SiteFooter />
      </AppShell>
      <SiteBottomNav />
      <PushPrompt />
    </>
  );
}