mirror of
https://github.com/fergalmoran/supanextail.git
synced 2025-12-22 09:17:54 +00:00
a85e672f9f
- Improved the blog posts - Add a test to visit the blog index - Add Tailwind Typography for the markdown blog posts
69 lines
1.6 KiB
TypeScript
69 lines
1.6 KiB
TypeScript
import Container from 'components/blog/container';
|
|
import { GetStaticPropsResult } from 'next/types';
|
|
import Head from 'next/head';
|
|
import HeroPost from 'components/blog/hero-post';
|
|
import Layout from 'components/Layout';
|
|
import MoreStories from 'components/blog/more-stories';
|
|
import Post from '../types/post';
|
|
import SectionSeparator from 'components/blog/section-separator';
|
|
import { getAllPosts } from '../lib/blogApi';
|
|
|
|
type Properties = {
|
|
allPosts: Post[];
|
|
};
|
|
type Items = {
|
|
[key: string]: string;
|
|
};
|
|
|
|
const Blog = ({ allPosts }: Properties): JSX.Element => {
|
|
const heroPost = allPosts[0];
|
|
const morePosts = allPosts.slice(1);
|
|
return (
|
|
<Layout>
|
|
<>
|
|
<Head>
|
|
<title>{`${
|
|
process.env.NEXT_PUBLIC_TITLE ? process.env.NEXT_PUBLIC_TITLE : ''
|
|
} | Blog`}</title>
|
|
</Head>
|
|
<Container>
|
|
{heroPost && (
|
|
<HeroPost
|
|
title={heroPost.title}
|
|
coverImage={heroPost.coverImage}
|
|
date={heroPost.date}
|
|
author={heroPost.author}
|
|
slug={heroPost.slug}
|
|
excerpt={heroPost.excerpt}
|
|
/>
|
|
)}
|
|
<SectionSeparator />
|
|
{morePosts.length > 0 && <MoreStories posts={morePosts} />}
|
|
</Container>
|
|
</>
|
|
</Layout>
|
|
);
|
|
};
|
|
|
|
export default Blog;
|
|
|
|
type Parameters_ = {
|
|
allPosts: Items[];
|
|
};
|
|
|
|
// eslint-disable-next-line unicorn/prevent-abbreviations
|
|
export const getStaticProps = (): GetStaticPropsResult<Parameters_> => {
|
|
const allPosts = getAllPosts([
|
|
'title',
|
|
'date',
|
|
'slug',
|
|
'author',
|
|
'coverImage',
|
|
'excerpt',
|
|
]);
|
|
|
|
return {
|
|
props: { allPosts },
|
|
};
|
|
};
|