update lobbies and ongoing games (#191)

SWU-Karabast · Mar 6, 2025 · e21f085 · e21f085
1 parent 1d7e257
commit e21f085
Show file tree

Hide file tree

Showing 2 changed files with 71 additions and 24 deletions.
diff --git a/src/app/_components/HomePage/PublicGames/PublicGames.tsx b/src/app/_components/HomePage/PublicGames/PublicGames.tsx
@@ -5,24 +5,48 @@ import GamesInProgress from '../_subcomponents/GamesInProgress/GamesInProgress';
 import { ILobby } from '../HomePageTypes';
 import { SwuGameFormat } from '@/app/_constants/constants';
 
+const fetchLobbies = async (setLobbies: (lobbies: ILobby[]) => void) => {
+    try {
+        const response = await fetch(`${process.env.NEXT_PUBLIC_ROOT_URL}/api/available-lobbies`);
+        if (!response.ok) {
+            throw new Error(`Error fetching lobbies: ${response.statusText}`);
+        }
+        const data: ILobby[] = await response.json();
+        setLobbies(data);
+    } catch (error) {
+        console.error('Error fetching lobbies:', error);
+    }
+};
+
 const PublicGames: React.FC = () => {
     const [lobbies, setLobbies] = useState<ILobby[]>([]);
+
     useEffect(() => {
-        // Fetch unfilled lobbies from the server
-        const fetchLobbies = async () => {
-            try {
-                const response = await fetch(`${process.env.NEXT_PUBLIC_ROOT_URL}/api/available-lobbies`);
-                if (!response.ok) {
-                    throw new Error(`Error fetching lobbies: ${response.statusText}`);
-                }
-                const data: ILobby[] = await response.json();
-                setLobbies(data);
-            } catch (error) {
-                console.error('Error fetching lobbies:', error);
+        let count = 0;
+        let intervalId: NodeJS.Timeout;
+
+        const fetchData = () => {
+            fetchLobbies(setLobbies);
+            count++;
+
+            if (count === 6) { 
+                clearInterval(intervalId);
+                intervalId = setInterval(() => {
+                    fetchLobbies(setLobbies);
+                    count++;
+                    if (count === 15) {
+                        clearInterval(intervalId); 
+                    }
+                }, 60000); 
             }
         };
-        fetchLobbies();
+
+        fetchData();
+        intervalId = setInterval(fetchData, 10000); 
+
+        return () => clearInterval(intervalId);
     }, []);
+
     const styles = {
         publicGamesWrapper: {
             height: '100%',

diff --git a/src/app/_components/HomePage/_subcomponents/GamesInProgress/GamesInProgress.tsx b/src/app/_components/HomePage/_subcomponents/GamesInProgress/GamesInProgress.tsx
@@ -1,7 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { Box, Divider, Typography } from '@mui/material';
 import PublicMatch from '../PublicMatch/PublicMatch';
-import { playerMatches } from '@/app/_constants/mockData';
 import { ICardData } from '@/app/_components/_sharedcomponents/Cards/CardTypes';
 
 interface GameCardData {
@@ -16,26 +15,50 @@ interface OngoingGamesData {
     ongoingGames: GameCardData[];
 }
 
+const fetchOngoingGames = async (setGamesData: (games: OngoingGamesData | null) => void) => {
+    try {
+        const response = await fetch(`${process.env.NEXT_PUBLIC_ROOT_URL}/api/ongoing-games`);
+
+        if (!response.ok) {
+            throw new Error(`Failed to fetch ongoing games: ${response.status} ${response.statusText}`);
+        }
+
+        const fetchedData: OngoingGamesData = await response.json(); // Expecting an array
+        setGamesData(fetchedData); // Store all games or set to null if empty
+    } catch (err) {
+        console.error('Error fetching ongoing games:', err);
+        setGamesData(null); // Handle error case
+    }
+};
+
+
 const GamesInProgress: React.FC = () => {
     const [gamesData, setGamesData] = useState<OngoingGamesData | null>(null);
 
     useEffect(() => {
-        const fetchOngoingGames = async () => {
-            try {
-                const response = await fetch(`${process.env.NEXT_PUBLIC_ROOT_URL}/api/ongoing-games`);
+        let count = 0;
+        let intervalId: NodeJS.Timeout;
 
-                if (!response.ok) {
-                    throw new Error(`Failed to fetch ongoing games: ${response.status} ${response.statusText}`);
-                }
+        const fetchData = () => {
+            fetchOngoingGames(setGamesData);
+            count++;
 
-                const data = await response.json();
-                setGamesData(data);
-            } catch (err) {
-                console.error('Error fetching ongoing games:', err);
+            if (count === 6) {
+                clearInterval(intervalId);
+                intervalId = setInterval(() => {
+                    fetchOngoingGames(setGamesData);
+                    count++;
+                    if (count === 15) {
+                        clearInterval(intervalId);
+                    }
+                }, 60000); // Fetch once per minute
             }
         };
 
-        fetchOngoingGames();
+        fetchData();
+        intervalId = setInterval(fetchData, 10000); // Fetch every 10 seconds
+
+        return () => clearInterval(intervalId);
     }, []);
 
     const styles = {