Add officer card data and semester data (#35)

* Add officer card data and semester data * Map new officer cards. Couple of errors that need to be addresseed * Fix undefined errors on officer cards * Add all officers to officerData. Some officer data missing, such as image and linkedin. * Fix ESLint Errors by removing unused variables in page.tsx. Replace missing Officer photos with ssd logo due to error in loading image or not having the image * Remove undefined conditions and unnecessary comments * fix lint error * Simplify officer/position structure and standardize data * Convert social links into a map of sites to urls * Improve key attributes for array components --------- Co-authored-by: Brian-Magnuson <92892499+Brian-Magnuson@users.noreply.github.com> Co-authored-by: WillBAnders <WillBAnders@gmail.com>
ufssd · Dec 13, 2023 · 5f064b7 · 5f064b7
1 parent 117ec1a
commit 5f064b7
Show file tree

Hide file tree

Showing 11 changed files with 236 additions and 121 deletions.
diff --git a/public/public/officers/Alex_Good.jpg b/public/public/officers/Alex_Good.jpg
diff --git a/public/public/officers/Blake_Anderson.jpg b/public/public/officers/Blake_Anderson.jpg
diff --git a/public/public/officers/Caijun_Qin.jpg b/public/public/officers/Caijun_Qin.jpg
diff --git a/public/public/officers/Eric_Navar.jpg b/public/public/officers/Eric_Navar.jpg
diff --git a/public/public/officers/Ranger_Chenore.jpg b/public/public/officers/Ranger_Chenore.jpg
diff --git a/public/public/officers/Tianrui_Li.jpg b/public/public/officers/Tianrui_Li.jpg
diff --git a/public/public/officers/Trevor_Richardson.jpg b/public/public/officers/Trevor_Richardson.jpg
diff --git a/public/public/officers/Varun_Puri.jpg b/public/public/officers/Varun_Puri.jpg
diff --git a/src/app/about/officer-card.tsx b/src/app/about/officer-card.tsx
@@ -1,38 +1,27 @@
 import Image from "next/image";
+import { OfficerData, SocialSite } from "./officer-data";
 import styles from "./OfficerCard.module.css";
 
-export type SocialLink = {
-  name: string;
-  url: string;
-  icon: string;
+const socialIcons: Record<SocialSite, string> = {
+  GitHub: "/github_logo.svg",
+  LinkedIn: "/linkedin_logo.png",
+  Website: "/web_logo.svg",
 };
 
 export type OfficerCardProps = {
   position: string;
-  image: string;
-  name: string;
-  socialLinksData: SocialLink[];
+  officer: OfficerData;
 };
 
-export default function OfficerCard({
-  position,
-  image,
-  name,
-  socialLinksData,
-}: OfficerCardProps) {
-  const socialLinks = socialLinksData.map((link) => (
-    <a
-      href={link.url}
-      key={link.name}
-      target="_blank"
-      rel="noopener noreferrer"
-    >
+export default function OfficerCard({ position, officer }: OfficerCardProps) {
+  const socialLinks = Object.entries(officer.socials).map(([site, url]) => (
+    <a key={site} href={url} target="_blank" rel="noopener noreferrer">
       <Image
-        src={link.icon}
-        alt={link.name}
+        src={socialIcons[site as SocialSite]} // cast key from Object.entries
+        alt={site}
         height={30}
         width={30}
-        data-name={link.name}
+        data-name={site}
       />
     </a>
   ));
@@ -42,12 +31,12 @@ export default function OfficerCard({
       <h3>{position}</h3>
       <Image
         className={styles.portrait}
-        src={image}
-        alt={`Profile picture of ${name}`}
+        src={officer.image}
+        alt={`Profile picture of ${officer.name}`}
         height={180}
         width={180}
       />
-      <h4>{name}</h4>
+      <h4>{officer.name}</h4>
       <div className={styles.socialLinks}>{socialLinks}</div>
     </div>
   );

diff --git a/src/app/about/officer-data.ts b/src/app/about/officer-data.ts
@@ -1,88 +1,204 @@
-import { OfficerCardProps } from "./officer-card";
+export type SocialSite = "GitHub" | "LinkedIn" | "Website";
 
-const officerCardData: OfficerCardProps[] = [
-  {
-    position: "President",
-    image: "public/officers/Yonas_Bahre.jpg",
-    name: "Yonas Bahre",
-    socialLinksData: [
-      {
-        name: "LinkedIn",
-        url: "https://www.linkedin.com/in/yonasbahre/",
-        icon: "/linkedin_logo.png",
-      },
-    ],
-  },
-  {
-    position: "Vice President",
-    image: "public/officers/Michael_Hayworth.jpg",
-    name: "Michael Hayworth",
-    socialLinksData: [
-      {
-        name: "LinkedIn",
-        url: "https://www.linkedin.com/in/michaeldhayworth/",
-        icon: "/linkedin_logo.png",
-      },
-    ],
-  },
-  {
-    position: "Treasurer",
-    image: "public/officers/Stephen_Coomes.jpg",
-    name: "Stephen Coomes",
-    socialLinksData: [
-      {
-        name: "LinkedIn",
-        url: "https://www.linkedin.com/in/stephen-coomes-8a4885221/",
-        icon: "/linkedin_logo.png",
-      },
-    ],
-  },
-  {
-    position: "Outreach Officer",
-    image: "public/officers/Angel_Lopez.png",
+export type OfficerData = {
+  name: string;
+  image: string;
+  socials: Partial<Record<SocialSite, string>>;
+};
+
+export const officerData: Record<string, OfficerData> = {
+  alex_good: {
+    name: "Alex Good",
+    image: "public/officers/Alex_Good.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/alex-good-97806120a",
+    },
+  },
+  andrew_kennedy: {
+    name: "Andrew Kennedy",
+    image: "/ssd_logo.svg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/andrewphkennedy",
+    },
+  },
+  angel_lopez: {
     name: "Angel Lopez",
-    socialLinksData: [
-      {
-        name: "GitHub",
-        url: "https://github.com/angel1254mc",
-        icon: "/github_logo.svg",
-      },
-      {
-        name: "LinkedIn",
-        url: "https://www.linkedin.com/in/angel1254/",
-        icon: "/linkedin_logo.png",
-      },
-      {
-        name: "Website",
-        url: "https://www.angel1254.com/",
-        icon: "/web_logo.svg",
-      },
-    ],
-  },
-  {
-    position: "Program Officer",
-    image: "public/officers/Param_Gupta.jpg",
-    name: "Param Gupta",
-    socialLinksData: [
-      {
-        name: "LinkedIn",
-        url: "https://www.linkedin.com/in/paramg/",
-        icon: "/linkedin_logo.png",
-      },
-    ],
-  },
-  {
-    position: "Involvement Officer",
-    image: "public/officers/CJ_Weir.jpg",
+    image: "public/officers/Angel_Lopez.png",
+    socials: {
+      GitHub: "https://github.com/angel1254mc",
+      LinkedIn: "https://linkedin.com/in/angel1254",
+      Website: "https://angel1254.com",
+    },
+  },
+  blake_anderson: {
+    name: "Blake Anderson",
+    image: "public/officers/Blake_Anderson.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/WillBAnders",
+    },
+  },
+  caijun_qin: {
+    name: "Caijun Qin",
+    image: "public/officers/Caijun_Qin.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/cq-profile",
+    },
+  },
+  cj_weir: {
     name: "CJ Weir",
-    socialLinksData: [
-      {
-        name: "LinkedIn",
-        url: "https://www.linkedin.com/in/cj-weir/",
-        icon: "/linkedin_logo.png",
-      },
-    ],
-  },
-];
+    image: "public/officers/CJ_Weir.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/cj-weir",
+    },
+  },
+  eric_navar: {
+    name: "Eric Navar",
+    image: "public/officers/Eric_Navar.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/ericnavar",
+    },
+  },
+  isaac_fuenmayor: {
+    name: "Isaac Fuenmayor",
+    image: "/ssd_logo.svg",
+    socials: {},
+  },
+  jacob_bleser: {
+    name: "Jacob Bleser",
+    image: "/ssd_logo.svg",
+    socials: {},
+  },
+  katherine_chan: {
+    name: "Katherine Chan",
+    image: "/ssd_logo.svg",
+    socials: {},
+  },
+  michael_hayworth: {
+    name: "Michael Hayworth",
+    image: "public/officers/Michael_Hayworth.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/michaeldhayworth",
+    },
+  },
+  param_gupta: {
+    name: "Param Gupta",
+    image: "public/officers/Param_Gupta.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/paramg",
+    },
+  },
+  ranger_chenore: {
+    name: "Ranger Chenore",
+    image: "public/officers/Ranger_Chenore.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/ranger-chenore",
+    },
+  },
+  scott_harrison: {
+    name: "Scott Harrison",
+    image: "/ssd_logo.svg",
+    socials: {},
+  },
+  song_li: {
+    name: "Song Li",
+    image: "/ssd_logo.svg",
+    socials: {},
+  },
+  stephen_coomes: {
+    name: "Stephen Coomes",
+    image: "public/officers/Stephen_Coomes.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/stephen-coomes-8a4885221",
+    },
+  },
+  tianrui_li: {
+    name: "Tianrui Li",
+    image: "public/officers/Tianrui_Li.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/tianrui-li-b7343518a",
+    },
+  },
+  trevor_richardson: {
+    name: "Trevor Richardson",
+    image: "public/officers/Trevor_Richardson.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/trevorarichardson",
+    },
+  },
+  varun_puri: {
+    name: "Varun Puri",
+    image: "public/officers/Varun_Puri.jpg",
+    socials: {
+      LinkedIn: "https://linkedin.com/in/varun-puri",
+    },
+  },
+  yonas_bahre: {
+    name: "Yonas Bahre",
+    image: "public/officers/Yonas_Bahre.jpg",
+    socials: {
+      GitHub: "https://github.com/yonasbahre",
+      LinkedIn: "https://linkedin.com/in/yonasbahre",
+    },
+  },
+};
 
