---
import BaseLayout from '../../layouts/BaseLayout.astro';
import { getNews } from '../../lib/directus';
import { formatDate } from '../../lib/format';

type NewsItem = Awaited<ReturnType<typeof getNews>>[number];

export async function getStaticPaths() {
  const news = await getNews();
  return news.map((item) => ({ params: { slug: item.slug }, props: { item } }));
}

const { item } = Astro.props as { item: NewsItem };
---

<BaseLayout title={item.title} description={item.summary}>
  <article class="container prose">
    <p class="meta">Published {formatDate(item.publish_date)}</p>
    <h1 class="section-title">{item.title}</h1>
    <p>{item.summary}</p>
    <div set:html={item.body} />
  </article>
</BaseLayout>
