diff --git a/components/Navbar.tsx b/components/Navbar.tsx index ab3e1c1d..73f13bcc 100644 --- a/components/Navbar.tsx +++ b/components/Navbar.tsx @@ -9,16 +9,15 @@ import styles from "./Navbar.module.css"; type Menu = { name: string; route: string; - submenu?: { - name: string; - route: string; - }[]; + exact?: boolean; + submenu?: Menu; }[]; const menu: Menu = [ { name: "Home", route: "/", + exact: true, }, { name: "About", @@ -27,6 +26,7 @@ const menu: Menu = [ { name: "About Us", route: "/about", + exact: true, }, { name: "Meet the Team", @@ -76,7 +76,21 @@ const menu: Menu = [ }, { name: "Advice", - route: "/resources/advice/coop", + route: "/resources/advice/co-op", + submenu: [ + { + name: "Co-op Advice", + route: "/resources/advice/co-op", + }, + { + name: "Academic Advice", + route: "/resources/advice/academic", + }, + { + name: "Additional Resources", + route: "/resources/advice/misc", + }, + ], }, { name: "Internships", @@ -198,10 +212,11 @@ interface NavItemProps { function NavItem(props: NavItemProps) { const router = useRouter(); - const isCurrentPage = - router.pathname === props.route || - (props.submenu != null && - router.pathname.startsWith(getMainRoute(props.route))); + const isCurrentPage = shouldHighlight( + router.pathname, + props.name, + props.route + ); const isExternalLink = props.route.includes("http://") || props.route.includes("https://"); @@ -273,6 +288,54 @@ function NavItem(props: NavItemProps) { ); } +interface Leaf { + name: string; + route: string; + exact?: boolean; + ancestors: { name: string; route: string }[]; +} + +function collectLeaves( + accumulator: Leaf[], + entry: { + name: string; + route: string; + exact?: boolean; + submenu?: Menu; + } +): Leaf[] { + if (entry.submenu == null) { + return [...accumulator, { ...entry, ancestors: [] }]; + } + + const subleaves = entry.submenu.reduce(collectLeaves, [] as Leaf[]); + return [ + ...accumulator, + ...subleaves.map((leaf) => ({ + ...leaf, + ancestors: [...leaf.ancestors, { name: entry.name, route: entry.route }], + })), + ]; +} + +const leaves: Leaf[] = menu.reduce(collectLeaves, [] as Leaf[]); + +function shouldHighlight( + pathname: string, + name: string, + route: string +): boolean { + const match = leaves.find((leaf) => + leaf.exact ? leaf.route === pathname : pathname.startsWith(leaf.route) + ); + return match + ? (match.name === name && match.route === route) || + match.ancestors.find( + (ancestor) => ancestor.name === name && ancestor.route === route + ) != null + : false; +} + function getMainRoute(route: string) { if (route === "/") { return "/"; diff --git a/components/ShapesBackground.tsx b/components/ShapesBackground.tsx index a34a0316..0003c73d 100644 --- a/components/ShapesBackground.tsx +++ b/components/ShapesBackground.tsx @@ -45,7 +45,11 @@ export function ShapesBackground({ getConfig }: Props) { }, [getConfig, width, height, prevWidth, prevRoute, router.asPath]); return ( -
+
{Object.entries(config).map(([type, instances]) => instances.map((attributes, idx) => ( )} - {hasPastEvents && props.isCurrentTerm && ( + {hasPastEvents && (
-

Past Events

+ {props.isCurrentTerm ? ( +

Past Events

+ ) : ( +

+ Events Archive: + + {` ${capitalize(props.term)} ${props.year}`} + +

+ )}
{props.pastEvents.map(({ content, metadata }) => (
)} - {hasPastEvents && !props.isCurrentTerm && ( -

- Events Archive: - - {` ${capitalize(props.term)} ${props.year}`} - -

- )} {!hasFutureEvents && !hasPastEvents && ( <>

Events

@@ -114,16 +115,6 @@ export default function Term(props: Props) { later! )} -
- {props.pastEvents.map(({ content, metadata }) => ( - } - key={metadata.name + metadata.date.toString()} - /> - ))} -
); } diff --git a/pages/resources/advice/academic.tsx b/pages/resources/advice/academic.tsx index 19fb35ea..6e334657 100644 --- a/pages/resources/advice/academic.tsx +++ b/pages/resources/advice/academic.tsx @@ -4,7 +4,7 @@ import { Title } from "@/components/Title"; import Content from "../../../content/advice/academic-advice.mdx"; -import { Advice } from "./coop"; +import { Advice } from "./co-op"; export default function AcademicAdvice() { return ( diff --git a/pages/resources/advice/coop.module.css b/pages/resources/advice/co-op.module.css similarity index 100% rename from pages/resources/advice/coop.module.css rename to pages/resources/advice/co-op.module.css diff --git a/pages/resources/advice/coop.tsx b/pages/resources/advice/co-op.tsx similarity index 85% rename from pages/resources/advice/coop.tsx rename to pages/resources/advice/co-op.tsx index d46ebdf7..24bb551c 100644 --- a/pages/resources/advice/coop.tsx +++ b/pages/resources/advice/co-op.tsx @@ -5,9 +5,9 @@ import React, { ReactNode } from "react"; import { Image } from "@/components/Image"; import { Title } from "@/components/Title"; -import Content from "../../../content/advice/coop-advice.mdx"; +import Content from "../../../content/advice/co-op-advice.mdx"; -import styles from "./coop.module.css"; +import styles from "./co-op.module.css"; export default function CoopAdvice() { return ( @@ -30,13 +30,13 @@ export function Advice(props: { children: ReactNode }) {
- + - Coop Advice + Co-op Advice diff --git a/pages/resources/advice/index.tsx b/pages/resources/advice/index.tsx new file mode 100644 index 00000000..bcd13fcb --- /dev/null +++ b/pages/resources/advice/index.tsx @@ -0,0 +1,10 @@ +import Head from "next/head"; +import React from "react"; + +export default function AdviceRedirect() { + return ( + + + + ); +} diff --git a/pages/resources/advice/misc.tsx b/pages/resources/advice/misc.tsx index 3e9774d6..21ffabaa 100644 --- a/pages/resources/advice/misc.tsx +++ b/pages/resources/advice/misc.tsx @@ -4,7 +4,7 @@ import { Title } from "@/components/Title"; import Content from "../../../content/advice/misc-advice.mdx"; -import { Advice } from "./coop"; +import { Advice } from "./co-op"; export default function MiscAdvice() { return ( diff --git a/pages/resources/index.tsx b/pages/resources/index.tsx index 9a436de6..a60f39b2 100644 --- a/pages/resources/index.tsx +++ b/pages/resources/index.tsx @@ -1,7 +1,7 @@ import Head from "next/head"; import React from "react"; -export default function Resources() { +export default function ResourcesRedirect() { return (