Only include pages for projects that have body

src/pages/projects/[slug].astro

@@ -0,0 +1,69 @@
+---
+import ImageCarousel from "@components/ImageCarousel.astro";
+import SectionTitle from "@components/SectionTitle.astro";
+import MainLayout from "@layouts/MainLayout.astro";
+
+import { getCollection, render } from "astro:content";
+
+import {
+  getAllProjectImages,
+  getFullExternalURLOfImage,
+  getProjectHero
+} from "@/lib/utils";
+
+export async function getStaticPaths() {
+  const projects = await getCollection("projects", ({ body }) => {
+    return body && body.trim().length > 0;
+  });
+
+  return projects.map((project) => ({
+    params: { slug: project.id },
+    props: { project }
+  }));
+}
+
+const { project } = Astro.props;
+const { Content } = await render(project);
+
+const images = getAllProjectImages(project);
+const hero = getProjectHero(project);
+
+const seoImage: SiteImage = {
+  externalURL: await getFullExternalURLOfImage(hero),
+  src: hero.src,
+  alt: project.data.images.hero.alt
+};
+---
+
+<MainLayout
+  title={project.data.title}
+  description={project.data.description}
+  image={seoImage}
+>
+  <div class="w-full">
+    <section id="cta" class="text-white">
+      <div class="flex h-64 w-full items-center justify-center">
+        <ImageCarousel
+          images={images}
+          className="absolute -z-40 h-full w-full"
+          foreground={true}
+          interval={2000}
+          transitionDuration="duration-1000"
+          quality={50}
+          height={256}
+          shuffle={true}
+        />
+        <h1 class="font-header text-4xl uppercase text-shadow-lg/75">
+          {project.data.title}
+        </h1>
+      </div>
+    </section>
+    <section id="projects" class="bg-white dark:bg-gray-950">
+      <div <div class="mx-auto max-w-4xl px-8 py-16 text-center">
+        <SectionTitle>{project.data.title}</SectionTitle>
+
+        <Content />
+      </div>
+    </section>
+  </div>
+</MainLayout>