//src\app\(root)\page.tsx

import { getHomeData } from '@/lib/directQueries/allqueries';
import HeroSection from '@/app/components/Frontend/HeroSection';
import { Metadata } from 'next';
import JsonLdSchemas from '@/app/components/Frontend/JsonLdSchemas';
import DynamicComponent from '@/app/components/Frontend/DynamicComponent';
import { PageComponent, ContainerComponentProps } from '@/lib/page-builder/types';

// ── Metadata ──────────────────────────────────────────────────────────────────

export async function generateMetadata(): Promise<Metadata> {
  const Mdata = await getHomeData();
  const title = Mdata?.data?.meta_title || 'Website Meta Title';
  const description = Mdata?.data?.meta_description || 'Website Meta Description';

  return {
    title,
    description,
    alternates: { canonical: process.env.NEXT_PUBLIC_APP_URL },
    openGraph: {
      title,
      description,
      url: process.env.NEXT_PUBLIC_APP_URL,
      siteName: process.env.NEXT_PUBLIC_API_WEBSITE_NAME,
      type: 'website',
    },
    twitter: { card: 'summary', title, description },
    robots: { index: true, follow: true },
  };
}

// ── Helpers ───────────────────────────────────────────────────────────────────

function isContainer(comp: PageComponent): comp is PageComponent & { props: ContainerComponentProps } {
  return comp.type === 'Container';
}

// Single O(n) pass: collect all child IDs, then filter top-level components
function getTopLevelComponents(components: PageComponent[]): PageComponent[] {
  const childIds = new Set<string>();
  for (const comp of components) {
    if (isContainer(comp)) {
      for (const id of comp.props.childComponentIds ?? []) {
        childIds.add(id);
      }
    }
  }
  return components.filter(comp => !childIds.has(comp.id));
}

// ── Page ──────────────────────────────────────────────────────────────────────

export default async function HomePage() {
  const homeData = await getHomeData();
  const schemas = homeData?.data?.page_schemas ?? [];
  const allComponents: PageComponent[] = homeData?.data?.builder_data?.components ?? [];

  const topLevelComponents = getTopLevelComponents(allComponents);

  return (
    <main className="min-h-screen">
      <JsonLdSchemas schemas={schemas} />
      <HeroSection />
      
      <div className="relative overflow-x-clip">
        {topLevelComponents.map(component => (
          <DynamicComponent
            key={component.id}
            component={component}
            allComponents={allComponents}
          />
        ))}
      </div>
    </main>
  );
}