From 1b4e4aa81a5467ed1acbea38585a7b5c8d1e6a16 Mon Sep 17 00:00:00 2001
From: Levi Harrison <levisamuelharrison@gmail.com>
Date: Fri, 26 Mar 2021 15:47:54 -0400
Subject: [PATCH] Fix Blank TSDB Status Page (#8654)

* Check response and return alternate page if no statistics

Signed-off-by: Levi Harrison <git@leviharrison.dev>

* Added tests for alternate page

Signed-off-by: Levi Harrison <git@leviharrison.dev>

* Change error handling in unixToTime

Signed-off-by: Levi Harrison <git@leviharrison.dev>
---
 .../src/pages/tsdbStatus/TSDBStatus.test.tsx  | 51 +++++++++++++++++++
 .../src/pages/tsdbStatus/TSDBStatus.tsx       |  8 ++-
 2 files changed, 58 insertions(+), 1 deletion(-)

diff --git a/web/ui/react-app/src/pages/tsdbStatus/TSDBStatus.test.tsx b/web/ui/react-app/src/pages/tsdbStatus/TSDBStatus.test.tsx
index f25c78427..b3f3162bf 100644
--- a/web/ui/react-app/src/pages/tsdbStatus/TSDBStatus.test.tsx
+++ b/web/ui/react-app/src/pages/tsdbStatus/TSDBStatus.test.tsx
@@ -51,6 +51,26 @@ const fakeTSDBStatusResponse: {
   },
 };
 
+const fakeEmptyTSDBStatusResponse: {
+  status: string;
+  data: TSDBMap;
+} = {
+  status: 'success',
+  data: {
+    headStats: {
+      numSeries: 0,
+      numLabelPairs: 0,
+      chunkCount: 0,
+      minTime: 9223372036854776000,
+      maxTime: -9223372036854776000,
+    },
+    labelValueCountByLabelName: [],
+    seriesCountByMetricName: [],
+    memoryInBytesByLabelName: [],
+    seriesCountByLabelValuePair: [],
+  },
+};
+
 describe('TSDB Stats', () => {
   beforeEach(() => {
     fetchMock.resetMocks();
@@ -111,4 +131,35 @@ describe('TSDB Stats', () => {
       }
     });
   });
+
+  it('No Data', async () => {
+    const mock = fetchMock.mockResponse(JSON.stringify(fakeEmptyTSDBStatusResponse));
+    let page: any;
+    await act(async () => {
+      page = mount(
+        <PathPrefixContext.Provider value="/path/prefix">
+          <TSDBStatus />
+        </PathPrefixContext.Provider>
+      );
+    });
+    page.update();
+
+    expect(mock).toHaveBeenCalledWith('/path/prefix/api/v1/status/tsdb', {
+      cache: 'no-store',
+      credentials: 'same-origin',
+    });
+
+    expect(page.find('h2').text()).toEqual('TSDB Status');
+
+    const headStats = page
+      .find(Table)
+      .at(0)
+      .find('tbody')
+      .find('td');
+    ['0', '0', '0', 'Error parsing time (9223372036854776000)', 'Error parsing time (-9223372036854776000)'].forEach(
+      (value, i) => {
+        expect(headStats.at(i).text()).toEqual(value);
+      }
+    );
+  });
 });
diff --git a/web/ui/react-app/src/pages/tsdbStatus/TSDBStatus.tsx b/web/ui/react-app/src/pages/tsdbStatus/TSDBStatus.tsx
index c124d7921..cebafcfaf 100644
--- a/web/ui/react-app/src/pages/tsdbStatus/TSDBStatus.tsx
+++ b/web/ui/react-app/src/pages/tsdbStatus/TSDBStatus.tsx
@@ -35,7 +35,13 @@ export const TSDBStatusContent: FC<TSDBMap> = ({
   memoryInBytesByLabelName,
   seriesCountByLabelValuePair,
 }) => {
-  const unixToTime = (unix: number): string => new Date(unix).toISOString();
+  const unixToTime = (unix: number): string => {
+    try {
+      return new Date(unix).toISOString();
+    } catch {
+      return 'Error parsing time';
+    }
+  };
   const { chunkCount, numSeries, numLabelPairs, minTime, maxTime } = headStats;
   const stats = [
     { header: 'Number of Series', value: numSeries },