Add error handler when fetching ppl (#204)

Signed-off-by: Joshua Li <joshuali925@gmail.com>
opensearch-project · Nov 8, 2021 · d61208c · d61208c
1 parent b2428bf
commit d61208c
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 23 deletions.
diff --git a/dashboards-observability/public/components/explorer/explorer.tsx b/dashboards-observability/public/components/explorer/explorer.tsx
@@ -309,7 +309,12 @@ export const Explorer = ({
       getAvailableFields(`search source=${curIndex}`);
     } else {
       findAutoInterval(curQuery![SELECTED_DATE_RANGE][0], curQuery![SELECTED_DATE_RANGE][1])
-      getEvents();
+      getEvents(undefined, (error) => {
+        setToast(
+          `Error fetching events: ${error?.body?.message || 'see console error for more details.'}`,
+          'danger'
+        );
+      });
       getCountVisualizations(minInterval);
     }
 

diff --git a/dashboards-observability/public/components/explorer/hooks/use_fetch_events.ts b/dashboards-observability/public/components/explorer/hooks/use_fetch_events.ts
@@ -52,13 +52,14 @@ export const useFetchEvents = ({
   const fetchEvents = async (
     { query }: { query: string },
     format: string,
-    handler: (res: any) => void
+    handler: (res: any) => void,
+    errorHandler?: (error: any) => void
   ) => {
     setIsEventsLoading(true);
     await pplService.fetch({
       query,
       format,
-    })
+    }, errorHandler)
     .then((res: any) => {
       handler(res);
     })
@@ -123,7 +124,7 @@ export const useFetchEvents = ({
     });
   };
 
-  const getEvents = (query: string = '') => {
+  const getEvents = (query: string = '', errorHandler?: (error: any) => void) => {
     const cur = queriesRef.current;
     const searchQuery = isEmpty(query) ? cur![requestParams.tabId][FINAL_QUERY] : query;
     fetchEvents({ query: searchQuery }, 'jdbc', (res: any) => {
@@ -132,7 +133,7 @@ export const useFetchEvents = ({
       }
       // when no hits and needs to get available fields to override default timestamp
       dispatchOnNoHis(res);
-    });
+    }, errorHandler);
   };
 
   const getAvailableFields = (query: string) => {

diff --git a/dashboards-observability/public/services/requests/ppl.ts b/dashboards-observability/public/services/requests/ppl.ts
@@ -10,30 +10,28 @@
  */
 
 import { CoreStart } from '../../../../../src/core/public';
-import {
-  PPL_BASE,
-  PPL_SEARCH
-} from '../../../common/constants/shared';
+import { PPL_BASE, PPL_SEARCH } from '../../../common/constants/shared';
 
 export default class PPLService {
   private http;
   constructor(http: CoreStart['http']) {
     this.http = http;
   }
-  
+
   fetch = async (
-    params: { 
-      query: string,
-      format: string,
-    }
+    params: {
+      query: string;
+      format: string;
+    },
+    errorHandler?: (error: any) => void
   ) => {
     return this.http
-            .post(
-              `${PPL_BASE}${PPL_SEARCH}`,
-              {
-                body: JSON.stringify(params),
-              }
-            )
-            .catch(error => console.log(error));
-  }
-}
+      .post(`${PPL_BASE}${PPL_SEARCH}`, {
+        body: JSON.stringify(params),
+      })
+      .catch((error) => {
+        console.error(error);
+        if (errorHandler) errorHandler(error);
+      });
+  };
+}