www-new/pages/events/[year]/[term]/index.tsx

import { ParsedUrlQuery } from "querystring";

import { GetStaticPaths, GetStaticProps } from "next";
import { MDXRemote } from "next-mdx-remote";
import React from "react";

import { EventCard } from "@/components/EventCard";
import { MiniEventCard } from "@/components/MiniEventCard";
import {
  getEventYears,
  getEventTermsByYear,
  getEventsByTerm,
  getEventBySlug,
  Event,
  TERMS,
} from "@/lib/events";

import styles from "./index.module.css";

interface Props {
  term: string;
  year: string;
  pastEvents: Event[];
  futureEvents: Event[];
  isCurrentTerm: boolean;
}

export default function Term(props: Props) {
  const hasPastEvents = props.pastEvents.length !== 0;
  const hasFutureEvents = props.futureEvents.length !== 0;

  return (
    <div className={styles.main}>
      {hasFutureEvents && (
        <>
          <h2>Upcoming Events</h2>
          <div className={styles.miniEventCards}>
            {props.futureEvents.map(({ content, metadata }) => (
              <EventCard
                {...metadata}
                date={new Date(metadata.date)}
                key={metadata.name + metadata.date.toString()}
              >
                <MDXRemote {...content} />
              </EventCard>
            ))}
          </div>
        </>
      )}
      {hasPastEvents && props.isCurrentTerm && <h2>Past Events</h2>}
      {hasPastEvents && !props.isCurrentTerm && (
        <h2>
          Events Archive:
          <span className={styles.blue}>
            {` ${props.term.charAt(0).toUpperCase()}${props.term.slice(1)} ${
              props.year
            }`}
          </span>
        </h2>
      )}
      <div className={styles.miniEventCards}>
        {props.pastEvents.map(({ content, metadata }) => (
          <MiniEventCard
            {...metadata}
            date={new Date(metadata.date)}
            description={<MDXRemote {...content} />}
            key={metadata.name + metadata.date.toString()}
          />
        ))}
      </div>
    </div>
  );
}

interface Params extends ParsedUrlQuery {
  year: string;
  term: string;
}

export const getStaticProps: GetStaticProps<Props, Params> = async (
  context
) => {
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
  const { year, term } = context.params!;

  return await getProps(year, term);
};

export const getStaticPaths: GetStaticPaths<Params> = async () => {
  const years = await getEventYears();
  const paths = (
    await Promise.all(
      years.map(async (year) => {
        const terms = await getEventTermsByYear(year);
        return terms.map((curTerm) => ({
          params: { year: year, term: curTerm },
        }));
      })
    )
  ).flat();

  return {
    paths: paths,
    fallback: false,
  };
};

export const getProps = async (
  year: string,
  term: string
): Promise<{ props: Props }> => {
  const eventNames = await getEventsByTerm(year, term);

  const events: Event[] = (
    await Promise.all(
      eventNames.map((file: string) => getEventBySlug(year, term, file))
    )
  ).sort(
    (a, b) =>
      new Date(a.metadata.date).getTime() - new Date(b.metadata.date).getTime()
  );

  const pastEvents = events
    .filter((event) => new Date(event.metadata.date).getTime() < Date.now())
    .reverse();

  const futureEvents = events.filter(
    (event) => new Date(event.metadata.date).getTime() >= Date.now()
  );

  const current = getCurrentTerm();

  // console.log(getPreviousTerm(term, year));
  // console.log(getNextTerm(term, year));

  return {
    props: {
      term: term,
      year: year,
      pastEvents: pastEvents,
      futureEvents: futureEvents,
      isCurrentTerm: term === current.term && year === current.year,
    },
  };
};

const getPreviousTerm = (
  year: string,
  term: string
): { year: string; term: string } => {
  const index = TERMS.indexOf(term);
  if (index === -1) {
    console.error("Not a valid term");
    return { year: "", term: "" };
  } else if (index === 0) {
    return {
      year: (parseInt(year) - 1).toString(),
      term: TERMS[TERMS.length - 1],
    };
  } else {
    return {
      year: year,
      term: TERMS[index - 1],
    };
  }
};

const getNextTerm = (
  year: string,
  term: string
): { year: string; term: string } => {
  const index = TERMS.indexOf(term);
  if (index === -1) {
    console.error("Not a valid term");
    return { year: "", term: "" };
  } else if (index === TERMS.length - 1) {
    return {
      year: (parseInt(year) + 1).toString(),
      term: TERMS[0],
    };
  } else {
    return {
      year: year,
      term: TERMS[index + 1],
    };
  }
};

export function getCurrentTerm() {
  const date = new Date();
  let term = "";
  const year = date.getUTCFullYear().toString();

  if (
    new Date(`${year}-01-01`).getTime() <= date.getTime() &&
    date.getTime() <= new Date(`${year}-04-30`).getTime()
  ) {
    term = "winter";
  } else if (
    new Date(`${year}-05-01`).getTime() <= date.getTime() &&
    date.getTime() <= new Date(`${year}-08-31`).getTime()
  ) {
    term = "spring";
  } else if (
    new Date(`${year}-09-01`).getTime() <= date.getTime() &&
    date.getTime() <= new Date(`${year}-12-31`).getTime()
  ) {
    term = "fall";
  }

  return { term, year };
}