From d6ffdb86ce04868bdcd54075ad704a732fc9a9be Mon Sep 17 00:00:00 2001
From: Gala <calero.vg@gmail.com>
Date: Thu, 20 Oct 2022 15:11:38 +0200
Subject: [PATCH] adding uptime chart

---
 explorer/src/components/Gateways.ts     |  2 +-
 explorer/src/context/gateway.tsx        | 19 ++++++++++---------
 explorer/src/pages/GateDetail/index.tsx |  6 +++---
 explorer/src/typeDefs/explorer-api.ts   |  8 --------
 4 files changed, 14 insertions(+), 21 deletions(-)

diff --git a/explorer/src/components/Gateways.ts b/explorer/src/components/Gateways.ts
index 0bf1de5b85..cecc2bd697 100644
--- a/explorer/src/components/Gateways.ts
+++ b/explorer/src/components/Gateways.ts
@@ -43,6 +43,6 @@ export function gatewayEnrichedToGridRow(
     clients_port: gateway.gateway.clients_port || 0,
     mix_port: gateway.gateway.mix_port || 0,
     routing_score: `${report.most_recent}%`,
-    avg_uptime: `${report.last_day}%`,
+    avg_uptime: `${report.last_day || report.last_hour}%`,
   };
 }
diff --git a/explorer/src/context/gateway.tsx b/explorer/src/context/gateway.tsx
index 5460be4b41..88c9f3b4c3 100644
--- a/explorer/src/context/gateway.tsx
+++ b/explorer/src/context/gateway.tsx
@@ -8,7 +8,7 @@ import { Api } from '../api';
 
 interface GatewayState {
   uptimeReport?: ApiState<GatewayReportResponse>;
-  //   uptimeStory?: ApiState<UptimeStoryResponse>;
+  uptimeStory?: ApiState<UptimeStoryResponse>;
 }
 
 export const GatewayContext = React.createContext<GatewayState>({});
@@ -31,27 +31,28 @@ export const GatewayContextProvider: React.FC<GatewayContextProviderProps> = ({
     'Failed to fetch gateway uptime report by id',
   );
 
-  //   const [uptimeStory, fetchUptimeHistory, clearUptimeHistory] = useApiState<UptimeStoryResponse>(
-  //     gatewayIdentityKey,
-  //     Api.fetchUptimeStoryById,
-  //     'Failed to fetch gateway uptime history',
-  //   );
+  const [uptimeStory, fetchUptimeHistory, clearUptimeHistory] = useApiState<UptimeStoryResponse>(
+    gatewayIdentityKey,
+    Api.fetchGatewayUptimeStoryById,
+    'Failed to fetch gateway uptime history',
+  );
 
   React.useEffect(() => {
     // when the identity key changes, remove all previous data
     clearUptimeReportById();
-    Promise.all([fetchUptimeReportById()]);
+    clearUptimeHistory();
+    Promise.all([fetchUptimeReportById(), fetchUptimeHistory()]);
   }, [gatewayIdentityKey]);
 
   const state = React.useMemo<GatewayState>(
     () => ({
       uptimeReport,
-      //   uptimeStory,
+      uptimeStory,
     }),
     [
       {
         uptimeReport,
-        // uptimeStory,
+        uptimeStory,
       },
     ],
   );
diff --git a/explorer/src/pages/GateDetail/index.tsx b/explorer/src/pages/GateDetail/index.tsx
index a3298bbd33..a63bddc01e 100644
--- a/explorer/src/pages/GateDetail/index.tsx
+++ b/explorer/src/pages/GateDetail/index.tsx
@@ -68,7 +68,7 @@ const PageGatewayDetailsWithState: React.FC<{ selectedGateway: GatewayResponseIt
 }) => {
   const [enrichGateway, setEnrichGateway] = React.useState<GatewayEnridedRowType>();
   const [status, setStatus] = React.useState<number[] | undefined>();
-  const { uptimeReport } = useGatewayContext();
+  const { uptimeReport, uptimeStory } = useGatewayContext();
 
   React.useEffect(() => {
     if (uptimeReport?.data && selectedGateway) {
@@ -119,12 +119,12 @@ const PageGatewayDetailsWithState: React.FC<{ selectedGateway: GatewayResponseIt
           )}
         </Grid>
         <Grid item xs={12} md={8}>
-          {/* {uptimeStory && (
+          {uptimeStory && (
             <ContentCard title="Routing Score">
               {uptimeStory.error && <ComponentError text="There was a problem retrieving routing score." />}
               <UptimeChart loading={uptimeStory.isLoading} xLabel="date" uptimeStory={uptimeStory} />
             </ContentCard>
-          )} */}
+          )}
         </Grid>
       </Grid>
     </Box>
diff --git a/explorer/src/typeDefs/explorer-api.ts b/explorer/src/typeDefs/explorer-api.ts
index f36aa2110f..b1d74e33ab 100644
--- a/explorer/src/typeDefs/explorer-api.ts
+++ b/explorer/src/typeDefs/explorer-api.ts
@@ -201,14 +201,6 @@ export type StatusResponse = {
   };
 };
 
-// export type UptimeReportResponse = {
-//   identity: string;
-//   owner: string;
-//   most_recent: number;
-//   last_hour: number;
-//   last_day: UseButtonParameters;
-// };
-
 export type UptimeTime = {
   date: string;
   uptime: number;