Add news archive page
This commit is contained in:
parent
6ad3a8fde4
commit
19617b8bad
|
@ -0,0 +1,12 @@
|
|||
.page {
|
||||
margin-bottom: calc(40rem / 16);
|
||||
}
|
||||
|
||||
.list {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.list > li {
|
||||
line-height: 3;
|
||||
}
|
|
@ -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);
|
||||
}
|
Loading…
Reference in New Issue