diff --git a/data/annual-leaderboard/2023/round2/final.json b/data/annual-leaderboard/2023/final.json similarity index 100% rename from data/annual-leaderboard/2023/round2/final.json rename to data/annual-leaderboard/2023/final.json diff --git a/data/annual-leaderboard/2023/round2/ghost-legion.json b/data/annual-leaderboard/2023/ghost-legion.json similarity index 100% rename from data/annual-leaderboard/2023/round2/ghost-legion.json rename to data/annual-leaderboard/2023/ghost-legion.json diff --git a/src/components/layout/header.jsx b/src/components/layout/header.jsx index 31d1f89..b6088c7 100644 --- a/src/components/layout/header.jsx +++ b/src/components/layout/header.jsx @@ -77,9 +77,7 @@ const Header = ({ className }) => { className="hidden xsm:flex gap-2" >
- - {isHallOfFame ? "Leaderboard" : "Hall of Fame"} - + {isHallOfFame ? "Leaderboard" : "Hall of Fame"}
diff --git a/src/hooks/past-data.jsx b/src/hooks/past-data.jsx new file mode 100644 index 0000000..590c9da --- /dev/null +++ b/src/hooks/past-data.jsx @@ -0,0 +1,22 @@ +import { useEffect, useState } from "react"; + +const usePastData = ({ round, ghostLegion, year = 2023 }) => { + const [pastData, setPastData] = useState({}); + + useEffect(() => { + const fetchPastLeaderboadData = async () => { + let path = round == 1 ? "round1" : ghostLegion == true ? "ghost-legion" : "final"; + const data = (await import(`../../data/annual-leaderboard/${year}/${path}.json`)).default; + // console.log('Before mapping', data); + const transformedData = data.map((item, index) => ({ ...item, place: index + 1 })); + // console.log('After mapping', data); + setPastData(transformedData); + }; + + fetchPastLeaderboadData(); + }, [round, ghostLegion]); + + return pastData; +}; + +export default usePastData; diff --git a/src/pages/hall-of-fame.jsx b/src/pages/hall-of-fame.jsx index ec24738..4c7cb95 100644 --- a/src/pages/hall-of-fame.jsx +++ b/src/pages/hall-of-fame.jsx @@ -4,7 +4,7 @@ import { ScoreCardSkeleton } from "@/components"; import { ScoreCard } from "@/components/home"; import { filters as filterData, sorts as sortData } from "@/filters"; import { useTitle } from "@/hooks"; -import { computePastLeaderboardDataPath } from "@/utils/compute-data-path"; +import usePastData from "@/hooks/past-data"; import { AnimatedSwitcher, Filters, @@ -22,20 +22,12 @@ const HallOfFame = () => { const [page, setPage] = useState(1); const [filters, setFilters] = useState(computeFilterQuery(filterData)); const [sorts, setSorts] = useState(computeSortQuery(sortData)); - const [scores, setScores] = useState({}); - const { rounds, round, roundKey, onRoundChange } = useRound(); const { ghostLegion, toggleGhostLegion } = useGhostLegion(); - const dataPath = computePastLeaderboardDataPath({ page, filters, sorts, round, ghostLegion, year: 2023 }); - - useEffect(() => { - const fetchPastLeaderboadData = async () => { - const data = (await import(`../../data/annual-leaderboard/${dataPath}.json`)).default; - setScores(data); - }; - - fetchPastLeaderboadData(); - }, [dataPath]); + const scores = usePastData({ + round, + ghostLegion + }); useEffect(() => { if (page !== 1) setPage(1); diff --git a/src/utils/compute-data-path.js b/src/utils/compute-data-path.js deleted file mode 100644 index e4e732b..0000000 --- a/src/utils/compute-data-path.js +++ /dev/null @@ -1,5 +0,0 @@ -export const computePastLeaderboardDataPath = ({ page, filters, sorts, round, ghostLegion, year }) => { - const round2Path = ghostLegion == true ? "/ghost-legion" : "/final"; - const path = `${year}/round${round}${round == 1 ? "" : round2Path}`; - return path; -};