Merge pull request #573 from bugout-dev/status-with-monitoring-server

Updated status page for monitoring server

frontend/pages/status/index.js

@@ -18,40 +18,39 @@ const Status = () => {
 
   const {
     serverListStatusCache,
-    crawlersStatusCache,
-    dbServerStatusCache,
-    latestBlockDBStatusCache,
   } = useStatus();
 
+  console.log(serverListStatusCache?.data);
+
   const moonstreamapiStatus = serverListStatusCache?.data?.filter(
-    (i) => i.status.name === "moonstreamapi"
+    (i) => i.name === "moonstream_api"
   )[0];
   const moonstreamCrawlersStatus = serverListStatusCache?.data?.filter(
-    (i) => i.status.name === "moonstream_crawlers"
+    (i) => i.name === "moonstream_crawlers"
+  )[0];
+  const nodeBalacerStatus = serverListStatusCache?.data?.filter(
+    (i) => i.name === "moonstream_node_balancer"
   )[0];
   const nodeEthereumAStatus = serverListStatusCache?.data?.filter(
-    (i) => i.status.name === "node_ethereum_a"
-  )[0];
-  const nodeEthereumAGeth = serverListStatusCache?.data?.filter(
-    (i) => i.status.name === "node_ethereum_a_geth"
+    (i) => i.name === "node_ethereum_a"
   )[0];
   const nodeEthereumBStatus = serverListStatusCache?.data?.filter(
-    (i) => i.status.name === "node_ethereum_b"
-  )[0];
-  const nodeEthereumBGeth = serverListStatusCache?.data?.filter(
-    (i) => i.status.name === "node_ethereum_b_geth"
+    (i) => i.name === "node_ethereum_b"
   )[0];
   const nodePolygonAStatus = serverListStatusCache?.data?.filter(
-    (i) => i.status.name === "node_polygon_a"
-  )[0];
-  const nodePolygonAGeth = serverListStatusCache?.data?.filter(
-    (i) => i.status.name === "node_polygon_a_bor"
+    (i) => i.name === "node_polygon_a"
   )[0];
   const nodePolygonBStatus = serverListStatusCache?.data?.filter(
-    (i) => i.status.name === "node_polygon_b"
+    (i) => i.name === "node_polygon_b"
   )[0];
-  const nodePolygonBGeth = serverListStatusCache?.data?.filter(
-    (i) => i.status.name === "node_polygon_b_bor"
+  const dbServerStatus = serverListStatusCache?.data?.filter(
+    (i) => i.name === "moonstream_database"
+  )[0];
+  const dbReplicaServerStatus = serverListStatusCache?.data?.filter(
+    (i) => i.name === "moonstream_database_replica"
+  )[0];
+  const unimLeaderboardStatus = serverListStatusCache?.data?.filter(
+    (i) => i.name === "unim_leaderboard"
   )[0];
 
   const StatusRow = (props) => {
@@ -80,12 +79,12 @@ const Status = () => {
         <StatusRow title="Backend server" cache={serverListStatusCache}>
           <Text
             color={
-              moonstreamapiStatus?.status.body.status == "ok"
+              moonstreamapiStatus?.status_code == 200
                 ? healthyStatusColor
                 : downStatusColor
             }
           >
-            {moonstreamapiStatus?.status.body.status == "ok"
+            {moonstreamapiStatus?.status_code == 200
               ? healthyStatusText
               : downStatusText}
           </Text>
@@ -93,42 +92,33 @@ const Status = () => {
 
         <br />
 
-        <StatusRow title="Crawlers server" cache={crawlersStatusCache}>
+        <StatusRow title="Crawlers server" cache={serverListStatusCache}>
           <Text
             color={
-              moonstreamCrawlersStatus?.status.body.status == "ok"
+              moonstreamCrawlersStatus?.status_code == 200
                 ? healthyStatusColor
                 : downStatusColor
             }
           >
-            {moonstreamCrawlersStatus?.status.body.status == "ok"
+            {moonstreamCrawlersStatus?.status_code == 200
               ? healthyStatusText
               : downStatusText}
           </Text>
         </StatusRow>
-        <StatusRow title="Txpool latest record ts" cache={crawlersStatusCache}>
-          <Text>
-            {!user
-              ? crawlersStatusCache?.data?.ethereum_txpool_timestamp
-                ? shortTimestamp(
-                    crawlersStatusCache?.data?.ethereum_txpool_timestamp
-                  )
-                : downStatusText
-              : unauthorizedText}
-          </Text>
-        </StatusRow>
-        <StatusRow
-          title="Trending latest record ts"
-          cache={crawlersStatusCache}
-        >
-          <Text>
-            {!user
-              ? crawlersStatusCache?.data?.ethereum_trending_timestamp
-                ? shortTimestamp(
-                    crawlersStatusCache?.data?.ethereum_trending_timestamp
-                  )
-                : downStatusText
-              : unauthorizedText}
+
+        <br />
+
+        <StatusRow title="Node balancer server" cache={serverListStatusCache}>
+          <Text
+            color={
+              nodeBalacerStatus?.status_code == 200
+                ? healthyStatusColor
+                : downStatusColor
+            }
+          >
+            {nodeBalacerStatus?.status_code == 200
+              ? healthyStatusText
+              : downStatusText}
           </Text>
         </StatusRow>
 
@@ -137,20 +127,20 @@ const Status = () => {
         <StatusRow title="Node Ethereum A" cache={serverListStatusCache}>
           <Text
             color={
-              nodeEthereumAStatus?.status.body.status == "ok"
+              nodeEthereumAStatus?.status_code == 200
                 ? healthyStatusColor
                 : downStatusColor
             }
           >
-            {nodeEthereumAStatus?.status.body.status == "ok"
+            {nodeEthereumAStatus?.status_code == 200
               ? healthyStatusText
               : downStatusText}
           </Text>
         </StatusRow>
         <StatusRow title="Current block" cache={serverListStatusCache}>
           <Text>
-            {nodeEthereumAGeth?.status.body.current_block
-              ? nodeEthereumAGeth.status.body.current_block
+            {nodeEthereumAStatus?.response?.current_block
+              ? nodeEthereumAStatus.response.current_block
               : 0}
           </Text>
         </StatusRow>
@@ -158,20 +148,20 @@ const Status = () => {
         <StatusRow title="Node Ethereum B" cache={serverListStatusCache}>
           <Text
             color={
-              nodeEthereumBStatus?.status.body.status == "ok"
+              nodeEthereumBStatus?.status_code == 200
                 ? healthyStatusColor
                 : downStatusColor
             }
           >
-            {nodeEthereumBStatus?.status.body.status == "ok"
+            {nodeEthereumBStatus?.status_code == 200
               ? healthyStatusText
               : downStatusText}
           </Text>
         </StatusRow>
         <StatusRow title="Current block" cache={serverListStatusCache}>
           <Text>
-            {nodeEthereumBGeth?.status.body.current_block
-              ? nodeEthereumBGeth.status.body.current_block
+            {nodeEthereumBStatus?.response?.current_block
+              ? nodeEthereumBStatus.response.current_block
               : 0}
           </Text>
         </StatusRow>
@@ -179,20 +169,20 @@ const Status = () => {
         <StatusRow title="Node Polygon A" cache={serverListStatusCache}>
           <Text
             color={
-              nodePolygonAStatus?.status.body.status == "ok"
+              nodePolygonAStatus?.status_code == 200
                 ? healthyStatusColor
                 : downStatusColor
             }
           >
-            {nodePolygonAStatus?.status.body.status == "ok"
+            {nodePolygonAStatus?.status_code == 200
               ? healthyStatusText
               : downStatusText}
           </Text>
         </StatusRow>
         <StatusRow title="Current block" cache={serverListStatusCache}>
           <Text>
-            {nodePolygonAGeth?.status.body.current_block
-              ? nodePolygonAGeth.status.body.current_block
+            {nodePolygonAStatus?.response?.current_block
+              ? nodePolygonAStatus.response.current_block
               : 0}
           </Text>
         </StatusRow>
@@ -200,49 +190,111 @@ const Status = () => {
         <StatusRow title="Node Polygon B" cache={serverListStatusCache}>
           <Text
             color={
-              nodePolygonBStatus?.status.body.status == "ok"
+              nodePolygonBStatus?.status_code == 200
                 ? healthyStatusColor
                 : downStatusColor
             }
           >
-            {nodePolygonBStatus?.status.body.status == "ok"
+            {nodePolygonBStatus?.status_code == 200
               ? healthyStatusText
               : downStatusText}
           </Text>
         </StatusRow>
         <StatusRow title="Current block" cache={serverListStatusCache}>
           <Text>
-            {nodePolygonBGeth?.status.body.current_block
-              ? nodePolygonBGeth.status.body.current_block
+            {nodePolygonBStatus?.response?.current_block
+              ? nodePolygonBStatus.response.current_block
               : 0}
           </Text>
         </StatusRow>
 
         <br />
 
-        <StatusRow title="Database server" cache={dbServerStatusCache}>
+        <StatusRow title="Database server" cache={serverListStatusCache}>
           <Text
             color={
-              dbServerStatusCache?.data?.status == "ok"
+              dbServerStatus?.status_code == 200
                 ? healthyStatusColor
                 : downStatusColor
             }
           >
-            {dbServerStatusCache?.data?.status == "ok"
+            {dbServerStatus?.status_code == 200
               ? healthyStatusText
               : downStatusText}
           </Text>
         </StatusRow>
         <StatusRow
-          title="Latest block in Database"
-          cache={latestBlockDBStatusCache}
+          title="Ethereum latest block"
+          cache={serverListStatusCache}
         >
           <Text>
-            {latestBlockDBStatusCache?.data?.block_number
-              ? latestBlockDBStatusCache.data.block_number
+            {dbServerStatus?.response?.ethereum_block_latest
+              ? dbServerStatus.response.ethereum_block_latest
               : 0}
           </Text>
         </StatusRow>
+        <StatusRow
+          title="Polygon latest block"
+          cache={serverListStatusCache}
+        >
+          <Text>
+            {dbServerStatus?.response?.polygon_block_latest
+              ? dbServerStatus.response.polygon_block_latest
+              : 0}
+          </Text>
+        </StatusRow>
+
+        <br />
+
+        <StatusRow title="Database replica server" cache={serverListStatusCache}>
+          <Text
+            color={
+              dbReplicaServerStatus?.status_code == 200
+                ? healthyStatusColor
+                : downStatusColor
+            }
+          >
+            {dbReplicaServerStatus?.status_code == 200
+              ? healthyStatusText
+              : downStatusText}
+          </Text>
+        </StatusRow>
+        <StatusRow
+          title="Ethereum latest block"
+          cache={serverListStatusCache}
+        >
+          <Text>
+            {dbReplicaServerStatus?.response?.ethereum_block_latest
+              ? dbReplicaServerStatus.response.ethereum_block_latest
+              : 0}
+          </Text>
+        </StatusRow>
+        <StatusRow
+          title="Polygon latest block"
+          cache={serverListStatusCache}
+        >
+          <Text>
+            {dbReplicaServerStatus?.response?.polygon_block_latest
+              ? dbReplicaServerStatus.response.polygon_block_latest
+              : 0}
+          </Text>
+        </StatusRow>
+
+        <br />
+
+        <StatusRow title="Unim Leaderboard server" cache={serverListStatusCache}>
+          <Text
+            color={
+              unimLeaderboardStatus?.status_code == 200
+                ? healthyStatusColor
+                : downStatusColor
+            }
+          >
+            {unimLeaderboardStatus?.status_code == 200
+              ? healthyStatusText
+              : downStatusText}
+          </Text>
+        </StatusRow>
       </chakra.span>
     </>
   );

frontend/sample.env

@@ -2,7 +2,6 @@ export NEXT_PUBLIC_MIXPANEL_TOKEN="<YOUR MIXPANEL TOKEN HERE>"
 export NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY="<stripe publishable key>"
 export NEXT_PUBLIC_BUGOUT_STATUS_URL=https://status.moonstream.to
 export NEXT_PUBLIC_MOONSTREAM_API_URL=https://api.moonstream.to
-export NEXT_PUBLIC_MOONSTREAM_DB_URL=https://pg.moonstream.to
 export NEXT_PUBLIC_SIMIOTICS_AUTH_URL=https://auth.bugout.dev
 export NEXT_PUBLIC_SIMIOTICS_JOURNALS_URL=https://spire.bugout.dev
 export NEXT_PUBLIC_FRONTEND_VERSION="<frontend_version_number>"

frontend/src/core/hooks/useStatus.js

@@ -7,18 +7,6 @@ const useStatus = () => {
     const response = await StatusService.serverListStatus();
     return response.data;
   };
-  const getCrawlersStatus = async () => {
-    const response = await StatusService.crawlersStatus();
-    return response.data;
-  };
-  const getDBServerStatus = async () => {
-    const response = await StatusService.dbServerStatus();
-    return response.data;
-  };
-  const getLatestBlockDBStatus = async () => {
-    const response = await StatusService.latestBlockDBStatus();
-    return response.data;
-  };
 
   const serverListStatusCache = useQuery(
     "serverListStatus",
@@ -28,28 +16,9 @@ const useStatus = () => {
       retry: 0,
     }
   );
-  const crawlersStatusCache = useQuery("crawlers", getCrawlersStatus, {
-    ...queryCacheProps,
-    retry: 0,
-  });
-  const dbServerStatusCache = useQuery("dbServer", getDBServerStatus, {
-    ...queryCacheProps,
-    retry: 0,
-  });
-  const latestBlockDBStatusCache = useQuery(
-    "latestBlockDB",
-    getLatestBlockDBStatus,
-    {
-      ...queryCacheProps,
-      retry: 0,
-    }
-  );
 
   return {
     serverListStatusCache,
-    crawlersStatusCache,
-    dbServerStatusCache,
-    latestBlockDBStatusCache,
   };
 };
 

frontend/src/core/services/status.service.js

@@ -1,33 +1,10 @@
 import { http } from "../utils";
 
 const BUGOUT_STATUS_URL = process.env.NEXT_PUBLIC_BUGOUT_STATUS_URL;
-const API_URL = process.env.NEXT_PUBLIC_MOONSTREAM_API_URL;
-const DB_URL = process.env.NEXT_PUBLIC_MOONSTREAM_DB_URL;
 
 export const serverListStatus = () => {
   return http({
     method: "GET",
-    url: `${BUGOUT_STATUS_URL}`,
-  });
-};
-
-export const crawlersStatus = () => {
-  return http({
-    method: "GET",
-    url: `${API_URL}/status`,
-  });
-};
-
-export const dbServerStatus = () => {
-  return http({
-    method: "GET",
-    url: `${DB_URL}/ping`,
-  });
-};
-
-export const latestBlockDBStatus = () => {
-  return http({
-    method: "GET",
-    url: `${DB_URL}/block/latest`,
+    url: `${BUGOUT_STATUS_URL}/status`,
   });
 };