feat(webui): Display notification for errors from Presto. (#1188)

Author: davemarco

components/webui/client/src/pages/SearchPage/SearchControls/Presto/presto-search-requests.ts

@@ -45,7 +45,8 @@ const handlePrestoQuerySubmit = (payload: PrestoQueryJobCreationSchema) => {
     // User should NOT be able to submit a new query while an existing query is in progress.
     if (
         searchUiState !== SEARCH_UI_STATE.DEFAULT &&
-        searchUiState !== SEARCH_UI_STATE.DONE
+        searchUiState !== SEARCH_UI_STATE.DONE &&
+        searchUiState !== SEARCH_UI_STATE.FAILED
     ) {
         console.error("Cannot submit query while existing query is in progress.");
 

components/webui/client/src/pages/SearchPage/SearchControls/QueryInput/index.tsx

@@ -57,7 +57,10 @@ const QueryInput = () => {
                     return (v ?? 0) + PROGRESS_INCREMENT;
                 });
             }, PROGRESS_INTERVAL_MILLIS);
-        } else if (searchUiState === SEARCH_UI_STATE.DONE) {
+        } else if (
+            searchUiState === SEARCH_UI_STATE.DONE ||
+            searchUiState === SEARCH_UI_STATE.FAILED
+        ) {
             clearInterval(intervalIdRef.current);
             intervalIdRef.current = 0;
             setPseudoProgress(null);
@@ -72,7 +75,8 @@ const QueryInput = () => {
     useEffect(() => {
         if (
             searchUiState === SEARCH_UI_STATE.DEFAULT ||
-            searchUiState === SEARCH_UI_STATE.DONE
+            searchUiState === SEARCH_UI_STATE.DONE ||
+            searchUiState === SEARCH_UI_STATE.FAILED
         ) {
             inputRef.current?.focus();
         }

components/webui/client/src/pages/SearchPage/SearchControls/search-requests.ts

@@ -57,7 +57,9 @@ const handleQuerySubmit = (payload: QueryJobCreationSchema) => {
     // User should NOT be able to submit a new query while an existing query is in progress.
     if (
         store.searchUiState !== SEARCH_UI_STATE.DEFAULT &&
-        store.searchUiState !== SEARCH_UI_STATE.DONE
+        store.searchUiState !== SEARCH_UI_STATE.DONE &&
+        store.searchUiState !== SEARCH_UI_STATE.FAILED
+
     ) {
         console.error("Cannot submit query while existing query is in progress.");
 

components/webui/client/src/pages/SearchPage/SearchQueryStatus/Results.tsx

@@ -46,6 +46,9 @@ const Results = () => {
         case SEARCH_UI_STATE.DONE:
             textType = "success";
             break;
+        case SEARCH_UI_STATE.FAILED:
+            textType = "danger";
+            break;
         default:
             textType = "secondary";
     }

components/webui/client/src/pages/SearchPage/SearchState/typings.ts

@@ -21,6 +21,11 @@ enum SEARCH_UI_STATE {
      * When the query is complete or cancelled.
      */
     DONE,
+
+    /**
+     * When the query failed due to an error.
+     */
+    FAILED,
 }
 
 export {SEARCH_UI_STATE};

components/webui/client/src/pages/SearchPage/SearchState/useUpdateStateWithMetadata.ts

@@ -1,6 +1,10 @@
 import {useEffect} from "react";
 
-import {SEARCH_SIGNAL} from "@common/index.js";
+import {
+    PRESTO_SEARCH_SIGNAL,
+    SEARCH_SIGNAL,
+} from "@common/index.js";
+import {notification} from "antd";
 
 import useSearchStore from "./index";
 import {SEARCH_UI_STATE} from "./typings";
@@ -9,19 +13,30 @@ import {useResultsMetadata} from "./useResultsMetadata";
 
 /**
  * Custom hook to update the UI state to `DONE` when the results metadata signal indicates
- * that the query is complete.
+ * that the query is complete, or `FAILED` if the query fails. If there is an error, it will
+ * also display a notification with the error message.
  */
 const useUiUpdateOnDoneSignal = () => {
     const {updateSearchUiState} = useSearchStore();
     const resultsMetadata = useResultsMetadata();
     useEffect(() => {
-        if (null === resultsMetadata
-        ) {
+        if (null === resultsMetadata) {
             return;
         }
 
         if (resultsMetadata.lastSignal === SEARCH_SIGNAL.RESP_DONE) {
             updateSearchUiState(SEARCH_UI_STATE.DONE);
+        } else if (resultsMetadata.lastSignal === PRESTO_SEARCH_SIGNAL.FAILED) {
+            updateSearchUiState(SEARCH_UI_STATE.FAILED);
+            notification.error({
+                description: resultsMetadata.errorMsg || "An error occurred during search",
+                duration: 15,
+                key: `search-failed-${resultsMetadata._id}`,
+                message: resultsMetadata.errorName || "Search Failed",
+                pauseOnHover: true,
+                placement: "bottomRight",
+                showProgress: true,
+            });
         }
     }, [
         resultsMetadata,

components/webui/common/index.ts

@@ -90,21 +90,20 @@ enum SEARCH_SIGNAL {
 
 /**
  * Presto search-related signals.
- *
- * Note: Using type instead of enum to match `presto-client-node` type definition.
  */
-type PRESTO_SEARCH_SIGNAL =
-    | "WAITING_FOR_PREREQUISITES"
-    | "QUEUED"
-    | "WAITING_FOR_RESOURCES"
-    | "DISPATCHING"
-    | "PLANNING"
-    | "STARTING"
-    | "RUNNING"
-    | "FINISHING"
-    | "FINISHED"
-    | "CANCELED"
-    | "FAILED";
+enum PRESTO_SEARCH_SIGNAL {
+    WAITING_FOR_PREREQUISITES = "WAITING_FOR_PREREQUISITES",
+    QUEUED = "QUEUED",
+    WAITING_FOR_RESOURCES = "WAITING_FOR_RESOURCES",
+    DISPATCHING = "DISPATCHING",
+    PLANNING = "PLANNING",
+    STARTING = "STARTING",
+    RUNNING = "RUNNING",
+    FINISHING = "FINISHING",
+    FINISHED = "FINISHED",
+    CANCELED = "CANCELED",
+    FAILED = "FAILED",
+}
 
 /**
  * CLP query engines.
@@ -125,16 +124,17 @@ interface SearchResultsMetadataDocument {
     // eslint-disable-next-line no-warning-comments
     // TODO: Replace with Nullable<string> when the `@common` directory refactoring is completed.
     errorMsg: string | null;
+    errorName: string | null;
     lastSignal: SEARCH_SIGNAL | PRESTO_SEARCH_SIGNAL;
     numTotalResults?: number;
     queryEngine: CLP_QUERY_ENGINES;
 }
 export {
     CLP_QUERY_ENGINES,
+    PRESTO_SEARCH_SIGNAL,
     SEARCH_SIGNAL,
 };
 export type {
-    PRESTO_SEARCH_SIGNAL,
     SearchResultsMetadataDocument,
     ClientToServerEvents,
     Err,

components/webui/server/src/routes/api/presto-search/index.ts

@@ -6,6 +6,7 @@ import {StatusCodes} from "http-status-codes";
 
 import {
     CLP_QUERY_ENGINES,
+    PRESTO_SEARCH_SIGNAL,
     type SearchResultsMetadataDocument,
 } from "../../../../../common/index.js";
 import settings from "../../../../settings.json" with {type: "json"};
@@ -104,10 +105,30 @@ const plugin: FastifyPluginAsyncTypebox = async (fastify) => {
                             if (false === isResolved) {
                                 isResolved = true;
                                 reject(new Error("Presto search failed"));
+                            } else {
+                                searchResultsMetadataCollection.updateOne(
+                                    {_id: searchJobId},
+                                    {
+                                        $set: {
+                                            errorMsg: error.message,
+                                            errorName: ("errorName" in error) ?
+                                                error.errorName :
+                                                null,
+                                            lastSignal: PRESTO_SEARCH_SIGNAL.FAILED,
+                                        },
+                                    }
+                                ).catch((err: unknown) => {
+                                    request.log.error(
+                                        err,
+                                        "Failed to update Presto error metadata"
+                                    );
+                                });
                             }
                         },
                         query: queryString,
                         state: (_, queryId, stats) => {
+                            // Type cast `presto-client` string literal type to our enum type.
+                            const newState = stats.state as PRESTO_SEARCH_SIGNAL;
                             request.log.info({
                                 searchJobId: queryId,
                                 state: stats.state,
@@ -117,8 +138,9 @@ const plugin: FastifyPluginAsyncTypebox = async (fastify) => {
                             if (false === isResolved) {
                                 searchResultsMetadataCollection.insertOne({
                                     _id: queryId,
-                                    lastSignal: stats.state,
                                     errorMsg: null,
+                                    errorName: null,
+                                    lastSignal: newState,
                                     queryEngine: CLP_QUERY_ENGINES.PRESTO,
                                 }).catch((err: unknown) => {
                                     request.log.error(err, "Failed to insert Presto metadata");
@@ -129,7 +151,7 @@ const plugin: FastifyPluginAsyncTypebox = async (fastify) => {
                                 // Update metadata on subsequent calls
                                 searchResultsMetadataCollection.updateOne(
                                     {_id: queryId},
-                                    {$set: {lastSignal: stats.state}}
+                                    {$set: {lastSignal: newState}}
                                 ).catch((err: unknown) => {
                                     request.log.error(err, "Failed to update Presto metadata");
                                 });

components/webui/server/src/routes/api/search/index.ts

@@ -113,8 +113,9 @@ const plugin: FastifyPluginAsyncTypebox = async (fastify) => {
 
             await searchResultsMetadataCollection.insertOne({
                 _id: searchJobId.toString(),
-                lastSignal: SEARCH_SIGNAL.RESP_QUERYING,
                 errorMsg: null,
+                errorName: null,
+                lastSignal: SEARCH_SIGNAL.RESP_QUERYING,
                 queryEngine: queryEngine,
             });
 
@@ -207,8 +208,8 @@ const plugin: FastifyPluginAsyncTypebox = async (fastify) => {
                     },
                     {
                         $set: {
-                            lastSignal: SEARCH_SIGNAL.RESP_DONE,
                             errorMsg: "Query cancelled before it could be completed.",
+                            lastSignal: SEARCH_SIGNAL.RESP_DONE,
                         },
                     }
                 );