import { getBlockMeta } from '@/marketing/block-registry';
import { DEFAULT_FOOTER, DEFAULT_HEADER, DEFAULT_WELCOME } from '@/marketing/cms-defaults';
import { migrateFooter, migrateNav, migrateWelcome } from '@/marketing/cms-migrator';
import type { FooterConfig, HeaderConfig, PageConfig, Section } from '@/marketing/cms-types';
import { type KitTeaserMeta } from '@/marketing/sections/TemplatesTeaserSection';
import PageSeo from '@/marketing/PageSeo';
import { Footer, Nav } from '@/marketing/shared';
import type { SharedProps } from '@/types/inertia';
import { Head, usePage } from '@inertiajs/react';
import { Fragment, type ReactNode } from 'react';

type WelcomePageProps = SharedProps & {
    kits?: KitTeaserMeta[];
    marketing: SharedProps['marketing'] & {
        welcome?: { sections: Section[] };
    };
};

export default function Welcome() {
    const page = usePage<WelcomePageProps>();
    const { auth, branding, marketing } = page.props;
    const kits = page.props.kits ?? [];
    const siteName = branding?.site_name || 'AppShot AI';
    // Defense in depth: server already runs the migrator at the read boundary,
    // but a stale browser-cached prop or partially-deployed worker could ship
    // an older-version doc. Re-run the chain here so the renderer always sees
    // current shape.
    const navConfig = marketing?.nav ? migrateNav<HeaderConfig>(marketing.nav as HeaderConfig) : DEFAULT_HEADER;
    const footerConfig = marketing?.footer ? migrateFooter<FooterConfig>(marketing.footer as FooterConfig) : DEFAULT_FOOTER;
    const welcomeConfig = marketing?.welcome
        ? migrateWelcome<PageConfig>(marketing.welcome as PageConfig)
        : DEFAULT_WELCOME;
    const sections = welcomeConfig.sections.filter((s) => s.enabled !== false);

    return (
        <>
            <Head title="Welcome">
            </Head>
            <PageSeo
                pageLabel="Welcome"
                override={welcomeConfig.seo}
                sections={sections}
            />
            <div className="flex min-h-screen flex-col bg-background font-sans text-foreground antialiased">
                <Nav
                    siteName={siteName}
                    authed={!!auth.user}
                    branding={branding}
                    nav={navConfig}
                />
                {/* ms-page-welcome: skin hook — Geometry shows the hero cursor
                    chips only on the landing page (heroes reused on custom
                    pages keep notes/arrows but not the John/You cursors). */}
                <main className="ms-page-welcome flex-1">
                    {sections.map((section) => (
                        <Fragment key={section.id}>
                            {renderSection(section, kits)}
                        </Fragment>
                    ))}
                </main>
                <Footer
                    siteName={siteName}
                    branding={branding}
                    footer={footerConfig}
                />
            </div>
        </>
    );
}

function renderSection(section: Section, kits: KitTeaserMeta[]): ReactNode {
    const meta = getBlockMeta(section.type);
    // Unknown section type — silently skip rather than crash. Happens if
    // admin's saved data has a block type from a future version they're
    // temporarily downgraded from. The migrator chain preserves the row in
    // storage; only the renderer drops it.
    if (!meta) return null;
    const Renderer = meta.renderer;
    if (section.type === 'templates_teaser') {
        return <Renderer section={section} kits={kits} />;
    }
    return <Renderer section={section} />;
}
