fix: handle case where main image is missing (#12)

gathering · Sep 23, 2024 · 9cd0915 · 9cd0915
1 parent 8d0b2c1
commit 9cd0915
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 6 deletions.
diff --git a/src/components/NewsComp.astro b/src/components/NewsComp.astro
@@ -15,7 +15,7 @@ interface Article {
     name: string;
     slug: string;
   }>;
-  main_image: {
+  main_image?: {
     url: string;
     full_url: string;
     width: number;
@@ -75,11 +75,11 @@ const articles = await fetchArticles();
                 )}
               </time>
             </div>
-            <img
+            {article.main_image && <img
               src={article.main_image.full_url}
               alt={article.main_image.alt}
               class="w-24 h-24 object-cover ml-2 rounded-lg"
-            />
+              />}
           </article>
         </a>
       ))

diff --git a/src/pages/news/[slug].astro b/src/pages/news/[slug].astro
@@ -84,12 +84,12 @@ const article = await fetchArticleById(articleId);
       {new Date(article.meta.first_published_at).toLocaleDateString()}
     </time>
     <!-- Main Image -->
-    <img
+    {article.main_image && <img
       src={article.main_image.full_url}
       alt={article.main_image.alt}
       class="w-auto h-auto mb-4"
-    />
+      />}
     <!-- Article Content -->
     <div class="text-white" set:html={article.body}></div>
   </Main>
-</Layout>
+</Layout>