Inline angular function to reduce re-renderings

src/plugins/discover/public/application/angular/discover.js

@@ -319,6 +319,8 @@ function discoverController($route, $scope, Promise) {
     setAppState,
     data,
     stateContainer,
+    searchSessionManager,
+    refetch$,
   };
 
   const inspectorAdapters = ($scope.opts.inspectorAdapters = {
@@ -571,13 +573,6 @@ function discoverController($route, $scope, Promise) {
       });
   };
 
-  $scope.handleRefresh = function (_payload, isUpdate) {
-    if (isUpdate === false) {
-      searchSessionManager.removeSearchSessionIdFromURL({ replace: false });
-      refetch$.next();
-    }
-  };
-
   function getDimensions(aggs, timeRange) {
     const [metric, agg] = aggs;
     agg.params.timeRange = timeRange;

src/plugins/discover/public/application/components/discover.test.tsx

@@ -25,6 +25,8 @@ import { indexPatternWithTimefieldMock } from '../../__mocks__/index_pattern_wit
 import { calcFieldCounts } from '../helpers/calc_field_counts';
 import { DiscoverProps } from './types';
 import { RequestAdapter } from '../../../../inspector/common';
+import { Subject } from 'rxjs';
+import { DiscoverSearchSessionManager } from '../angular/discover_search_session';
 
 const mockNavigation = navigationPluginMock.createStartContract();
 
@@ -73,8 +75,10 @@ function getProps(indexPattern: IndexPattern): DiscoverProps {
       indexPatternList: (indexPattern as unknown) as Array<SavedObject<IndexPatternAttributes>>,
       inspectorAdapters: { requests: {} as RequestAdapter },
       navigateTo: jest.fn(),
+      refetch$: {} as Subject<undefined>,
       sampleSize: 10,
       savedSearch: savedSearchMock,
+      searchSessionManager: {} as DiscoverSearchSessionManager,
       setHeaderActionMenu: jest.fn(),
       timefield: indexPattern.timeFieldName || '',
       setAppState: jest.fn(),
@@ -86,7 +90,6 @@ function getProps(indexPattern: IndexPattern): DiscoverProps {
     rows: esHits,
     searchSource: searchSourceMock,
     state: { columns: [] },
-    updateQuery: jest.fn(),
   };
 }
 

src/plugins/discover/public/application/components/discover.tsx

@@ -66,7 +66,6 @@ export function Discover({
   searchSource,
   state,
   timeRange,
-  updateQuery,
   unmappedFieldsConfig,
 }: DiscoverProps) {
   const [expandedDoc, setExpandedDoc] = useState<ElasticSearchHit | undefined>(undefined);
@@ -92,6 +91,15 @@ export function Discover({
   const contentCentered = resultState === 'uninitialized';
   const isLegacy = services.uiSettings.get('doc_table:legacy');
   const useNewFieldsApi = !services.uiSettings.get(SEARCH_FIELDS_FROM_SOURCE);
+  const updateQuery = useCallback(
+    (_payload, isUpdate?: boolean) => {
+      if (isUpdate === false) {
+        opts.searchSessionManager.removeSearchSessionIdFromURL({ replace: false });
+        opts.refetch$.next();
+      }
+    },
+    [opts]
+  );
 
   const { onAddColumn, onRemoveColumn, onMoveColumn, onSetColumns } = useMemo(
     () =>
@@ -195,7 +203,8 @@ export function Discover({
           indexPattern={indexPattern}
           opts={opts}
           onOpenInspector={onOpenInspector}
-          state={state}
+          query={state.query}
+          savedQuery={state.savedQuery}
           updateQuery={updateQuery}
         />
         <EuiPageBody className="dscPageBody" aria-describedby="savedSearchTitle">

src/plugins/discover/public/application/components/discover_topnav.test.tsx

@@ -10,7 +10,7 @@ import React from 'react';
 import { mountWithIntl } from '@kbn/test/jest';
 import { indexPatternMock } from '../../__mocks__/index_pattern';
 import { DiscoverServices } from '../../build_services';
-import { AppState, GetStateReturn } from '../angular/discover_state';
+import { GetStateReturn } from '../angular/discover_state';
 import { savedSearchMock } from '../../__mocks__/saved_search';
 import { dataPluginMock } from '../../../../data/public/mocks';
 import { createFilterManagerMock } from '../../../../data/public/query/filter_manager/filter_manager.mock';
@@ -20,9 +20,11 @@ import { SavedObject } from '../../../../../core/types';
 import { DiscoverTopNav, DiscoverTopNavProps } from './discover_topnav';
 import { RequestAdapter } from '../../../../inspector/common/adapters/request';
 import { TopNavMenu } from '../../../../navigation/public';
+import { Query } from '../../../../data/common';
+import { DiscoverSearchSessionManager } from '../angular/discover_search_session';
+import { Subject } from 'rxjs';
 
 function getProps(): DiscoverTopNavProps {
-  const state = ({} as unknown) as AppState;
   const services = ({
     navigation: {
       ui: { TopNavMenu },
@@ -45,15 +47,18 @@ function getProps(): DiscoverTopNavProps {
       indexPatternList: (indexPattern as unknown) as Array<SavedObject<IndexPatternAttributes>>,
       inspectorAdapters: { requests: {} as RequestAdapter },
       navigateTo: jest.fn(),
+      refetch$: {} as Subject<undefined>,
       sampleSize: 10,
       savedSearch: savedSearchMock,
+      searchSessionManager: {} as DiscoverSearchSessionManager,
       services,
       setAppState: jest.fn(),
       setHeaderActionMenu: jest.fn(),
       stateContainer: {} as GetStateReturn,
       timefield: indexPattern.timeFieldName || '',
     },
-    state,
+    query: {} as Query,
+    savedQuery: '',
     updateQuery: jest.fn(),
     onOpenInspector: jest.fn(),
   };

src/plugins/discover/public/application/components/discover_topnav.tsx

@@ -8,17 +8,21 @@
 import React, { useMemo } from 'react';
 import { DiscoverProps } from './types';
 import { getTopNavLinks } from './top_nav/get_top_nav_links';
+import { Query, TimeRange } from '../../../../data/common/query';
 
-export type DiscoverTopNavProps = Pick<
-  DiscoverProps,
-  'indexPattern' | 'updateQuery' | 'state' | 'opts'
-> & { onOpenInspector: () => void };
+export type DiscoverTopNavProps = Pick<DiscoverProps, 'indexPattern' | 'opts'> & {
+  onOpenInspector: () => void;
+  query?: Query;
+  savedQuery?: string;
+  updateQuery: (payload: { dateRange: TimeRange; query?: Query }, isUpdate?: boolean) => void;
+};
 
 export const DiscoverTopNav = ({
   indexPattern,
   opts,
   onOpenInspector,
-  state,
+  query,
+  savedQuery,
   updateQuery,
 }: DiscoverTopNavProps) => {
   const showDatePicker = useMemo(() => indexPattern.isTimeBased(), [indexPattern]);
@@ -58,9 +62,9 @@ export const DiscoverTopNav = ({
       indexPatterns={[indexPattern]}
       onQuerySubmit={updateQuery}
       onSavedQueryIdChange={updateSavedQueryId}
-      query={state.query}
+      query={query}
       setMenuMountPoint={opts.setHeaderActionMenu}
-      savedQueryId={state.savedQuery}
+      savedQueryId={savedQuery}
       screenTitle={opts.savedSearch.title}
       showDatePicker={showDatePicker}
       showSaveQuery={!!opts.services.capabilities.discover.saveQuery}

src/plugins/discover/public/application/components/types.ts

@@ -7,6 +7,7 @@
  */
 
 import { IUiSettingsClient, MountPoint, SavedObject } from 'kibana/public';
+import { Subject } from 'rxjs';
 import { Chart } from '../angular/helpers/point_series';
 import { IndexPattern } from '../../../../data/common/index_patterns/index_patterns';
 import { ElasticSearchHit } from '../doc_views/doc_views_types';
@@ -17,13 +18,12 @@ import {
   FilterManager,
   IndexPatternAttributes,
   ISearchSource,
-  Query,
-  TimeRange,
 } from '../../../../data/public';
 import { SavedSearch } from '../../saved_searches';
 import { AppState, GetStateReturn } from '../angular/discover_state';
 import { RequestAdapter } from '../../../../inspector/common';
 import { DiscoverServices } from '../../build_services';
+import { DiscoverSearchSessionManager } from '../angular/discover_search_session';
 
 export interface DiscoverProps {
   /**
@@ -97,10 +97,18 @@ export interface DiscoverProps {
      * List of available index patterns
      */
     indexPatternList: Array<SavedObject<IndexPatternAttributes>>;
+    /**
+     * Refetch observable
+     */
+    refetch$: Subject<undefined>;
     /**
      * Kibana core services used by discover
      */
     services: DiscoverServices;
+    /**
+     * Helps with state management of search session
+     */
+    searchSessionManager: DiscoverSearchSessionManager;
     /**
      * The number of documents that can be displayed in the table/grid
      */
@@ -150,10 +158,6 @@ export interface DiscoverProps {
    * Currently selected time range
    */
   timeRange?: { from: string; to: string };
-  /**
-   * Function to update the actual query
-   */
-  updateQuery: (payload: { dateRange: TimeRange; query?: Query }, isUpdate?: boolean) => void;
   /**
    * An object containing properties for proper handling of unmapped fields in the UI
    */