refactor: remove duplication on fetch speaker logic

Author: anyulled

src/2023/Home/components/SpeakersCarousel/SpeakerSwiper.tsx

@@ -7,7 +7,7 @@ import "swiper/swiper-bundle.min.css";
 import "./SpeakersCarousel.scss";
 import { Link } from "react-router";
 import { ROUTE_SPEAKER_DETAIL } from "../../../../constants/routes";
-import { useFetchSpeakers } from "../../../Speakers/UseFetchSpeakers";
+import { useFetchSpeakers } from "../../../../hooks/useFetchSpeakers";
 import * as Sentry from "@sentry/react";
 
 const StyledSlideImage = styled.img`
@@ -35,7 +35,7 @@ const StyledSlideText = styled.p`
   color: white;
 `;
 const SpeakerSwiper: FC<React.PropsWithChildren<unknown>> = () => {
-  const { isLoading, data, error } = useFetchSpeakers();
+  const { isLoading, data, error } = useFetchSpeakers("2023");
 
   const swiperSpeakers = data?.sort(() => 0.5 - Math.random()).slice(0, 20);
 

src/2023/SpeakerDetail/SpeakerDetailContainer2023.tsx

@@ -6,13 +6,13 @@ import SpeakerDetail2023 from "./SpeakerDetail2023";
 import { useParams } from "react-router";
 import { StyledContainer, StyledWaveContainer } from "./Speaker.style";
 import conferenceData from "../../data/2023.json";
-import { useFetchSpeakers } from "../Speakers/UseFetchSpeakers";
+import { useFetchSpeakers } from "../../hooks/useFetchSpeakers";
 import * as Sentry from "@sentry/react";
 
 const SpeakerDetailContainer2023: FC<React.PropsWithChildren<unknown>> = () => {
   const { id } = useParams<{ id: string }>();
 
-  const { isLoading, error, data } = useFetchSpeakers(id);
+  const { isLoading, error, data } = useFetchSpeakers("2023", id);
 
   if (error) {
     Sentry.captureException(error);

src/2023/Speakers/Speakers2023.tsx

@@ -20,7 +20,7 @@ import {
 import webData from "../../data/2023.json";
 import Button from "../../components/UI/Button";
 import {gaEventTracker} from "../../components/analytics/Analytics";
-import {useFetchSpeakers} from "./UseFetchSpeakers";
+import {useFetchSpeakers} from "../../hooks/useFetchSpeakers";
 import * as Sentry from "@sentry/react";
 import {ISpeaker} from "../../types/speakers";
 
@@ -41,7 +41,7 @@ const Speakers2023: FC<React.PropsWithChildren<unknown>> = () => {
   const isBetween = (startDay: Date, endDay: Date): boolean =>
     startDay < new Date() && endDay > today;
 
-  const { error, data, isLoading } = useFetchSpeakers();
+  const { error, data, isLoading } = useFetchSpeakers("2023");
 
   if (error) {
     Sentry.captureException(error);

src/2023/Speakers/UseFetchSpeakers.ts

@@ -7,7 +7,7 @@ import {useParams} from "react-router";
 import conferenceData from "../../data/2023.json";
 import {useFetchTalksById} from "../Talks/UseFetchTalks";
 import * as Sentry from "@sentry/react";
-import {useFetchSpeakers} from "../Speakers/UseFetchSpeakers";
+import {useFetchSpeakers} from "../../hooks/useFetchSpeakers";
 import {Session} from "../../types/sessions";
 import TalkDetail from "./TalkDetail";
 import {ISpeaker} from "../../types/speakers";
@@ -19,7 +19,7 @@ const StyledContainer = styled.div`
 const TalkDetailContainer2023: FC<React.PropsWithChildren<unknown>> = () => {
   const { id } = useParams<{ id: string }>();
   const { isLoading, error, data } = useFetchTalksById(id!);
-  const { data: speakerData } = useFetchSpeakers();
+  const { data: speakerData } = useFetchSpeakers("2023");
 
   const getTalkSpeakers = (
     data: Session[] | undefined,

src/2023/TalkDetail/TalkDetailContainer2023.tsx

@@ -5,15 +5,15 @@ import SectionWrapper from "../../components/SectionWrapper/SectionWrapper";
 import SpeakerDetail from "./SpeakerDetail";
 import {useParams} from "react-router";
 import conferenceData from "../../data/2024.json";
-import {useFetchSpeakers} from "../Speakers/UseFetchSpeakers";
+import {useFetchSpeakers} from "../../hooks/useFetchSpeakers";
 import * as Sentry from "@sentry/react";
 import {StyledContainer} from "../../views/SpeakerDetail/Speaker.style";
 import {StyledWaveContainer} from "../../views/Talks/Talks.style";
 
 const SpeakerDetailContainer2024: FC<React.PropsWithChildren<unknown>> = () => {
     const {id} = useParams<{ id: string }>();
 
-    const {isLoading, error, data} = useFetchSpeakers(id);
+    const {isLoading, error, data} = useFetchSpeakers("2024", id);
 
     if (error) {
         Sentry.captureException(error);

src/2024/SpeakerDetail/SpeakerDetailContainer2024.tsx

@@ -19,7 +19,7 @@ import {
 import webData from "../../data/2024.json";
 import Button from "../../components/UI/Button";
 import {gaEventTracker} from "../../components/analytics/Analytics";
-import {useFetchSpeakers} from "./UseFetchSpeakers";
+import {useFetchSpeakers} from "../../hooks/useFetchSpeakers";
 import * as Sentry from "@sentry/react";
 import {SpeakerCard} from "../../views/Speakers/components/SpeakersCard";
 import {ISpeaker} from "../../types/speakers";
@@ -41,7 +41,7 @@ const Speakers2024: FC<React.PropsWithChildren<unknown>> = () => {
     const isBetween = (startDay: Date, endDay: Date): boolean =>
         startDay < new Date() && endDay > today;
 
-    const {error, data, isLoading} = useFetchSpeakers();
+    const {error, data, isLoading} = useFetchSpeakers("2024");
 
     if (error) {
         Sentry.captureException(error);

src/2024/Speakers/Speakers2024.tsx

@@ -6,7 +6,7 @@ import "swiper/swiper-bundle.min.css";
 import "./SpeakersCarousel.scss";
 import {Link} from "react-router";
 import conferenceData from "../../data/2024.json";
-import {useFetchSpeakers} from "../Speakers/UseFetchSpeakers";
+import {useFetchSpeakers} from "../../hooks/useFetchSpeakers";
 import * as Sentry from "@sentry/react";
 import {Color} from "../../styles/colors";
 import {ROUTE_SPEAKER_DETAIL} from "../../constants/routes";
@@ -36,28 +36,28 @@ const StyledSlideText = styled.p`
     color: white;
 `;
 const SpeakerSwiper: FC<React.PropsWithChildren<unknown>> = () => {
-    const {isLoading, data, error} = useFetchSpeakers();
+    const {isLoading, data, error} = useFetchSpeakers("2024");
 
     // Securely shuffle the speakers using Fisher-Yates algorithm with crypto API
 const swiperSpeakers = React.useMemo(() => {
     if (!data) return null;
-    
+
     // Create a copy of the data to avoid mutating the original
     const speakersCopy = [...data];
-    
+
     // Fisher-Yates shuffle with crypto.getRandomValues for secure randomization
     for (let i = speakersCopy.length - 1; i > 0; i--) {
         // Generate a secure random value using crypto API
         const randomBuffer = new Uint32Array(1);
         window.crypto.getRandomValues(randomBuffer);
-        
+
         // Use the random value to get an index between 0 and i (inclusive)
         const j = randomBuffer[0] % (i + 1);
-        
+
         // Swap elements at i and j
         [speakersCopy[i], speakersCopy[j]] = [speakersCopy[j], speakersCopy[i]];
     }
-    
+
     // Return the first 20 speakers from the shuffled array
     return speakersCopy.slice(0, 20);
 }, [data]);