Replaced old index page with a new one that shows the latest blog post
Added new 404 and 500 pages
This commit is contained in:
parent
c05a87b1ba
commit
4fb6be928c
1 changed files with 42 additions and 82 deletions
122
pages/index.js
122
pages/index.js
|
|
@ -1,14 +1,13 @@
|
||||||
import Layout from "../components/main"
|
import Layout from "../components/main"
|
||||||
import LatestEpisodes from "../components/latestepisodes"
|
import FeatureImage from "../components/featureimage"
|
||||||
import Link from 'next/link'
|
import PublishedInfo from '../components/publishedinfo.js'
|
||||||
import getConfig from 'next/config'
|
import getConfig from 'next/config'
|
||||||
import Head from 'next/head'
|
import Head from 'next/head'
|
||||||
import Image from 'next/image';
|
|
||||||
import config from '../data/internal/config';
|
import config from '../data/internal/config';
|
||||||
import { FEEDS, getFeed } from "../lib/rss"
|
import { FEEDS, getFeed } from "../lib/rss"
|
||||||
import { generatePodcastFeeds, generateRssFeed } from "../data/internal/feed-generator"
|
import { generatePodcastFeeds, generateRssFeed } from "../data/internal/feed-generator"
|
||||||
import { generateSitemap } from "../data/internal/sitemap-generator"
|
import { generateSitemap } from "../data/internal/sitemap-generator"
|
||||||
import { getLatestPodcastEpisode } from "../data/external/cms"
|
import { getLatestContent, getLatestPodcastEpisode } from "../data/external/cms"
|
||||||
import { getLatestGalleryImage } from "../data/external/cms"
|
import { getLatestGalleryImage } from "../data/external/cms"
|
||||||
|
|
||||||
export async function getStaticProps(context) {
|
export async function getStaticProps(context) {
|
||||||
|
|
@ -18,6 +17,8 @@ export async function getStaticProps(context) {
|
||||||
generateSitemap()
|
generateSitemap()
|
||||||
const { serverRuntimeConfig } = getConfig()
|
const { serverRuntimeConfig } = getConfig()
|
||||||
|
|
||||||
|
console.log(serverRuntimeConfig)
|
||||||
|
|
||||||
const qs = require('qs')
|
const qs = require('qs')
|
||||||
const query = qs.stringify({
|
const query = qs.stringify({
|
||||||
pagination: {
|
pagination: {
|
||||||
|
|
@ -47,6 +48,10 @@ export async function getStaticProps(context) {
|
||||||
|
|
||||||
const pagedata = {'title': 'Angry Beanie'}
|
const pagedata = {'title': 'Angry Beanie'}
|
||||||
|
|
||||||
|
const combined = getLatestContent()
|
||||||
|
|
||||||
|
console.log(combined)
|
||||||
|
|
||||||
return {
|
return {
|
||||||
props: { article, pagedata, config: serverRuntimeConfig, firstimage, episodedata: epdata, siteConfig: config},
|
props: { article, pagedata, config: serverRuntimeConfig, firstimage, episodedata: epdata, siteConfig: config},
|
||||||
revalidate: 60 // will be passed to the page component as props
|
revalidate: 60 // will be passed to the page component as props
|
||||||
|
|
@ -54,85 +59,40 @@ export async function getStaticProps(context) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function HomePage (props) {
|
function HomePage (props) {
|
||||||
return (
|
var featureImage
|
||||||
<div>
|
|
||||||
<Head>
|
|
||||||
<title>{props.pagedata.title}</title>
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"></meta>
|
|
||||||
<meta name="description" content="Angry Beanie"></meta>
|
|
||||||
<meta charSet="utf-8" />
|
|
||||||
<meta property="og-title" content="Angry Beanie - Home"></meta>
|
|
||||||
</Head>
|
|
||||||
<div className="container">
|
|
||||||
<div className="frontPageImage">
|
|
||||||
<img className="header_image img-fluid" src="/images/logo.png" alt="Angry Beanie" />
|
|
||||||
</div>
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-sm-4">
|
|
||||||
<div className="card">
|
|
||||||
<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.config.media_path + 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>
|
|
||||||
</div>
|
|
||||||
<div className="card-body">
|
|
||||||
<Link href="/news/[slug]" as={"/news/" + props.article.Slug}>{props.article.Title}</Link>
|
|
||||||
<div dangerouslySetInnerHTML={{ __html:props.article.Abstract}}></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{props.episodedata.data.map((episode) => (
|
|
||||||
<div className="col-sm-4">
|
|
||||||
<div className="card">
|
|
||||||
<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.config.media_path + props.episodedata.Logo.data.attributes.formats.thumbnail.url}
|
|
||||||
alt={episode.show}
|
|
||||||
layout="fixed"
|
|
||||||
height={props.episodedata.Logo.data.attributes.formats.thumbnail.height}
|
|
||||||
width={props.episodedata.Logo.data.attributes.formats.thumbnail.width}
|
|
||||||
className="card-img-top"
|
|
||||||
></Image>
|
|
||||||
</div>
|
|
||||||
<div className="card-title">
|
|
||||||
<h3>Latest Podcast</h3>
|
|
||||||
</div>
|
|
||||||
<div className="card-body">
|
|
||||||
<Link href={"/podcasts/shows/" + props.episodedata.data[0].attributes.podcast_sery.Slug + "/" + props.episodedata.data[0].attributes.Slug}>{props.episodedata.data[0].attributes.Title}</Link>
|
|
||||||
<div dangerouslySetInnerHTML={{ __html: episode.episode_lead}}></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
<div className="col-sm-4">
|
|
||||||
<div className="card">
|
|
||||||
<div className="card-img-top">
|
|
||||||
<a href={"/galleryimages/" + props.firstimage.data[0].attributes.Slug}>
|
|
||||||
<img className="featuredFlickr" src={ props.config.media_path + props.firstimage.data[0].attributes.Image.data.attributes.formats.thumbnail.url }></img>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div className="card-title">
|
|
||||||
<h3>Latest Photo</h3>
|
|
||||||
</div>
|
|
||||||
<div className="card-body">
|
|
||||||
|
|
||||||
|
if (props.article.FeatureImage.data) {
|
||||||
|
if (props.article.FeatureImage.data.attributes.formats.large) {
|
||||||
|
featureImage = props.article.FeatureImage.data.attributes.formats.large
|
||||||
|
featureImage.name = props.article.FeatureImage.data.attributes.alternativeText
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
var article_desc = props.article.Abstract.replace(new RegExp('<[^>]*>', 'g'), '')
|
||||||
|
|
||||||
|
console.log(props.serverRuntimeConfig)
|
||||||
|
|
||||||
|
return <Layout pagedata={props.pagedata}>
|
||||||
|
<Head>
|
||||||
|
<meta name="twitter:card" content={ article_desc } key="twcard" />
|
||||||
|
<meta name="twitter:creator" content="angrybeanie" key="twhandle" />
|
||||||
|
<meta name="og:url" content={config.siteURL + "/news/" + props.article.Slug}></meta>
|
||||||
|
<meta name="og:type" content="article"></meta>
|
||||||
|
<meta name="og:title" content={ props.article.Title } key="title"></meta>
|
||||||
|
<meta name="og:description" content={ article_desc } key="description"></meta>
|
||||||
|
{ props.article.FeatureImage.data != null &&
|
||||||
|
<meta name="og:image" content={props.config.media_path + featureImage.url}></meta>
|
||||||
|
}
|
||||||
|
</Head>
|
||||||
|
<div className="main_content col-md-9 col-sm-12">
|
||||||
|
{ props.article.FeatureImage.data != null &&
|
||||||
|
<FeatureImage imagedata = {featureImage} basepath = {props.config.media_path} ></FeatureImage>
|
||||||
|
}
|
||||||
|
<h1 className="page_title col-sm-12">{ props.article.Title }</h1>
|
||||||
|
<PublishedInfo publishData={props.article}></PublishedInfo>
|
||||||
|
<div className="article_body" dangerouslySetInnerHTML={{ __html: props.article.Body }}></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</Layout>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default HomePage
|
export default HomePage
|
||||||
Loading…
Reference in a new issue