diff --git a/projects/website/src/components/leaderboard/leaderboard-data.tsx b/projects/website/src/components/leaderboard/leaderboard-data.tsx index 22460a4..a422dbc 100644 --- a/projects/website/src/components/leaderboard/leaderboard-data.tsx +++ b/projects/website/src/components/leaderboard/leaderboard-data.tsx @@ -30,15 +30,18 @@ type LeaderboardDataProps = { export function LeaderboardData({ initialPage, initialScores, initialLeaderboard }: LeaderboardDataProps) { const [beatSaverMap, setBeatSaverMap] = useState(); const [selectedLeaderboardId, setSelectedLeaderboardId] = useState(initialLeaderboard.id); - const [currentLeaderboard, setCurrentLeaderboard] = useState(initialLeaderboard); - const { data: leaderboard } = useQuery({ - queryKey: ["leaderboard-" + initialLeaderboard.id, selectedLeaderboardId], + let currentLeaderboard = initialLeaderboard; + const { data } = useQuery({ + queryKey: ["leaderboard", selectedLeaderboardId], queryFn: () => scoresaberService.lookupLeaderboard(selectedLeaderboardId + ""), initialData: initialLeaderboard, - staleTime: 30 * 1000, // Cache data for 30 seconds }); + if (data) { + currentLeaderboard = data; + } + const fetchBeatSaverData = useCallback(async () => { const beatSaverMap = await lookupBeatSaverMap(initialLeaderboard.songHash); setBeatSaverMap(beatSaverMap); @@ -48,16 +51,6 @@ export function LeaderboardData({ initialPage, initialScores, initialLeaderboard fetchBeatSaverData(); }, [fetchBeatSaverData]); - /** - * When the leaderboard changes, update the previous and current leaderboards. - * This is to prevent flickering between leaderboards. - */ - useEffect(() => { - if (leaderboard) { - setCurrentLeaderboard(leaderboard); - } - }, [leaderboard]); - if (!currentLeaderboard) { return null; } diff --git a/projects/website/src/components/leaderboard/leaderboard-scores.tsx b/projects/website/src/components/leaderboard/leaderboard-scores.tsx index b16df40..43fe3ea 100644 --- a/projects/website/src/components/leaderboard/leaderboard-scores.tsx +++ b/projects/website/src/components/leaderboard/leaderboard-scores.tsx @@ -106,6 +106,7 @@ export default function LeaderboardScores({ setSelectedLeaderboardId(id); setCurrentPage(1); + // Call the leaderboard changed callback if (leaderboardChanged) { leaderboardChanged(id); }