Fix TutorialLayout crash for tutorials without optional fields

hxrshxz · hxrshxz · commit d3a3d9c1bdef · 2026-02-05T22:16:07.000+05:30
Add build-time validation via Zod .refine() to enforce that tutorials include authors, featuredImage, featuredImageAlt, and description in production builds while allowing them to be omitted during development. Also add optional chaining in TutorialLayout.astro to prevent crashes when these fields are undefined during dev. Closes #1006
diff --git a/src/content/tutorials/config.ts b/src/content/tutorials/config.ts
@@ -17,19 +17,37 @@ export const categories = [
 export const tutorialsCollection = defineCollection({
   type: "content",
   schema: ({ image }) =>
-    z.object({
-      // Title of the tutorial
-      title: z.string(),
-      // People who wrote the tutorial
-      authors: z.array(z.string()).optional(),
-      // Optional note explaining more context about the authors
-      authorsNote: z.string().optional(),
-      description: z.string().optional(),
-      category: z.enum(categories),
-      categoryIndex: z.number().optional(),
-      // Image to use as a thumbnail for the tutorial
-      featuredImage: image().optional(),
-      featuredImageAlt: z.string().optional(),
-      relatedContent: relatedContent().optional(),
-    }),
+    z
+      .object({
+        // Title of the tutorial
+        title: z.string(),
+        // People who wrote the tutorial
+        authors: z.array(z.string()).optional(),
+        // Optional note explaining more context about the authors
+        authorsNote: z.string().optional(),
+        description: z.string().optional(),
+        category: z.enum(categories),
+        categoryIndex: z.number().optional(),
+        // Image to use as a thumbnail for the tutorial
+        featuredImage: image().optional(),
+        featuredImageAlt: z.string().optional(),
+        relatedContent: relatedContent().optional(),
+      })
+      .refine(
+        (data) => {
+          // Allow missing fields during development for quicker iteration
+          if (import.meta.env.DEV) return true;
+          return (
+            data.authors !== undefined &&
+            data.authors.length > 0 &&
+            data.featuredImage !== undefined &&
+            data.featuredImageAlt !== undefined &&
+            data.description !== undefined
+          );
+        },
+        {
+          message:
+            "Tutorials must include authors, featuredImage, featuredImageAlt, and description for production builds",
+        },
+      ),
 });
diff --git a/src/layouts/TutorialLayout.astro b/src/layouts/TutorialLayout.astro
@@ -59,8 +59,8 @@ const { showBanner, englishUrl } = checkTranslationBanner(
 <Head
   title={entry.data.title}
   locale={currentLocale}
-  description={entry.data.authors.join(", ")}
-  featuredImageSrc={entry.data.featuredImage.src}
+  description={entry.data.authors?.join(", ")}
+  featuredImageSrc={entry.data.featuredImage?.src}
 />
 
 <BaseLayout
