From 544b4c4ae00d1e8286bf1703945900584134e398 Mon Sep 17 00:00:00 2001
From: Daniel LaForce <daniel@argobox.com>
Date: Wed, 23 Apr 2025 14:56:51 -0600
Subject: [PATCH] fix: Add safe date handling and content rendering to dynamic
 routes

---
 src/pages/blog/[slug].astro           | 20 +++++++++++++++++++-
 src/pages/configurations/[slug].astro | 26 +++++++++++++++++++++++---
 src/pages/projects/[slug].astro       | 26 +++++++++++++++++++++++---
 3 files changed, 65 insertions(+), 7 deletions(-)

diff --git a/src/pages/blog/[slug].astro b/src/pages/blog/[slug].astro
index 3ade70d..74b48bb 100644
--- a/src/pages/blog/[slug].astro
+++ b/src/pages/blog/[slug].astro
@@ -48,6 +48,24 @@ const formatDate = (date) => {
   });
 };
 
+// Generate datetime attribute safely
+const getISODate = (date) => {
+  if (!date) return '';
+  // Handle various date formats
+  try {
+    // If already a Date object
+    if (date instanceof Date) {
+      return date.toISOString();
+    }
+    // If it's a string or number, convert to Date
+    return new Date(date).toISOString();
+  } catch (error) {
+    // Fallback if date is invalid
+    console.error('Invalid date format:', date);
+    return '';
+  }
+};
+
 // Get the Content component for rendering markdown
 const { Content } = await post.render();
 ---
@@ -57,7 +75,7 @@ const { Content } = await post.render();
     <header class="post-header">
       <h1>{post.data.title}</h1>
       <div class="post-meta">
-        {post.data.pubDate && <time datetime={post.data.pubDate.toISOString()}>{formatDate(post.data.pubDate)}</time>}
+        {post.data.pubDate && <time datetime={getISODate(post.data.pubDate)}>{formatDate(post.data.pubDate)}</time>}
         {post.data.updatedDate && <div class="updated-date">Updated: {formatDate(post.data.updatedDate)}</div>}
         {post.data.readTime && <div class="read-time">{post.data.readTime} read</div>}
         {post.data.author && <div class="author">By {post.data.author}</div>}
diff --git a/src/pages/configurations/[slug].astro b/src/pages/configurations/[slug].astro
index f958fbd..78aa7e8 100644
--- a/src/pages/configurations/[slug].astro
+++ b/src/pages/configurations/[slug].astro
@@ -35,20 +35,40 @@ const formatDate = (date) => {
     day: 'numeric'
   });
 };
+
+// Generate datetime attribute safely
+const getISODate = (date) => {
+  if (!date) return '';
+  // Handle various date formats
+  try {
+    // If already a Date object
+    if (date instanceof Date) {
+      return date.toISOString();
+    }
+    // If it's a string or number, convert to Date
+    return new Date(date).toISOString();
+  } catch (error) {
+    // Fallback if date is invalid
+    console.error('Invalid date format:', date);
+    return '';
+  }
+};
+
+// Get the Content component for rendering markdown
+const { Content } = await entry.render();
 ---
 
 <BaseLayout title={entry.data.title} description={entry.data.description || ''}>
   <article class="container configuration-detail">
     <header class="configuration-header">
       <h1>{entry.data.title}</h1>
-      {entry.data.pubDate && <time datetime={entry.data.pubDate.toISOString()}>{formatDate(entry.data.pubDate)}</time>}
+      {entry.data.pubDate && <time datetime={getISODate(entry.data.pubDate)}>{formatDate(entry.data.pubDate)}</time>}
       {entry.data.updatedDate && <div class="updated-date">Updated: {formatDate(entry.data.updatedDate)}</div>}
     </header>
     
     <div class="configuration-content">
       <div class="configuration-body">
-        <!-- Render the content using the Content component -->
-        <slot />
+        <Content />
       </div>
       
       <aside class="configuration-sidebar">
diff --git a/src/pages/projects/[slug].astro b/src/pages/projects/[slug].astro
index 0e8944a..dc15838 100644
--- a/src/pages/projects/[slug].astro
+++ b/src/pages/projects/[slug].astro
@@ -35,20 +35,40 @@ const formatDate = (date) => {
     day: 'numeric'
   });
 };
+
+// Generate datetime attribute safely
+const getISODate = (date) => {
+  if (!date) return '';
+  // Handle various date formats
+  try {
+    // If already a Date object
+    if (date instanceof Date) {
+      return date.toISOString();
+    }
+    // If it's a string or number, convert to Date
+    return new Date(date).toISOString();
+  } catch (error) {
+    // Fallback if date is invalid
+    console.error('Invalid date format:', date);
+    return '';
+  }
+};
+
+// Get the Content component for rendering markdown
+const { Content } = await entry.render();
 ---
 
 <BaseLayout title={entry.data.title} description={entry.data.description || ''}>
   <article class="container project-detail">
     <header class="project-header">
       <h1>{entry.data.title}</h1>
-      {entry.data.pubDate && <time datetime={entry.data.pubDate.toISOString()}>{formatDate(entry.data.pubDate)}</time>}
+      {entry.data.pubDate && <time datetime={getISODate(entry.data.pubDate)}>{formatDate(entry.data.pubDate)}</time>}
       {entry.data.updatedDate && <div class="updated-date">Updated: {formatDate(entry.data.updatedDate)}</div>}
     </header>
     
     <div class="project-content">
       <div class="project-body">
-        <!-- Render the content using the Content component -->
-        <slot />
+        <Content />
       </div>
       
       <aside class="project-sidebar">