Add /events/[year] page (#151)

Closes #112

Co-authored-by: Jared He <66887902+jaredjhe@users.noreply.github.com>
Reviewed-on: www/www-new#151
Reviewed-by: Aditya Thakral <a3thakra@csclub.uwaterloo.ca>
Co-authored-by: j285he <j285he@localhost>
Co-committed-by: j285he <j285he@localhost>
fix-md-font
Jared He 1 year ago
parent 5933dd03b8
commit 656524eee7
  1. 21
      pages/events/[year]/index.module.css
  2. 61
      pages/events/[year]/index.tsx

@ -0,0 +1,21 @@
.main {
margin-top: calc(60rem / 16);
}
.main > h2 {
padding-bottom: calc(1rem / 16);
border-bottom: 1px solid var(--primary-heading);
}
.blue {
color: var(--primary-accent);
}
.list {
list-style: none;
padding: 0;
}
.list > li {
line-height: 3;
}

@ -0,0 +1,61 @@
import { ParsedUrlQuery } from "querystring";
import { GetStaticPaths, GetStaticProps } from "next";
import React from "react";
import { Link } from "@/components/Link";
import { getEventYears, getEventTermsByYear } from "@/lib/events";
import styles from "./index.module.css";
interface Props {
year: string;
terms: string[];
}
export default function Year(props: Props) {
return (
<div className={styles.main}>
<h2>
Events Archive:<span className={styles.blue}>{` ${props.year}`}</span>
</h2>
<ul className={styles.list}>
{props.terms.map((term) => (
<li key={`${props.year}-${term}`}>
<Link href={`/events/${props.year}/${term}`}>
{`${term.charAt(0).toUpperCase()}${term.slice(1)}`}
</Link>
</li>
))}
</ul>
</div>
);
}
interface Params extends ParsedUrlQuery {
year: string;
}
export const getStaticProps: GetStaticProps<Props, Params> = async (
context
) => {
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
const { year } = context.params!;
return {
props: {
year: year,
terms: await getEventTermsByYear(year),
},
};
};
export const getStaticPaths: GetStaticPaths<Params> = async () => {
const years = await getEventYears();
const paths = years.map((curYear) => ({
params: { year: curYear },
}));
return {
paths: paths,
fallback: false,
};
};
Loading…
Cancel
Save