From 9c3e5686f36bc4ba76d510f27adc89f378a3a658 Mon Sep 17 00:00:00 2001
From: Wolfboy248 <121288977+Wolfboy248@users.noreply.github.com>
Date: Tue, 10 Dec 2024 07:16:37 +0100
Subject: fix/frontend: map pagination fix (#246)

---
 frontend/src/components/Leaderboards.tsx | 21 +++++++++++++++++----
 1 file changed, 17 insertions(+), 4 deletions(-)

(limited to 'frontend/src/components/Leaderboards.tsx')

diff --git a/frontend/src/components/Leaderboards.tsx b/frontend/src/components/Leaderboards.tsx
index 4a8b463..fb614fa 100644
--- a/frontend/src/components/Leaderboards.tsx
+++ b/frontend/src/components/Leaderboards.tsx
@@ -1,20 +1,33 @@
 import React from 'react';
-import { Link } from 'react-router-dom';
+import { Link, useNavigate } from 'react-router-dom';
 
 import { DownloadIcon, ThreedotIcon } from '@images/Images';
 import { MapLeaderboard } from '@customTypes/Map';
 import { ticks_to_time, time_ago } from '@utils/Time';
+import { API } from "@api/Api";
 import useMessage from "@hooks/UseMessage";
 import "@css/Maps.css"
 
 interface LeaderboardsProps {
-  data?: MapLeaderboard;
+	mapID: string;
 }
 
-const Leaderboards: React.FC<LeaderboardsProps> = ({ data }) => {
+const Leaderboards: React.FC<LeaderboardsProps> = ({ mapID }) => {
+  const navigate = useNavigate();
+  const [data, setData] = React.useState<MapLeaderboard | undefined>(undefined);
+  const [pageNumber, setPageNumber] = React.useState<number>(1);
+
+  const _fetch_map_leaderboards = async () => {
+    const mapLeaderboards = await API.get_map_leaderboard(mapID, pageNumber.toString());
+    setData(mapLeaderboards);
+  };
 
   const { message, MessageDialogComponent } = useMessage();
-  const [pageNumber, setPageNumber] = React.useState<number>(1);
+
+  React.useEffect(() => {
+	  _fetch_map_leaderboards();
+	  console.log(data);
+  }, [pageNumber, navigate])
 
   if (!data) {
     return (
-- 
cgit v1.2.3