Add news archive page

This commit is contained in:
Aditya Thakral 2021-08-10 17:08:29 -04:00
parent 6ad3a8fde4
commit 19617b8bad
2 changed files with 61 additions and 0 deletions

View File

@ -0,0 +1,12 @@
.page {
margin-bottom: calc(40rem / 16);
}
.list {
list-style: none;
padding: 0;
}
.list > li {
line-height: 3;
}

49
pages/news/archive.tsx Normal file
View File

@ -0,0 +1,49 @@
import { getNewsTermsByYear, getNewsYears } from "lib/news";
import { GetStaticProps } from "next";
import React from "react";
import { Link } from "@/components/Link";
import styles from "./archive.module.css";
interface Props {
items: {
year: string;
terms: string[];
}[];
}
export default function NewsArchive({ items }: Props) {
return (
<div className={styles.page}>
<h1>News Archive</h1>
<ul className={styles.list}>
{items.map(({ year, terms }) =>
terms.map((term) => (
<li key={`${year}-${term}`}>
<Link href={`/news/${year}/${term}`}>
{capitalize(term)} {year}
</Link>
</li>
))
)}
</ul>
</div>
);
}
export const getStaticProps: GetStaticProps<Props> = async () => {
const years = (await getNewsYears()).reverse();
const yearsWithTerms = await Promise.all(
years.map(async (year) => ({
year,
terms: (await getNewsTermsByYear(year)).reverse(),
}))
);
return { props: { items: yearsWithTerms } };
};
function capitalize(str: string) {
return str.slice(0, 1).toUpperCase() + str.slice(1);
}