-
Notifications
You must be signed in to change notification settings - Fork 1
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add officer card data and semester data #35
Changes from 1 commit
0b9d119
a5e899a
97ef7dc
3e21c33
6d9ae34
d949dd3
87ef893
324f670
53b5a31
3e46aee
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
- Loading branch information
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,39 +1,46 @@ | ||
import React from "react"; | ||
import Image from "next/image"; | ||
import styles from "./About.module.css"; | ||
|
||
import OfficerCard from "./officer-card"; | ||
import officerCardData, { officerData, positionData } from "./officer-data"; | ||
|
||
export default function About() { | ||
const officerCards = officerCardData.map((cardData) => ( | ||
<OfficerCard | ||
key={cardData.position} | ||
position={cardData.position} | ||
image={cardData.image} | ||
name={cardData.name} | ||
socialLinksData={cardData.socialLinksData} | ||
/> | ||
)); | ||
// const officerCards = officerCardData.map((cardData) => ( | ||
// <OfficerCard | ||
// key={cardData.position} | ||
// position={cardData.position} | ||
// image={cardData.image} | ||
// name={cardData.name} | ||
// socialLinksData={cardData.socialLinksData} | ||
// /> | ||
// )); | ||
|
||
const officerCardSection = Object.entries(positionData).map( | ||
([semester, officers]) => { | ||
const officerCards = Object.entries(officers).map( | ||
([position, officer]) => ( | ||
<OfficerCard | ||
key={`${semester} ${position}`} | ||
position={position} | ||
image={officer.image} | ||
name={officer.name} | ||
socialLinksData={officer.socialLinksData} | ||
/> | ||
), | ||
([position, officer]) => { | ||
if (officer === undefined) { | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. [Please Change]: From our discussion the handling here has been changed and this check is no longer needed. |
||
return <div key={`${semester} ${position}`} />; | ||
} | ||
|
||
return ( | ||
<OfficerCard | ||
key={`${semester} ${position}`} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. [Please Change]: We can use just position as the key here because it's unique within each semester. In other words; we don't need to ensure the keys are unique across both loops; just the current one. |
||
position={position} | ||
image={officer.image} | ||
name={officer.name} | ||
socialLinksData={officer.socialLinksData} | ||
/> | ||
); | ||
}, | ||
); | ||
|
||
return ( | ||
<> | ||
<React.Fragment key={semester}> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. [Comment]: Great use of |
||
<h2>{semester}</h2> | ||
{officerCards} | ||
</> | ||
<div className={styles.cardContainer}>{officerCards}</div> | ||
</React.Fragment> | ||
); | ||
}, | ||
); | ||
|
@@ -64,7 +71,8 @@ export default function About() { | |
<section className={styles.officers}> | ||
<div className={styles.container}> | ||
<h2>Officers</h2> | ||
<div className={styles.cardContainer}>{officerCards}</div> | ||
{/* <div className={styles.cardContainer}>{officerCards}</div> */} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. [Nit]: Can be cleaned up as above. |
||
{officerCardSection} | ||
</div> | ||
</section> | ||
</main> | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
[Nit]: Development comments like this should be cleaned up before merging under most situations.