---
import BaseLayout from '../layouts/BaseLayout.astro';
import { fetchPageByPermalink, fetchSiteGlobals, fetchNavigation } from '../lib/directus/fetchers';
import BlockHero from '../components/blocks/BlockHero.astro';
import BlockRichText from '../components/blocks/BlockRichText.astro';
import BlockColumns from '../components/blocks/BlockColumns.astro';
import BlockMedia from '../components/blocks/BlockMedia.astro';
import BlockSteps from '../components/blocks/BlockSteps.astro';
import BlockQuote from '../components/blocks/BlockQuote.astro';
import BlockGallery from '../components/blocks/BlockGallery.astro';
import BlockFAQ from '../components/blocks/BlockFAQ.astro';
import BlockPosts from '../components/blocks/BlockPosts.astro';
import BlockForm from '../components/blocks/BlockForm.astro';

const siteId = Astro.locals.siteId;
const permalink = '/' + (Astro.params.slug || '');

// Fetch data
const [globals, navigation, page] = await Promise.all([
  siteId ? fetchSiteGlobals(siteId) : null,
  siteId ? fetchNavigation(siteId) : [],
  siteId ? fetchPageByPermalink(permalink, siteId) : null
]);

if (!page) {
  return Astro.redirect('/404');
}

// Block component map
const blockComponents: Record<string, any> = {
  block_hero: BlockHero,
  block_richtext: BlockRichText,
  block_columns: BlockColumns,
  block_media: BlockMedia,
  block_steps: BlockSteps,
  block_quote: BlockQuote,
  block_gallery: BlockGallery,
  block_faq: BlockFAQ,
  block_posts: BlockPosts,
  block_form: BlockForm,
};
---

<BaseLayout 
  title={page.seo_title || page.title}
  description={page.seo_description}
  image={page.seo_image}
  globals={globals}
  navigation={navigation}
>
  {page.blocks?.map((block) => {
    const Component = blockComponents[block.collection];
    if (Component) {
      return <Component {...block.item} />;
    }
    return null;
  })}
</BaseLayout>