From 4a13a87a5143f75e897f72af3b7173c072d275d6 Mon Sep 17 00:00:00 2001
From: James Purser <james@angrybeanie.com>
Date: Mon, 27 Jun 2022 11:31:19 +1000
Subject: [PATCH] Added image support to featured article on homepage

---
 pages/index.js | 20 +++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/pages/index.js b/pages/index.js
index 2070061..fe9fb83 100755
--- a/pages/index.js
+++ b/pages/index.js
@@ -22,8 +22,10 @@ export async function getStaticProps(context) {
       pagination: {
           limit: 1
       },
+      populate: {
+        FeatureImage: '*'
+      },
       sort: ['publishedAt:desc'],
-      fields: ['Title', 'Slug', 'Abstract']
   }, {
       encodeValuesOnly: true,
   })
@@ -37,9 +39,9 @@ export async function getStaticProps(context) {
   const artdata = await res.json()
 
   const article = artdata.data[0].attributes
+  console.log(article)
 
   const epdata = await getLatestPodcastEpisode()
-  console.log(epdata.Logo.data.attributes)
 
   const flickr = await fetch('https://www.flickr.com/services/feeds/photos_public.gne?id=25875680@N05&lang=en-us&format=json&nojsoncallback=1')
   const flickrdata = await flickr.json()
@@ -70,8 +72,16 @@ function HomePage (props) {
           <div className="row">
           <div className="col-sm-4">
             <div className="card">
-              <div className="card-img-top">
-
+            <div className="card-img-top">
+                {/* <img src={props.episodedata.Logo.data.attributes.url} alt={episode.show} height={props.episodedata.Logo.data.attributes.height}></img> */}
+                <Image 
+                src={props.article.FeatureImage.data.attributes.formats.thumbnail.url}
+                alt={props.article.Title}
+                layout="fixed"
+                height={props.article.FeatureImage.data.attributes.formats.thumbnail.height}
+                width={props.article.FeatureImage.data.attributes.formats.thumbnail.width}
+                className="card-img-top"
+                ></Image> 
               </div>
               <div className="card-title">
                 <h3>Latest Blog Post</h3>
@@ -88,7 +98,7 @@ function HomePage (props) {
               <div className="card-img-top">
                 {/* <img src={props.episodedata.Logo.data.attributes.url} alt={episode.show} height={props.episodedata.Logo.data.attributes.height}></img> */}
                 <Image 
-                src={props.siteConfig.siteURL + props.episodedata.Logo.data.attributes.formats.thumbnail.url}
+                src={props.episodedata.Logo.data.attributes.formats.thumbnail.url}
                 alt={episode.show}
                 layout="fixed"
                 height={props.episodedata.Logo.data.attributes.formats.thumbnail.height}