purserj/angrybeanie-front-end
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity Actions

Replaced Current and Archived podcast pages with Podcast page

Browse source 
Fixed logo fetch issue for Podcast Page
This commit is contained in:
James Purser 2021-09-30 21:10:11 +10:00
parent e0fe4a08f8
commit 1ab30f580c
3 changed files with 41 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
components/css/styles.css
View file

@ -265,5 +265,10 @@
} }
h1 { h1 {
font-size: 4rem font-size: 3rem;
}
h2 {
font-size: 2rem;
font-weight: bold;
} }

2
pages/index.js
View file

@ -59,7 +59,7 @@ function HomePage (props) {
))} ))}
<div className="card col-sm-3"> <div className="card col-sm-3">
<h3>Latest Tech And Disability Post</h3> <h3>Latest Tech And Disability Post</h3>
{props.tadfirstitem.title} <a href={props.tadfirstitem.link} target="_blank">{props.tadfirstitem.title}</a>
</div> </div>
<div className="card col-sm-3"> <div className="card col-sm-3">
<h3>Latest Photo</h3> <h3>Latest Photo</h3>

38
pages/podcasts.js
View file

@ -9,20 +9,48 @@ export async function getServerSideProps(context) {
const secres = await fetch(serverRuntimeConfig.base_path + `/api/sections`) const secres = await fetch(serverRuntimeConfig.base_path + `/api/sections`)
const secdata = await secres.json() const secdata = await secres.json()
const podcastres = await fetch(serverRuntimeConfig.base_path + `/api/podcasts/bystatus/1`) const currpodcastres = await fetch(serverRuntimeConfig.base_path + `/api/podcasts/bystatus/1`)
const podcastdata = await podcastres.json() const currpodcastdata = await currpodcastres.json()
const archpodcastres = await fetch(serverRuntimeConfig.base_path + `/api/podcasts/bystatus/0`)
const archpodcastdata = await archpodcastres.json()
const episodedata = "hi there" const episodedata = "hi there"
const pagedata = {'title': 'Angry Beanie - Current Podcast Projects'} const pagedata = {'title': 'Angry Beanie - Current Podcast Projects'}
return { return {
props: { sections : secdata, podcastdata, episodedata, pagedata }, // will be passed to the page component as props props: { sections : secdata, currpodcastdata, archpodcastdata, episodedata, pagedata, serverRuntimeConfig }, // will be passed to the page component as props
} }
} }
const Podcasts = ({sections, podcastdata, episodedata, pagedata}) => ( const Podcasts = ({sections, currpodcastdata, archpodcastdata, episodedata, pagedata, serverRuntimeConfig}) => (
<Layout sections={sections} episodedata={episodedata} pagedata={pagedata}></Layout> <Layout sections={sections} episodedata={episodedata} pagedata={pagedata} serverRuntimeConfig>
<h1>Podcasts</h1>
<div className="page_body">Over the years I have made a number of podcasts.</div>
<div className="row">
<div className="col-sm-6">
<h2>Current Podcasts</h2>
{currpodcastdata.shows.map((podcast) => (
<div><Image
src={serverRuntimeConfig.base_path + "/" + podcast.logo.src}
height={podcast.logo.height}
width={podcast.logo.width}
></Image><Link href={"/podcasts/shows/" + podcast.slug}>{podcast.title}</Link></div>
))}
</div>
<div className="col-sm-6">
<h2>Archived Podcasts</h2>
{archpodcastdata.shows.map((podcast) => (
<div><Image
src={serverRuntimeConfig.base_path + "/" + podcast.logo.src}
height={podcast.logo.height}
width={podcast.logo.width}
></Image><Link href={"/podcasts/shows/" + podcast.slug}>{podcast.title}</Link></div>
))}
</div>
</div>
</Layout>
) )
export default Podcasts export default Podcasts