Clean up props and add links based on PR comments
This commit is contained in:
parent
eaf90b794d
commit
5de5840d4b
|
@ -1,5 +1,3 @@
|
|||
import { ParsedUrlQuery } from "querystring";
|
||||
|
||||
import { GetStaticProps } from "next";
|
||||
import { MDXRemote } from "next-mdx-remote";
|
||||
import React from "react";
|
||||
|
@ -9,6 +7,7 @@ import { DefaultLayout } from "@/components/DefaultLayout";
|
|||
import { EmailSignup } from "@/components/EmailSignup";
|
||||
import { EventDescriptionCard } from "@/components/EventDescriptionCard";
|
||||
import { Image } from "@/components/Image";
|
||||
import { Link } from "@/components/Link";
|
||||
import { NewsCard } from "@/components/NewsCard";
|
||||
import { SocialLinks } from "@/components/SocialLinks";
|
||||
import { Event, getUpcomingEvents } from "@/lib/events";
|
||||
|
@ -17,8 +16,9 @@ import { News, getRecentNews } from "@/lib/news";
|
|||
import styles from "./index.module.css";
|
||||
|
||||
interface Props {
|
||||
events: Event[];
|
||||
news: News[];
|
||||
numberOfEvents: number; // total number of upcoming events
|
||||
events: Event[]; // array of 0 - 2 events
|
||||
news: News;
|
||||
}
|
||||
|
||||
export default function Home(props: Props) {
|
||||
|
@ -48,52 +48,58 @@ export default function Home(props: Props) {
|
|||
</DefaultLayout>
|
||||
<div className={styles.cardsBackground}>
|
||||
<div className={styles.cards}>
|
||||
{/* TODO: add links to past/upcoming events and past news */}
|
||||
<section className={styles.events}>
|
||||
<h1 className={styles.cardsHeading}>Upcoming Events</h1>
|
||||
<p className={styles.cardsDescription}>See past events here</p>
|
||||
<p className={styles.cardsDescription}>
|
||||
See past events{" "}
|
||||
<Link href="/events/archive">
|
||||
<a title="Events Archive">here</a>
|
||||
</Link>
|
||||
</p>
|
||||
<hr className={styles.cardsDividingLine} />
|
||||
{props.events.length == 0 ? (
|
||||
{props.numberOfEvents == 0 ? (
|
||||
<p>
|
||||
There are no upcoming events right now. Please check back later!
|
||||
</p>
|
||||
) : null}
|
||||
<div className={styles.eventCards}>
|
||||
{props.events.length > 0
|
||||
? props.events
|
||||
.slice(0, 2)
|
||||
.map((event) => (
|
||||
<EventDescriptionCard
|
||||
{...event.metadata}
|
||||
date={new Date(event.metadata.date)}
|
||||
key={
|
||||
event.metadata.name + event.metadata.date.toString()
|
||||
}
|
||||
/>
|
||||
))
|
||||
? props.events.map((event) => (
|
||||
<EventDescriptionCard
|
||||
{...event.metadata}
|
||||
date={new Date(event.metadata.date)}
|
||||
key={event.metadata.name + event.metadata.date.toString()}
|
||||
/>
|
||||
))
|
||||
: null}
|
||||
</div>
|
||||
{props.events.length > 2 ? (
|
||||
<p>See more upcoming events here</p>
|
||||
{props.numberOfEvents > 2 ? (
|
||||
<p>
|
||||
See more upcoming events{" "}
|
||||
<Link href="/events">
|
||||
<a title="Events">here</a>
|
||||
</Link>
|
||||
</p>
|
||||
) : null}
|
||||
</section>
|
||||
<section className={styles.news} id="news">
|
||||
<h1 className={styles.cardsHeading}>News</h1>
|
||||
<p className={styles.cardsDescription}>
|
||||
Updates from our execs! <br />
|
||||
See past news here
|
||||
See past news{" "}
|
||||
<Link href="/news/archive">
|
||||
<a title="News Archive">here</a>
|
||||
</Link>
|
||||
</p>
|
||||
<hr className={styles.cardsDividingLine} />
|
||||
{props.news.length > 0 ? (
|
||||
{
|
||||
<NewsCard
|
||||
{...props.news[0].metadata}
|
||||
date={new Date(props.news[0].metadata.date)}
|
||||
{...props.news.metadata}
|
||||
date={new Date(props.news.metadata.date)}
|
||||
>
|
||||
<MDXRemote {...props.news[0].content} />
|
||||
<MDXRemote {...props.news.content} />
|
||||
</NewsCard>
|
||||
) : (
|
||||
<p>There is no news right now. Please check back later!</p>
|
||||
)}
|
||||
}
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -109,10 +115,14 @@ Home.Layout = function HomeLayout(props: { children: React.ReactNode }) {
|
|||
return <div className={styles.page}>{props.children}</div>;
|
||||
};
|
||||
|
||||
type Params = ParsedUrlQuery;
|
||||
|
||||
export const getStaticProps: GetStaticProps<Props, Params> = async () => {
|
||||
const events = await getUpcomingEvents();
|
||||
const news = await getRecentNews();
|
||||
return { props: { events, news } };
|
||||
export const getStaticProps: GetStaticProps<Props> = async () => {
|
||||
const upcomingEvents = await getUpcomingEvents();
|
||||
const recentNews = await getRecentNews();
|
||||
return {
|
||||
props: {
|
||||
numberOfEvents: upcomingEvents.length,
|
||||
events: upcomingEvents.slice(0, 2),
|
||||
news: recentNews[0],
|
||||
},
|
||||
};
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue