added ingress_rules refresh changes (#45)

Co-authored-by: Tanmoy Sarkar <[email protected]>

src/pages/ingress_rules.jsx

@@ -23,7 +23,12 @@ import {
 import { SyncIcon } from "@primer/octicons-react";
 import { useContext, useEffect, useState } from "react";
 import ControllerContext from "../context/controller/ControllerContext";
-import { formatReadableDate, showErrorToast, showSuccessToast } from "../utils";
+import {
+  formatReadableDate,
+  showErrorToast,
+  showSuccessToast,
+  runTaskAtInterval,
+} from "../utils";
 import tag_color from "../config/tag_color";
 import { AddIcon } from "@chakra-ui/icons";
 import AddIngressRulesModal from "../components/addIngressRulesModal";
@@ -94,6 +99,8 @@ export default function IngressRulesPage() {
 
   useEffect(() => {
     fetchRules();
+    const intervalID = runTaskAtInterval(fetchRules, 10000);
+    return () => clearInterval(intervalID);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 

src/pages/redirect_rules.jsx

@@ -22,7 +22,12 @@ import {
 import { SyncIcon } from "@primer/octicons-react";
 import { useContext, useEffect, useState } from "react";
 import ControllerContext from "../context/controller/ControllerContext";
-import { formatReadableDate, showErrorToast, showSuccessToast } from "../utils";
+import {
+  formatReadableDate,
+  showErrorToast,
+  showSuccessToast,
+  runTaskAtInterval,
+} from "../utils";
 import tag_color from "../config/tag_color";
 import { AddIcon } from "@chakra-ui/icons";
 import AddRedirectRulesModal from "../components/addRedirectRulesModal";
@@ -77,9 +82,8 @@ export default function RedirectRulesPage() {
 
   useEffect(() => {
     fetchRules();
-    setInterval(() => {
-      fetchRules();
-    }, 10000);
+    const intervalID = runTaskAtInterval(fetchRules, 10000);
+    return () => clearInterval(intervalID);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 

src/utils.js

@@ -34,4 +34,13 @@ export function showSuccessToast(toast, message){
     isClosable: true,
     position: "top"
   });
+}
+
+export function runTaskAtInterval(callback, interval) {
+  const intervalId = setInterval(() => {
+    callback(); // Call the provided callback function
+  }, interval);
+
+  // Return the interval ID in case you want to clear it later
+  return intervalId;
 }