The tests now update live

client/src/components/LatestTestComponent.js

@@ -12,7 +12,7 @@ function LatestTestComponent() {
     const [setDialog] = useContext(DialogContext);
     const config = useContext(ConfigContext);
 
-    useEffect(() => {
+    function updateTest() {
         let passwordHeaders = localStorage.getItem("password") ? {password: localStorage.getItem("password")} : {}
         fetch("/api/speedtests/latest", {headers: passwordHeaders})
             .then(res => res.json())
@@ -20,13 +20,17 @@ function LatestTestComponent() {
                 setLatest(latest);
                 setLatestTestTime(generateRelativeTime(latest.created));
             });
+    }
+
+    useEffect(() => {
+        const interval = setInterval(() => updateTest(), 15000);
+        updateTest();
+        return () => clearInterval(interval);
     }, [setLatest]);
 
     useEffect(() => {
         const interval = setInterval(() => setLatestTestTime(generateRelativeTime(latest.created)), 1000);
-        return () => {
-            clearInterval(interval);
-        };
+        return () => clearInterval(interval);
     }, [setLatestTestTime, latest]);
 
     if (Object.entries(config).length === 0) return (<></>)

client/src/components/TestAreaComponent.js

@@ -7,11 +7,17 @@ function TestArea() {
     const config = useContext(ConfigContext);
     const [tests, setTests] = useState([]);
 
-    useEffect(() => {
+    function updateTests() {
         let passwordHeaders = localStorage.getItem("password") ? {password: localStorage.getItem("password")} : {}
         fetch("/api/speedtests", {headers: passwordHeaders})
             .then(res => res.json())
-            .then(tests => setTests(tests));
+            .then(tests => setTests(tests))
+    }
+
+    useEffect(() => {
+        const interval = setInterval(() => updateTests(), 15000);
+        updateTests();
+        return () => clearInterval(interval);
     }, [setTests]);
 
     if (Object.entries(config).length === 0) return (<></>)