From fbc5963a6d1fa6cd043d1831c6d4ccaf78f983a2 Mon Sep 17 00:00:00 2001
From: alicetran1221 <108845502+alicetran1221@users.noreply.github.com>
Date: Mon, 1 Apr 2024 21:53:13 -0700
Subject: [PATCH] Converted Speakers class to function (#240)

---
 src/app/components/speakers/speakers.js | 60 +++++++++++--------------
 1 file changed, 26 insertions(+), 34 deletions(-)

diff --git a/src/app/components/speakers/speakers.js b/src/app/components/speakers/speakers.js
index dd23863..869d8b8 100644
--- a/src/app/components/speakers/speakers.js
+++ b/src/app/components/speakers/speakers.js
@@ -1,46 +1,38 @@
-import React from "react";
+import React from 'react';
 import { speakersData } from "assets/data/speakers-info.js";
 import "./speakers.scss";
 
-const Speaker = (name, title, photo) => {
-  return (
+const Speaker = (name, title, photo) => (
     <div className="speaker-img-wrapper">
-      <img
-        src={require("assets/images/speaker-photos/" + photo + ".jpeg")}
-        alt={name + "'s profile picture"}
-      />
-      <div className="text">
-        <h4>{name}</h4>
-        <p>{title}</p>
-      </div>
+        <img 
+            src = {require('assets/images/speaker-photos/'+photo+'.jpeg')}
+            alt = {name + "'s profile picture"}
+        />
+        <div className="text">
+            <h4>{name}</h4>
+            <p>{title}</p>
+        </div>
     </div>
-  );
-};
+);
 
-const renderSpeakers = (speakers) => {
-  return (
+const renderSpeakers = (speakers) => (
     <div className="speaker-photos">
-      {speakers.map((speaker) =>
-        Speaker(speaker.name, speaker.title, speaker.photo),
-      )}
+        {speakers.map((speaker) => 
+            Speaker(speaker.name, speaker.title, speaker.photo)
+        )}
     </div>
-  );
-};
+);
 
-export default class Speakers extends React.Component {
-  render() {
+const Speakers = () => {
     return (
-      <div id="speakers">
-        <p className="subheader">Opening Speakers</p>
-        {renderSpeakers(speakersData.opening)}
-        <p className="subheader">Closing Speakers</p>
-        {renderSpeakers(speakersData.closing)}
-        <p className="subheader">Panelists</p>
-        {renderSpeakers(speakersData.panelists)}
-      </div>
+        <div id="speakers">
+            <p className="subheader">Opening Speakers</p>
+            {renderSpeakers(speakersData.opening)}
+            <p className="subheader">Closing Speakers</p>
+            {renderSpeakers(speakersData.closing)}
+            <p className="subheader">Panelists</p>
+            {renderSpeakers(speakersData.panelists)}
+        </div>
     );
-  }
-}
 
-// <p className="subheader">Keynote</p>
-// {renderSpeakers(speakersData.keynotes)}
+export default Speakers;
\ No newline at end of file