change to pass in query result directly

Signed-off-by: abbyhu2000 <[email protected]>

src/plugins/data/public/ui/search_bar/create_search_bar.tsx

@@ -144,9 +144,8 @@ export function createSearchBar({ core, storage, data }: StatefulSearchBarDeps)
       filters: props.filters,
       filterManager: data.query.filterManager,
     });
-    const { query, queryResult } = useQueryStringManager({
+    const { query } = useQueryStringManager({
       queryString: data.query.queryString,
-      data$: props.data$,
     });
 
     const { timeRange, refreshInterval } = useTimefilter({
@@ -212,7 +211,7 @@ export function createSearchBar({ core, storage, data }: StatefulSearchBarDeps)
           datePickerRef={props.datePickerRef}
           isFilterBarPortable={props.isFilterBarPortable}
           {...overrideDefaultBehaviors(props)}
-          queryResult={queryResult}
+          queryResult={props.queryResult}
         />
       </OpenSearchDashboardsContextProvider>
     );

src/plugins/data/public/ui/search_bar/lib/use_query_string_manager.ts

@@ -29,21 +29,18 @@
  */
 
 import { useState, useEffect, useCallback } from 'react';
-import { BehaviorSubject, Subscription } from 'rxjs';
+import { Subscription } from 'rxjs';
 import { Query } from '../../..';
 import { QueryStringContract } from '../../../query/query_string';
-import { SearchData } from '../../../../../discover/public';
 
 interface UseQueryStringProps {
   query?: Query;
   queryString: QueryStringContract;
-  data$?: BehaviorSubject<SearchData>;
 }
 
 export const useQueryStringManager = (props: UseQueryStringProps) => {
   // Filters should be either what's passed in the initial state or the current state of the filter manager
   const [query, setQuery] = useState(() => props.query || props.queryString.getQuery());
-  const [queryResult, setQueryResult] = useState<SearchData | undefined>(undefined);
 
   useEffect(() => {
     const subscriptions = new Subscription();
@@ -63,15 +60,6 @@ export const useQueryStringManager = (props: UseQueryStringProps) => {
     };
   }, [props.queryString]);
 
-  useEffect(() => {
-    if (!props.data$) {
-      return;
-    }
-    const subscription = props.data$.subscribe((d) => {
-      setQueryResult(d);
-    });
-  }, [props.data$]);
-
   // Use callback to memoize the function
   const updateQuery = useCallback(
     (newQueryPartial: Partial<Query>) => {
@@ -85,6 +73,5 @@ export const useQueryStringManager = (props: UseQueryStringProps) => {
   return {
     query,
     updateQuery,
-    queryResult,
   };
 };

src/plugins/data/public/ui/search_bar/search_bar.tsx

@@ -95,7 +95,6 @@ export interface SearchBarOwnProps {
   onRefresh?: (payload: { dateRange: TimeRange }) => void;
   indicateNoData?: boolean;
   queryResult?: SearchData;
-  data$?: BehaviorSubject<SearchData>;
 }
 
 export type SearchBarProps = SearchBarOwnProps & SearchBarInjectedDeps;

src/plugins/discover/public/application/view_components/canvas/top_nav.tsx

@@ -21,6 +21,8 @@ import { useDispatch, setSavedQuery, useSelector } from '../../utils/state_manag
 
 import './discover_canvas.scss';
 import { TopNavMenuItemRenderType } from '../../../../../navigation/public';
+import { SearchData } from '../utils';
+import { query } from '../../../../../console/server/lib/spec_definitions/js/query/dsl';
 
 export interface TopNavProps {
   opts: {
@@ -37,6 +39,7 @@ export const TopNav = ({ opts, showSaveQuery, isEnhancementsEnabled }: TopNavPro
   const { data$, inspectorAdapters, savedSearch, indexPattern } = useDiscoverContext();
   const [indexPatterns, setIndexPatterns] = useState<IndexPattern[] | undefined>(undefined);
   const [screenTitle, setScreenTitle] = useState<string>('');
+  const [queryResult, setQueryResult] = useState<SearchData | undefined>(undefined);
   const state = useSelector((s) => s.discover);
   const dispatch = useDispatch();
 
@@ -113,6 +116,15 @@ export const TopNav = ({ opts, showSaveQuery, isEnhancementsEnabled }: TopNavPro
     );
   }, [savedSearch?.title]);
 
+  useEffect(() => {
+    if (!data$) {
+      return;
+    }
+    const subscription = data$.subscribe((d) => {
+      setQueryResult(d);
+    });
+  }, [data$]);
+
   const showDatePicker = useMemo(() => (indexPattern ? indexPattern.isTimeBased() : false), [
     indexPattern,
   ]);
@@ -160,7 +172,7 @@ export const TopNav = ({ opts, showSaveQuery, isEnhancementsEnabled }: TopNavPro
         datePickerRef={opts?.optionalRef?.datePickerRef}
         groupActions={showActionsInGroup}
         screenTitle={screenTitle}
-        data$={data$}
+        queryResult={queryResult}
       />
     </>
   );

src/plugins/navigation/public/top_nav_menu/top_nav_menu.tsx

@@ -84,7 +84,7 @@ export type TopNavMenuProps = Omit<StatefulSearchBarProps, 'showDatePicker'> &
      * ```
      */
     setMenuMountPoint?: (menuMount: MountPoint | undefined) => void;
-    data$?: BehaviorSubject<SearchData>;
+    queryResult?: SearchData;
   };
 
 /*
@@ -105,7 +105,7 @@ export function TopNavMenu(props: TopNavMenuProps): ReactElement | null {
     dataSourceMenuConfig,
     groupActions,
     screenTitle,
-    data$,
+    queryResult,
     ...searchBarProps
   } = props;
 
@@ -160,7 +160,7 @@ export function TopNavMenu(props: TopNavMenuProps): ReactElement | null {
       <SearchBar
         {...searchBarProps}
         showDatePicker={![TopNavMenuItemRenderType.OMITTED, false].includes(showDatePicker!)}
-        data$={props.data$}
+        queryResult={queryResult}
         {...overrides}
       />
     );