From 7f0ad72b22a58f338a1372712a83b0ce067a3ac4 Mon Sep 17 00:00:00 2001
From: Jennifer Echenim <echenimjennifer@gmail.com>
Date: Wed, 17 Jan 2024 13:18:17 +0400
Subject: [PATCH] Refactor testnet status update  (#1748)

* update testnet status display in the health indicator
---
 tools/tenscan/frontend/api/general.ts         |  4 ++--
 .../src/components/health-indicator.tsx       | 20 ++++++++++++++----
 .../src/services/useGeneralService.ts         | 12 +++--------
 .../frontend/src/types/interfaces/index.ts    |  1 +
 .../src/components/health-indicator.tsx       | 21 +++++++++++++------
 5 files changed, 37 insertions(+), 21 deletions(-)

diff --git a/tools/tenscan/frontend/api/general.ts b/tools/tenscan/frontend/api/general.ts
index 88324a5255..07c2aec2e3 100644
--- a/tools/tenscan/frontend/api/general.ts
+++ b/tools/tenscan/frontend/api/general.ts
@@ -4,9 +4,9 @@ import { pathToUrl } from "@/src/routes/router";
 import { apiRoutes } from "@/src/routes";
 
 export const fetchTestnetStatus = async (): Promise<
-  ResponseDataInterface<any>
+  ResponseDataInterface<boolean>
 > => {
-  return await httpRequest<ResponseDataInterface<any>>({
+  return await httpRequest<ResponseDataInterface<boolean>>({
     method: "post",
     url: pathToUrl(apiRoutes.getHealthStatus),
     data: { jsonrpc: "2.0", method: "obscuro_health", params: [], id: 1 },
diff --git a/tools/tenscan/frontend/src/components/health-indicator.tsx b/tools/tenscan/frontend/src/components/health-indicator.tsx
index 532049146c..4dd21804cd 100644
--- a/tools/tenscan/frontend/src/components/health-indicator.tsx
+++ b/tools/tenscan/frontend/src/components/health-indicator.tsx
@@ -3,19 +3,31 @@ import { Badge, badgeVariants } from "./ui/badge";
 import { useGeneralService } from "../services/useGeneralService";
 
 const HealthIndicator = () => {
+  const [status, setStatus] = React.useState<boolean>(false);
   const { testnetStatus } = useGeneralService();
 
+  // if testnetStatus.result is true, status is set to true
+  // if testnetStatus.result is false but testnetStatus.error includes [p2p], status is set to true
+
+  React.useEffect(() => {
+    if (testnetStatus?.result) {
+      setStatus(true);
+    } else if (testnetStatus?.errors?.includes("[p2p]")) {
+      setStatus(true);
+    } else {
+      setStatus(false);
+    }
+  }, [testnetStatus]);
+
   return (
     <div className="flex items-center space-x-2 border rounded-lg p-2">
       <h3 className="text-sm">Testnet Status: </h3>
       <Badge
         variant={
-          (testnetStatus?.result
-            ? "success"
-            : "destructive") as keyof typeof badgeVariants
+          (status ? "success" : "destructive") as keyof typeof badgeVariants
         }
       >
-        {testnetStatus?.result ? "Live" : "Down"}
+        {status ? "Live" : "Down"}
       </Badge>
     </div>
   );
diff --git a/tools/tenscan/frontend/src/services/useGeneralService.ts b/tools/tenscan/frontend/src/services/useGeneralService.ts
index f82c686456..148989d10d 100644
--- a/tools/tenscan/frontend/src/services/useGeneralService.ts
+++ b/tools/tenscan/frontend/src/services/useGeneralService.ts
@@ -3,17 +3,11 @@ import { useQuery } from "@tanstack/react-query";
 import { useState } from "react";
 
 export const useGeneralService = () => {
-  const [noPolling, setNoPolling] = useState(false);
-
-  const {
-    data: testnetStatus,
-    isLoading: isStatusLoading,
-    refetch: refetchTestnetStatus,
-  } = useQuery({
+  const { data: testnetStatus, isLoading: isStatusLoading } = useQuery({
     queryKey: ["testnetStatus"],
     queryFn: () => fetchTestnetStatus(),
-    // refetchInterval: noPolling ? false : pollingInterval,
+    refetchInterval: 10000,
   });
 
-  return { testnetStatus, isStatusLoading, setNoPolling, refetchTestnetStatus };
+  return { testnetStatus, isStatusLoading };
 };
diff --git a/tools/tenscan/frontend/src/types/interfaces/index.ts b/tools/tenscan/frontend/src/types/interfaces/index.ts
index 5f626114df..923786fedc 100644
--- a/tools/tenscan/frontend/src/types/interfaces/index.ts
+++ b/tools/tenscan/frontend/src/types/interfaces/index.ts
@@ -57,6 +57,7 @@ export interface PaginationInterface {
 
 export interface ResponseDataInterface<T> {
   result: T;
+  errors?: string[] | string;
   item: T;
   message: string;
   pagination?: PaginationInterface;
diff --git a/tools/walletextension/frontend/src/components/health-indicator.tsx b/tools/walletextension/frontend/src/components/health-indicator.tsx
index 8242ca8fee..772be3e006 100644
--- a/tools/walletextension/frontend/src/components/health-indicator.tsx
+++ b/tools/walletextension/frontend/src/components/health-indicator.tsx
@@ -12,6 +12,7 @@ const HealthIndicator = () => {
     setLoading(true);
     try {
       const status = await getTestnetStatus();
+
       return status;
     } catch (error) {
       console.error(error);
@@ -20,18 +21,26 @@ const HealthIndicator = () => {
     }
   };
 
-  // using useRef to avoid memory leak
-  let isMounted = React.useRef(true);
-
   useEffect(() => {
+    let isMounted = true;
+
+    // if overall health is true, status is set to true
+    // if overall health is false but if the error includes [p2p], status is set to true
+
     testnetStatus().then((res) => {
-      if (isMounted.current) {
-        setStatus(res?.result);
+      if (isMounted) {
+        if (res?.result?.OverallHealth) {
+          setStatus(true);
+        } else if (res?.result?.Errors?.includes("[p2p]")) {
+          setStatus(true);
+        } else {
+          setStatus(false);
+        }
       }
     });
 
     return () => {
-      isMounted.current = false;
+      isMounted = false;
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);