Skip to content

Commit 4672c54

Browse files
anyulledanyulled
authored
fix: carrousel swiper was showing the same speakers every year. (#708)
1 parent 62f243e commit 4672c54

File tree

7 files changed

+45
-30
lines changed

7 files changed

+45
-30
lines changed

‎src/2023/Home/Home2023Wrapper.tsx‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
1-
import { BIG_BREAKPOINT } from "../../constants/BreakPoints";
1+
import { BIG_BREAKPOINT } from "@constants/BreakPoints";
22
import React, { FC } from "react";
33
import Faqs from "./components/Faqs/Faqs";
44
import Home from "./components/Home/Home";
55
import Sponsors from "./components/Sponsors/Sponsors";
66
import { styled } from "styled-components";
7-
import data from "../../data/2023.json";
7+
import data from "@data/2023.json";
88
import { useLocation } from "react-router";
9-
import SpeakersCarousel from "../../components/Swiper/SpeakersCarousel";
10-
import { ROUTE_2023_SPEAKERS } from "../../constants/routes";
11-
import { useDocumentTitleUpdater } from "../../hooks/useDocumentTitleUpdate";
9+
import SpeakersCarousel from "@components/Swiper/SpeakersCarousel";
10+
import { ROUTE_2023_SPEAKERS } from "@constants/routes";
11+
import { useDocumentTitleUpdater } from "@hooks/useDocumentTitleUpdate";
1212

1313
const StyledContainer = styled.div`
1414
padding-bottom: 10rem;
@@ -35,7 +35,8 @@ export const Home2023Wrapper: FC<React.PropsWithChildren<unknown>> = () => {
3535
<Faqs />
3636
<SpeakersCarousel
3737
speakersLink={ROUTE_2023_SPEAKERS}
38-
sessionizeUrl={data.sessionizeUrl}
38+
sessionizeUrl={data.edition}
39+
isEnabled={data.carrousel.enabled}
3940
/>
4041
<Sponsors />
4142
</StyledContainer>

‎src/2024/HomeWrapper2024.tsx‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,15 @@ import React, { FC } from "react";
22
import { styled } from "styled-components";
33

44
import { useLocation } from "react-router";
5-
import { BIG_BREAKPOINT } from "../constants/BreakPoints";
6-
import conferenceData from "../data/2024.json";
5+
import { BIG_BREAKPOINT } from "@constants/BreakPoints";
6+
import conferenceData from "@data/2024.json";
77
import Faqs from "../views/Home/components/Faqs/Faqs";
88

99
import Home from "./Home/Home";
1010
import Sponsors from "./Sponsors/Sponsors";
1111
import SpeakersCarousel from "../components/Swiper/SpeakersCarousel";
12-
import { ROUTE_2024_SPEAKERS } from "../constants/routes";
13-
import { useDocumentTitleUpdater } from "../hooks/useDocumentTitleUpdate";
12+
import { ROUTE_2024_SPEAKERS } from "@constants/routes";
13+
import { useDocumentTitleUpdater } from "@hooks/useDocumentTitleUpdate";
1414

1515
const StyledContainer = styled.div`
1616
padding-bottom: 10rem;
@@ -39,6 +39,7 @@ export const HomeWrapper2024: FC<React.PropsWithChildren<unknown>> = () => {
3939
<SpeakersCarousel
4040
speakersLink={ROUTE_2024_SPEAKERS}
4141
sessionizeUrl={conferenceData.sessionizeUrl}
42+
isEnabled={conferenceData.carrousel.enabled}
4243
/>
4344
<Sponsors />
4445
</StyledContainer>

‎src/components/Swiper/SpeakerSwiper.tsx‎

Lines changed: 18 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,15 @@ import React, { FC } from "react";
22
import { Autoplay, Parallax } from "swiper";
33
import { Swiper, SwiperSlide } from "swiper/react";
44
import { styled } from "styled-components";
5-
import { Color } from "../../styles/colors";
5+
import { Color } from "@styles/colors";
66
import "swiper/swiper-bundle.min.css";
77
import "../../components/Swiper/SpeakersCarousel.scss";
8-
import conferenceData from "../../data/2025.json";
9-
import { useFetchSpeakers } from "../../hooks/useFetchSpeakers";
10-
import { ISpeaker } from "../../types/speakers";
11-
import { ROUTE_SPEAKER_DETAIL } from "../../constants/routes";
8+
import { useFetchSpeakers } from "@hooks/useFetchSpeakers";
9+
// @ts-expect-error some weird error when importing types
10+
import { ISpeaker } from "@types/speakers";
11+
import { ROUTE_SPEAKER_DETAIL } from "@constants/routes";
1212
import { Link } from "react-router";
13-
import { useSentryErrorReport } from "../../hooks/useSentryErrorReport";
13+
import { useSentryErrorReport } from "@hooks/useSentryErrorReport";
1414

1515
const StyledSlideImage = styled.img`
1616
display: block;
@@ -36,8 +36,17 @@ const StyledSlideText = styled.p`
3636
font-size: 0.875rem;
3737
color: white;
3838
`;
39-
const SpeakerSwiper: FC<React.PropsWithChildren<unknown>> = () => {
40-
const { isLoading, data, error } = useFetchSpeakers();
39+
40+
interface Props {
41+
isEnabled: boolean;
42+
url: string;
43+
}
44+
45+
const SpeakerSwiper: FC<React.PropsWithChildren<Props>> = ({
46+
isEnabled,
47+
url,
48+
}) => {
49+
const { isLoading, data, error } = useFetchSpeakers(url);
4150

4251
const cachedSpeakers = React.useMemo(() => {
4352
return data?.toSorted(() => 0.5 - Math.random()).slice(0, 20);
@@ -48,7 +57,7 @@ const SpeakerSwiper: FC<React.PropsWithChildren<unknown>> = () => {
4857
return (
4958
<>
5059
{isLoading && <p>Loading</p>}
51-
{conferenceData.carrousel.enabled && cachedSpeakers && (
60+
{isEnabled && cachedSpeakers && (
5261
<Swiper
5362
autoplay={{
5463
delay: 500,

‎src/components/Swiper/SpeakersCarousel.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@ import LessThanBlueWhiteIcon from "../../assets/images/LessThanBlueIcon.svg";
44
import { motion } from "framer-motion";
55
import { styled } from "styled-components";
66
import SpeakerSwiper from "./SpeakerSwiper";
7-
import { Color } from "../../styles/colors";
8-
import { TABLET_BREAKPOINT } from "../../constants/BreakPoints";
7+
import { Color } from "@styles/colors";
8+
import { TABLET_BREAKPOINT } from "@constants/BreakPoints";
99
import SectionWrapper from "../SectionWrapper/SectionWrapper";
1010
import TitleSection from "../SectionTitle/TitleSection";
1111

@@ -59,11 +59,13 @@ const StyledBlueSlash = styled(motion.p)`
5959
interface Props {
6060
speakersLink: string;
6161
sessionizeUrl: string;
62+
isEnabled: boolean;
6263
}
6364

6465
const SpeakersCarousel: FC<React.PropsWithChildren<Props>> = ({
6566
speakersLink,
6667
sessionizeUrl,
68+
isEnabled,
6769
}) => {
6870
return (
6971
<SectionWrapper color={Color.LIGHT_BLUE}>
@@ -78,7 +80,7 @@ const SpeakersCarousel: FC<React.PropsWithChildren<Props>> = ({
7880
color={Color.WHITE}
7981
/>
8082
</StyledTitleWrapper>
81-
<SpeakerSwiper sessionizeUrl={sessionizeUrl} />
83+
<SpeakerSwiper url={sessionizeUrl} isEnabled={isEnabled} />
8284
<StyledLink>
8385
<Link to={speakersLink} className="link--text">
8486
<StyledSubtitle> View all speakers</StyledSubtitle>

‎src/data/2023.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"actionButtons": false,
33
"carrousel": {
4-
"enabled": false
4+
"enabled": true
55
},
66
"cfp": {
77
"startDay": "2022-11-01T00:00:00",

‎src/hooks/useFetchSpeakers.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
import { useQuery, UseQueryResult } from "react-query";
22
import axios from "axios";
3-
import { speakerAdapter } from "../services/speakerAdapter";
4-
import { IResponse, ISpeaker } from "../types/speakers";
3+
import { speakerAdapter } from "@services/speakerAdapter";
4+
// @ts-expect-error some weird error when importing types
5+
import { IResponse, ISpeaker } from "@types/speakers";
56

67
const URLS = {
78
default: "https://sessionize.com/api/v2/xhudniix/view/Speakers",

‎src/views/Home/HomeWrapper.tsx‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
1-
import { BIG_BREAKPOINT } from "../../constants/BreakPoints";
1+
import { BIG_BREAKPOINT } from "@constants/BreakPoints";
22
import React, { FC } from "react";
33
import Faqs from "./components/Faqs/Faqs";
44
import Home from "./components/Home/Home";
55
import Sponsors from "./components/Sponsors/Sponsors";
66
import { styled } from "styled-components";
7-
import conferenceData from "../../data/2025.json";
7+
import conferenceData from "@data/2025.json";
88
import { useLocation } from "react-router";
99

10-
import SpeakersCarousel from "../../components/Swiper/SpeakersCarousel";
11-
import { ROUTE_SPEAKERS } from "../../constants/routes";
12-
import { useDocumentTitleUpdater } from "../../hooks/useDocumentTitleUpdate";
10+
import SpeakersCarousel from "@components/Swiper/SpeakersCarousel";
11+
import { ROUTE_SPEAKERS } from "@constants/routes";
12+
import { useDocumentTitleUpdater } from "@hooks/useDocumentTitleUpdate";
1313

1414
const StyledContainer = styled.div`
1515
padding-bottom: 10rem;
@@ -38,6 +38,7 @@ const HomeWrapper: FC<React.PropsWithChildren<unknown>> = () => {
3838
<SpeakersCarousel
3939
sessionizeUrl={conferenceData.sessionizeUrl}
4040
speakersLink={ROUTE_SPEAKERS}
41+
isEnabled={conferenceData.carrousel.enabled}
4142
/>
4243
)}
4344
<Sponsors />

0 commit comments

Comments
 (0)