Add events archive #187
|
@ -2,6 +2,11 @@
|
||||||
margin-bottom: calc(40rem / 16);
|
margin-bottom: calc(40rem / 16);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.page > h1 {
|
||||||
|
border-bottom: calc(1rem / 16) solid var(--primary-heading);
|
||||||
|
padding-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
.list {
|
.list {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
padding: 0;
|
padding: 0;
|
|
@ -0,0 +1,44 @@
|
||||||
|
import React from "react";
|
||||||
|
|
||||||
|
import { Link } from "@/components/Link";
|
||||||
|
import {
|
||||||
|
ShapesConfig,
|
||||||
|
GetShapesConfig,
|
||||||
|
defaultGetShapesConfig,
|
||||||
|
} from "@/components/ShapesBackground";
|
||||||
|
import { capitalize } from "@/utils";
|
||||||
|
|
||||||
|
import styles from "./ArchivePage.module.css";
|
||||||
|
|
||||||
|
export interface Props {
|
||||||
|
type: "news" | "events";
|
||||||
|
items: {
|
||||||
|
year: string;
|
||||||
|
terms: string[];
|
||||||
|
}[];
|
||||||
|
}
|
||||||
|
|
||||||
|
export function ArchivePage({ items, type }: Props) {
|
||||||
|
return (
|
||||||
|
<div className={styles.page}>
|
||||||
|
<h1>{capitalize(type)} Archive</h1>
|
||||||
|
<ul className={styles.list}>
|
||||||
|
{items.map(({ year, terms }) =>
|
||||||
|
terms.map((term) => (
|
||||||
|
<li key={`/${type}/${year}/${term}`}>
|
||||||
|
<Link href={`/${type}/${year}/${term}`}>
|
||||||
|
{capitalize(term)} {year}
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
))
|
||||||
|
)}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
ArchivePage.getShapesConfig = ((width, height) => {
|
||||||
|
return window.innerWidth <= 768
|
||||||
|
? ({} as ShapesConfig)
|
||||||
|
: defaultGetShapesConfig(width, height);
|
||||||
|
}) as GetShapesConfig;
|
|
@ -13,6 +13,7 @@ import {
|
||||||
getEventYears,
|
getEventYears,
|
||||||
getEventTermsByYear,
|
getEventTermsByYear,
|
||||||
} from "@/lib/events";
|
} from "@/lib/events";
|
||||||
|
import { capitalize } from "@/utils";
|
||||||
|
|
||||||
import styles from "./index.module.css";
|
import styles from "./index.module.css";
|
||||||
|
|
||||||
|
@ -154,7 +155,3 @@ export const getStaticPaths: GetStaticPaths<Params> = async () => {
|
||||||
fallback: false,
|
fallback: false,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
function capitalize(str: string) {
|
|
||||||
return str.slice(0, 1).toUpperCase() + str.slice(1);
|
|
||||||
}
|
|
||||||
|
|
|
@ -0,0 +1,18 @@
|
||||||
|
import { GetStaticProps } from "next";
|
||||||
|
|
||||||
|
import { ArchivePage, Props } from "@/components/ArchivePage";
|
||||||
|
import { getEventTermsByYear, getEventYears } from "@/lib/events";
|
||||||
|
|
||||||
|
export default ArchivePage;
|
||||||
|
|
||||||
|
export const getStaticProps: GetStaticProps<Props> = async () => {
|
||||||
|
const years = (await getEventYears()).reverse();
|
||||||
|
const yearsWithTerms = await Promise.all(
|
||||||
|
years.map(async (year) => ({
|
||||||
|
year,
|
||||||
|
terms: (await getEventTermsByYear(year)).reverse(),
|
||||||
|
}))
|
||||||
|
);
|
||||||
|
|
||||||
|
return { props: { items: yearsWithTerms, type: "events" } };
|
||||||
|
};
|
|
@ -17,6 +17,7 @@ import {
|
||||||
getNewsYears,
|
getNewsYears,
|
||||||
News,
|
News,
|
||||||
} from "@/lib/news";
|
} from "@/lib/news";
|
||||||
|
import { capitalize } from "@/utils";
|
||||||
|
|
||||||
import styles from "./[term].module.css";
|
import styles from "./[term].module.css";
|
||||||
|
|
||||||
|
@ -89,7 +90,3 @@ export const getStaticPaths: GetStaticPaths<Params> = async () => {
|
||||||
fallback: false,
|
fallback: false,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
function capitalize(str: string) {
|
|
||||||
return str.slice(0, 1).toUpperCase() + str.slice(1);
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,47 +1,9 @@
|
||||||
import { getNewsTermsByYear, getNewsYears } from "lib/news";
|
|
||||||
import { GetStaticProps } from "next";
|
import { GetStaticProps } from "next";
|
||||||
import React from "react";
|
|
||||||
|
|
||||||
import { Link } from "@/components/Link";
|
import { ArchivePage, Props } from "@/components/ArchivePage";
|
||||||
import {
|
import { getNewsTermsByYear, getNewsYears } from "@/lib/news";
|
||||||
ShapesConfig,
|
|
||||||
GetShapesConfig,
|
|
||||||
defaultGetShapesConfig,
|
|
||||||
} from "@/components/ShapesBackground";
|
|
||||||
|
|
||||||
import styles from "./archive.module.css";
|
export default ArchivePage;
|
||||||
|
|
||||||
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>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
NewsArchive.getShapesConfig = ((width, height) => {
|
|
||||||
return window.innerWidth <= 768
|
|
||||||
? ({} as ShapesConfig)
|
|
||||||
: defaultGetShapesConfig(width, height);
|
|
||||||
}) as GetShapesConfig;
|
|
||||||
|
|
||||||
export const getStaticProps: GetStaticProps<Props> = async () => {
|
export const getStaticProps: GetStaticProps<Props> = async () => {
|
||||||
const years = (await getNewsYears()).reverse();
|
const years = (await getNewsYears()).reverse();
|
||||||
|
@ -52,9 +14,5 @@ export const getStaticProps: GetStaticProps<Props> = async () => {
|
||||||
}))
|
}))
|
||||||
);
|
);
|
||||||
|
|
||||||
return { props: { items: yearsWithTerms } };
|
return { props: { items: yearsWithTerms, type: "news" } };
|
||||||
};
|
};
|
||||||
|
|
||||||
function capitalize(str: string) {
|
|
||||||
return str.slice(0, 1).toUpperCase() + str.slice(1);
|
|
||||||
}
|
|
||||||
|
|
|
@ -23,7 +23,8 @@
|
||||||
"paths": {
|
"paths": {
|
||||||
"@/components/*": ["components/*"],
|
"@/components/*": ["components/*"],
|
||||||
"@/lib/*": ["lib/*"],
|
"@/lib/*": ["lib/*"],
|
||||||
"@/hooks/*": ["hooks/*"]
|
"@/hooks/*": ["hooks/*"],
|
||||||
|
"@/utils": ["utils"]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"include": ["next-env.d.ts", "types.d.ts", "**/*.ts", "**/*.tsx"],
|
"include": ["next-env.d.ts", "types.d.ts", "**/*.ts", "**/*.tsx"],
|
||||||
|
|
Loading…
Reference in New Issue