simplify ES|QL columns fetching functionality

elastic · Nov 27, 2024 · 08d36c7 · 08d36c7
1 parent 625ffa9
commit 08d36c7
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 37 deletions.
diff --git a/...ugins/security_solution/public/detection_engine/rule_creation/logic/esql_query_columns.ts b/...ugins/security_solution/public/detection_engine/rule_creation/logic/esql_query_columns.ts
@@ -10,6 +10,7 @@ import type {
   QueryClient,
   QueryFunction,
   QueryKey,
+  UseQueryResult,
 } from '@tanstack/react-query';
 import { useQuery } from '@tanstack/react-query';
 import type { DatatableColumn } from '@kbn/expressions-plugin/common';
@@ -23,38 +24,24 @@ interface FetchEsqlQueryColumnsParams {
   queryClient: QueryClient;
 }
 
-export async function fetchEsqlQueryColumns({
+export function fetchEsqlQueryColumns({
   esqlQuery,
   queryClient,
 }: FetchEsqlQueryColumnsParams): Promise<DatatableColumn[]> {
-  const data = await queryClient.fetchQuery(createSharedTanstackQueryOptions(esqlQuery));
-
-  if (data instanceof Error) {
-    throw data;
-  }
-
-  return data;
-}
-
-interface UseEsqlQueryColumnsResult {
-  columns: DatatableColumn[];
-  isLoading: boolean;
+  return queryClient.fetchQuery(createSharedTanstackQueryOptions(esqlQuery));
 }
 
-export function useEsqlQueryColumns(esqlQuery: string): UseEsqlQueryColumnsResult {
-  const { data, isLoading } = useQuery({
+export function useEsqlQueryColumns(esqlQuery: string): UseQueryResult<DatatableColumn[]> {
+  return useQuery({
     ...createSharedTanstackQueryOptions(esqlQuery),
     retryOnMount: false,
     refetchOnMount: false,
     refetchOnWindowFocus: false,
+    keepPreviousData: false,
   });
-
-  return { columns: !data || data instanceof Error ? [] : data, isLoading };
 }
 
-function createSharedTanstackQueryOptions(
-  esqlQuery: string
-): FetchQueryOptions<DatatableColumn[] | Error> {
+function createSharedTanstackQueryOptions(esqlQuery: string): FetchQueryOptions<DatatableColumn[]> {
   return {
     queryKey: [esqlQuery.trim()],
     queryFn: queryEsqlColumnsFactory(esqlQuery),
@@ -63,22 +50,16 @@ function createSharedTanstackQueryOptions(
   };
 }
 
-function queryEsqlColumnsFactory(
-  esqlQuery: string
-): QueryFunction<DatatableColumn[] | Error, QueryKey> {
-  return async ({ signal }) => {
+function queryEsqlColumnsFactory(esqlQuery: string): QueryFunction<DatatableColumn[], QueryKey> {
+  return ({ signal }) => {
     if (esqlQuery.trim() === '') {
       return [];
     }
 
-    try {
-      return await getESQLQueryColumns({
-        esqlQuery,
-        search: KibanaServices.get().data.search.search,
-        signal,
-      });
-    } catch (e) {
-      return e;
-    }
+    return getESQLQueryColumns({
+      esqlQuery,
+      search: KibanaServices.get().data.search.search,
+      signal,
+    });
   };
 }
diff --git a/...detection_engine/rule_creation_ui/components/esql_autocomplete/use_esql_fields_options.ts b/...detection_engine/rule_creation_ui/components/esql_autocomplete/use_esql_fields_options.ts
@@ -35,10 +35,10 @@ type UseEsqlFieldOptions = (
  * fetches ES|QL fields and convert them to Combobox options
  */
 export const useEsqlFieldOptions: UseEsqlFieldOptions = (esqlQuery, fieldType) => {
-  const { columns, isLoading } = useEsqlQueryColumns(esqlQuery ?? '');
+  const { data: columns, isLoading } = useEsqlQueryColumns(esqlQuery ?? '');
 
   const options = useMemo(() => {
-    return esqlToOptions(columns, fieldType);
+    return esqlToOptions(columns ?? [], fieldType);
   }, [columns, fieldType]);
 
   return {

diff --git a/...urity_solution/public/detection_engine/rule_creation_ui/hooks/use_all_esql_rule_fields.ts b/...urity_solution/public/detection_engine/rule_creation_ui/hooks/use_all_esql_rule_fields.ts
@@ -29,10 +29,10 @@ type UseEsqlFields = (esqlQuery: string | undefined) => {
  * fetches ES|QL fields and convert them to DataViewBase fields
  */
 export const useEsqlFields: UseEsqlFields = (esqlQuery) => {
-  const { columns, isLoading } = useEsqlQueryColumns(esqlQuery ?? '');
+  const { data: columns, isLoading } = useEsqlQueryColumns(esqlQuery ?? '');
 
   const fields = useMemo(() => {
-    return esqlToFields(columns);
+    return esqlToFields(columns ?? []);
   }, [columns]);
 
   return {