Merge pull request #105 from MegaAntiCheat/fix/ImproperIntervals

Backend reconnect polling: modify polling behaviour to prevent async spam

Author: meatmeatmeatmeatmeatmeat

src/App/App.tsx

@@ -91,6 +91,7 @@ const ConfigurationModal = ({ closeModal }: ConfigurationModalProps) => {
 
 function App() {
   const { isMinimode } = useMinimode();
+  const [isDead, setDead] = React.useState(false);
   const [currentPage, setCurrentPage] = React.useState(PAGES.PLAYER_LIST);
 
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -138,17 +139,15 @@ function App() {
   };
 
   const verificationRoutine = async () => {
-    let connected = false;
-    let dead = false;
-    do {
-      connected = await isBackendConnected();
-      if (!connected) {
-        dead = true;
-        await new Promise((resolve) => setTimeout(resolve, 1000)); // Wait 1 second before retrying
+    if (await isBackendConnected()) {
+      if (isDead) {
+        setDead(false);
+        closeModal();
       }
-    } while (!connected);
-    if (dead) closeModal(); // If backend died, we need to remove the modal once it recovers.
-    verifyConfigured();
+      verifyConfigured();
+    } else {
+      if (!isDead) setDead(true);
+    }
   };
 
   React.useEffect(() => {
@@ -163,14 +162,12 @@ function App() {
 
     // Don't verify backend if we're using fakedata (dev environment)
     if (useFakedata) return;
-
-    verificationRoutine();
     const intervalId = setInterval(verificationRoutine, 1000);
 
     return () => {
       clearInterval(intervalId);
     };
-  }, [currentPage]);
+  }, [currentPage, isDead]);
 
   return (
     <div className="App">

src/api/globals/index.ts

@@ -15,9 +15,13 @@ export const COMMAND_ENDPOINT = `${APIURL}/commands/v1`;
 export const useFakedata = process.env.NODE_ENV?.includes('development');
 
 export async function verifyBackend(): Promise<boolean> {
-  return await fetch(SERVERFETCH)
+  const controller = new AbortController();
+  const timeoutId = setTimeout(() => controller.abort(), 500);
+
+  return await fetch(SERVERFETCH, { signal: controller.signal })
     .then((res) => res.ok)
-    .catch(() => false);
+    .catch(() => false)
+    .finally(() => clearTimeout(timeoutId));
 }
 
 export async function isBackendConfigured(): Promise<boolean> {