From 23cd10f3b151ab4c00e4e9623c1b0b88656ee00a Mon Sep 17 00:00:00 2001 From: igiallan Date: Mon, 8 Jul 2024 20:35:05 -0400 Subject: [PATCH] projects page update format. need to fix the icons (github icon showing up for write-up links) --- components/icon.jsx | 21 +++-- config/sponsors.json | 5 + package-lock.json | 61 ++++++++++++ package.json | 4 + pages/projects/index.jsx | 159 +++++++++++++++++++++----------- public/images/sponsors/umsi.png | Bin 0 -> 6567 bytes 6 files changed, 190 insertions(+), 60 deletions(-) create mode 100644 public/images/sponsors/umsi.png diff --git a/components/icon.jsx b/components/icon.jsx index 921fa81..82a3cff 100644 --- a/components/icon.jsx +++ b/components/icon.jsx @@ -15,6 +15,8 @@ import { IoCalendarOutline } from "react-icons/io5"; import { createElement } from "react"; +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import { faGoogleDrive } from "@fortawesome/free-brands-svg-icons"; const iconMap = { envelope: IoMail, @@ -31,13 +33,20 @@ const iconMap = { slack: IoLogoSlack, copy: IoCopyOutline, calendar: IoCalendarOutline, - + googleSlides: faGoogleDrive, }; -export default function Icon(props) { - if (!(props.name in iconMap)) { - console.error("Could not find name " + props.name); +export default function Icon({ name, ...props }) { + const IconComponent = iconMap[name]; + + if (!IconComponent) { + console.error(`Could not find icon with name "${name}"`); return null; } - return createElement(iconMap[props.name], props); -} + + if (name === 'googleSlides') { + return ; + } + + return createElement(IconComponent, props); +} \ No newline at end of file diff --git a/config/sponsors.json b/config/sponsors.json index f0bce14..df64309 100644 --- a/config/sponsors.json +++ b/config/sponsors.json @@ -26,6 +26,11 @@ "name": "Michigan Institute for Data Science", "link": "https://midas.umich.edu/", "image": "midas.png" + }, + { + "name": "University of Michigan School of Information", + "link": "https://www.si.umich.edu/", + "image": "umsi.png" } ] } diff --git a/package-lock.json b/package-lock.json index ae6f7d8..30d84e0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,10 @@ "name": "mdst-website", "version": "0.1.0", "dependencies": { + "@fortawesome/fontawesome-svg-core": "^6.5.2", + "@fortawesome/free-brands-svg-icons": "^6.5.2", + "@fortawesome/free-solid-svg-icons": "^6.5.2", + "@fortawesome/react-fontawesome": "^0.2.2", "@fullcalendar/core": "^6.1.10", "@fullcalendar/google-calendar": "^6.1.10", "@fullcalendar/list": "^6.1.10", @@ -88,6 +92,63 @@ "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } }, + "node_modules/@fortawesome/fontawesome-common-types": { + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.2.tgz", + "integrity": "sha512-gBxPg3aVO6J0kpfHNILc+NMhXnqHumFxOmjYCFfOiLZfwhnnfhtsdA2hfJlDnj+8PjAs6kKQPenOTKj3Rf7zHw==", + "hasInstallScript": true, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/fontawesome-svg-core": { + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.2.tgz", + "integrity": "sha512-5CdaCBGl8Rh9ohNdxeeTMxIj8oc3KNBgIeLMvJosBMdslK/UnEB8rzyDRrbKdL1kDweqBPo4GT9wvnakHWucZw==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.5.2" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/free-brands-svg-icons": { + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.5.2.tgz", + "integrity": "sha512-zi5FNYdmKLnEc0jc0uuHH17kz/hfYTg4Uei0wMGzcoCL/4d3WM3u1VMc0iGGa31HuhV5i7ZK8ZlTCQrHqRHSGQ==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.5.2" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/free-solid-svg-icons": { + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.2.tgz", + "integrity": "sha512-QWFZYXFE7O1Gr1dTIp+D6UcFUF0qElOnZptpi7PBUMylJh+vFmIedVe1Ir6RM1t2tEQLLSV1k7bR4o92M+uqlw==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.5.2" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/react-fontawesome": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.2.2.tgz", + "integrity": "sha512-EnkrprPNqI6SXJl//m29hpaNzOp1bruISWaOiRtkMi/xSvHJlzc2j2JAYS7egxt/EbjSNV/k6Xy0AQI6vB2+1g==", + "dependencies": { + "prop-types": "^15.8.1" + }, + "peerDependencies": { + "@fortawesome/fontawesome-svg-core": "~1 || ~6", + "react": ">=16.3" + } + }, "node_modules/@fullcalendar/core": { "version": "6.1.10", "resolved": "https://registry.npmjs.org/@fullcalendar/core/-/core-6.1.10.tgz", diff --git a/package.json b/package.json index 17cce60..063124e 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,10 @@ "export": "next export -o out" }, "dependencies": { + "@fortawesome/fontawesome-svg-core": "^6.5.2", + "@fortawesome/free-brands-svg-icons": "^6.5.2", + "@fortawesome/free-solid-svg-icons": "^6.5.2", + "@fortawesome/react-fontawesome": "^0.2.2", "@fullcalendar/core": "^6.1.10", "@fullcalendar/google-calendar": "^6.1.10", "@fullcalendar/list": "^6.1.10", diff --git a/pages/projects/index.jsx b/pages/projects/index.jsx index a9359fc..5e6dcd8 100644 --- a/pages/projects/index.jsx +++ b/pages/projects/index.jsx @@ -1,41 +1,95 @@ +import HeadContent from "@/components/headContent"; +import Hero from "@/components/hero"; import Layout from "@/components/layout"; -import Link from "next/link"; import fs from "fs"; import path from "path"; -import Hero from "@/components/hero"; -import HeadContent from "@/components/headContent"; +import Link from "next/link"; +import Image from "next/image"; +import { useRouter } from "next/router"; +import Icon from "@/components/icon"; + + export default function Projects({ groupedLinks }) { + const router = useRouter(); + const basePath = router.basePath; + return ( - - - -
- {Object.entries(groupedLinks).map(([subdirectory, links]) => ( -
-

{subdirectory}

-
    - {links.map((link, index) => ( -
  • - { - link.type != "none" ? - {link.label} - : link.label - } - -
    • - ))} -
-
+ + + {Object.entries(groupedLinks).map(([subdirectory, links], index) => ( + + ))} + + ); +} + +function ProjectSection({ subdirectory, links, basePath }) { + return ( +
+
+

{subdirectory}

+
+
+ {links.map((link, index) => ( + ))}
- +
); } +function ProjectCard({ project, basePath }) { + return ( +
+ {project.label} +
+

{project.label}

+
    + {project.type === "link" && ( +
  • + + + +
    • + )} + {project.type === "md" && ( +
  • + + + +
    • + )} + {project.type === "pdf" && ( +
  • + + + +
    • + )} + {project.type === "googleSlides" && ( +
  • + + + +
    • + )} +
+
+
+ ); +} export async function getStaticProps() { const projectsDirectory = path.join(process.cwd(), "public", "projects"); @@ -46,10 +100,10 @@ export async function getStaticProps() { name: dirent.name, })) .sort((a, b) => { - const order = ['Fall_', 'Winter_']; + const order = ["Fall_", "Winter_"]; const getOrderIndex = (dirName) => { - const prefix = order.find(prefix => dirName.startsWith(prefix)); + const prefix = order.find((prefix) => dirName.startsWith(prefix)); return prefix ? 0 : 1; }; @@ -58,17 +112,15 @@ export async function getStaticProps() { if (orderComparison !== 0) { return orderComparison; } else if (getOrderIndex(a.name) === 0) { - const aNumber = parseInt(a.name.split('_')[1]); - const bNumber = parseInt(b.name.split('_')[1]); + const aNumber = parseInt(a.name.split("_")[1]); + const bNumber = parseInt(b.name.split("_")[1]); return bNumber - aNumber; } else { - return a.name.localeCompare(b.name) + return a.name.localeCompare(b.name); } - - });; + }); const groupedLinks = {}; - const paths = [] subdirectories.forEach((subdirectory) => { const subdirectoryPath = path.join(projectsDirectory, subdirectory.name); const innerDirectories = fs @@ -80,38 +132,38 @@ export async function getStaticProps() { innerDirectories.forEach((innerDir) => { const innerDirPath = path.join(subdirectoryPath, innerDir); - const writeupMdPath = path.join(innerDirPath, "writeup.md"); const writeupPdfPath = path.join(innerDirPath, "writeup.pdf"); const linkTxtPath = path.join(innerDirPath, "link.txt"); - const label = innerDir.split("_") - .join(" "); - let type, href + const label = innerDir.split("_").join(" "); + let type, href; if (fs.existsSync(linkTxtPath)) { - const link = fs.readFileSync(linkTxtPath, 'utf-8').trim(); - href = link - type = "link" + const link = fs.readFileSync(linkTxtPath, "utf-8").trim(); + if (link.toLowerCase().includes('docs.google.com/presentation')) { + href = link; + type = "googleSlides"; + } else { + href = link; + type = "link"; + } } else if (fs.existsSync(writeupMdPath)) { - href = `/projects/${subdirectory.name}/${innerDir}` - type = "md" - } - else if (fs.existsSync(writeupPdfPath)) { - href = `/projects/${subdirectory.name}/${innerDir}/writeup.pdf` - type = "pdf" + href = `/projects/${subdirectory.name}/${innerDir}`; + type = "md"; + } else if (fs.existsSync(writeupPdfPath)) { + href = `/projects/${subdirectory.name}/${innerDir}/writeup.pdf`; + type = "pdf"; } else { - href = "" - type = "none" + href = ""; + type = "none"; } - links.push({ label, href, type }) - + links.push({ label, href, type }); }); if (links.length > 0) { groupedLinks[subdirectory.name.split("_").join(" ")] = links; } - }); return { @@ -120,4 +172,3 @@ export async function getStaticProps() { }, }; } - diff --git a/public/images/sponsors/umsi.png b/public/images/sponsors/umsi.png new file mode 100644 index 0000000000000000000000000000000000000000..26e2b2ee00b6703f1729ca18eaa052b73adacd70 GIT binary patch literal 6567 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