-export default officerCardData;
+export const positionData: Record<string, Record<string, OfficerData>> = {
+  "Fall 2023": {
+    President: officerData.yonas_bahre,
+    "Vice President": officerData.michael_hayworth,
+    Treasurer: officerData.stephen_coomes,
+    "Outreach Officer": officerData.angel_lopez,
+    "Program Officer": officerData.param_gupta,
+    "Involvement Officer": officerData.cj_weir,
+  },
+  "Spring 2023": {
+    President: officerData.trevor_richardson,
+    "Vice President": officerData.michael_hayworth,
+    Treasurer: officerData.yonas_bahre,
+    "Outreach Officer": officerData.stephen_coomes,
+    "Program Officer": officerData.param_gupta,
+    "Involvement Officer": officerData.cj_weir,
+  },
+  "Fall 2022": {
+    President: officerData.ranger_chenore,
+    "Vice President": officerData.trevor_richardson,
+    Treasurer: officerData.yonas_bahre,
+    "Outreach Officer": officerData.michael_hayworth,
+    "Program Officer": officerData.alex_good,
+    "Involvement Officer": officerData.eric_navar,
+  },
+  "Spring 2022": {
+    President: officerData.eric_navar,
+    "Vice President": officerData.ranger_chenore,
+    Treasurer: officerData.caijun_qin,
+    "Outreach Officer": officerData.michael_hayworth,
+    "Program Officer": officerData.trevor_richardson,
+    "Involvement Officer": officerData.isaac_fuenmayor,
+  },
+  "Fall 2021": {
+    President: officerData.eric_navar,
+    "Vice President": officerData.ranger_chenore,
+    Treasurer: officerData.caijun_qin,
+    "Outreach Officer": officerData.varun_puri,
+    "Program Officer": officerData.trevor_richardson,
+    "Involvement Officer": officerData.isaac_fuenmayor,
+  },
+  "Fall 2020 - Spring 2021": {
+    President: officerData.varun_puri,
+    "Vice President": officerData.eric_navar,
+    "Logistics Officer": officerData.andrew_kennedy,
+    "Development Officer": officerData.tianrui_li,
+    "Program Officer": officerData.katherine_chan,
+    "Communications Officer": officerData.ranger_chenore,
+  },
+  "Fall 2019 - Spring 2020": {
+    President: officerData.blake_anderson,
+    "Vice President": officerData.song_li,
+    Treasurer: officerData.varun_puri,
+  },
+  "Fall 2018 - Spring 2019": {
+    President: officerData.blake_anderson,
+    "Vice President": officerData.scott_harrison,
+    Treasurer: officerData.jacob_bleser,
+  },
+};