[Discover] Remove services from component dependencies

src/plugins/discover/public/application/context/context_app.test.tsx

@@ -14,17 +14,49 @@ import { mockTopNavMenu } from './__mocks__/top_nav_menu';
 import { ContextAppContent } from './context_app_content';
 import { indexPatternMock } from '../../__mocks__/index_pattern';
 import { ContextApp } from './context_app';
-import { setServices } from '../../kibana_services';
 import { DiscoverServices } from '../../build_services';
 import { indexPatternsMock } from '../../__mocks__/index_patterns';
 import { act } from 'react-dom/test-utils';
 import { uiSettingsMock } from '../../__mocks__/ui_settings';
 import { themeServiceMock } from '../../../../../core/public/mocks';
+import { KibanaContextProvider } from '../../../../kibana_react/public';
 
 const mockFilterManager = createFilterManagerMock();
 const mockNavigationPlugin = { ui: { TopNavMenu: mockTopNavMenu } };
 
 describe('ContextApp test', () => {
+  const services = {
+    data: {
+      search: {
+        searchSource: {
+          createEmpty: jest.fn(),
+        },
+      },
+    },
+    capabilities: {
+      discover: {
+        save: true,
+      },
+      indexPatterns: {
+        save: true,
+      },
+    },
+    indexPatterns: indexPatternsMock,
+    toastNotifications: { addDanger: () => {} },
+    navigation: mockNavigationPlugin,
+    core: {
+      notifications: { toasts: [] },
+      theme: { theme$: themeServiceMock.createStartContract().theme$ },
+    },
+    history: () => {},
+    fieldFormats: {
+      getDefaultInstance: jest.fn(() => ({ convert: (value: unknown) => value })),
+      getFormatterForField: jest.fn(() => ({ convert: (value: unknown) => value })),
+    },
+    filterManager: mockFilterManager,
+    uiSettings: uiSettingsMock,
+  } as unknown as DiscoverServices;
+
   const defaultProps = {
     indexPattern: indexPatternMock,
     anchorId: 'mocked_anchor_id',
@@ -41,42 +73,16 @@ describe('ContextApp test', () => {
     useDefaultBehaviors: true,
   };
 
-  beforeEach(() => {
-    setServices({
-      data: {
-        search: {
-          searchSource: {
-            createEmpty: jest.fn(),
-          },
-        },
-      },
-      capabilities: {
-        discover: {
-          save: true,
-        },
-        indexPatterns: {
-          save: true,
-        },
-      },
-      indexPatterns: indexPatternsMock,
-      toastNotifications: { addDanger: () => {} },
-      navigation: mockNavigationPlugin,
-      core: {
-        notifications: { toasts: [] },
-        theme: { theme$: themeServiceMock.createStartContract().theme$ },
-      },
-      history: () => {},
-      fieldFormats: {
-        getDefaultInstance: jest.fn(() => ({ convert: (value: unknown) => value })),
-        getFormatterForField: jest.fn(() => ({ convert: (value: unknown) => value })),
-      },
-      filterManager: mockFilterManager,
-      uiSettings: uiSettingsMock,
-    } as unknown as DiscoverServices);
-  });
+  const mountComponent = () => {
+    return mountWithIntl(
+      <KibanaContextProvider services={services}>
+        <ContextApp {...defaultProps} />
+      </KibanaContextProvider>
+    );
+  };
 
   it('renders correctly', async () => {
-    const component = mountWithIntl(<ContextApp {...defaultProps} />);
+    const component = mountComponent();
     await waitFor(() => {
       expect(component.find(ContextAppContent).length).toBe(1);
       const topNavMenu = component.find(mockTopNavMenu);
@@ -86,7 +92,7 @@ describe('ContextApp test', () => {
   });
 
   it('should set filters correctly', async () => {
-    const component = mountWithIntl(<ContextApp {...defaultProps} />);
+    const component = mountComponent();
 
     await act(async () => {
       component.find(ContextAppContent).invoke('addFilter')(

src/plugins/discover/public/application/context/context_app.tsx

@@ -17,7 +17,6 @@ import { DOC_TABLE_LEGACY, SEARCH_FIELDS_FROM_SOURCE } from '../../../common';
 import { ContextErrorMessage } from './components/context_error_message';
 import { DataView, DataViewField } from '../../../../data/common';
 import { LoadingStatus } from './services/context_query_state';
-import { getServices } from '../../kibana_services';
 import { AppState, isEqualFilters } from './services/context_state';
 import { useColumns } from '../../utils/use_data_grid_columns';
 import { useContextAppState } from './utils/use_context_app_state';
@@ -26,6 +25,7 @@ import { popularizeField } from '../../utils/popularize_field';
 import { ContextAppContent } from './context_app_content';
 import { SurrDocType } from './services/context';
 import { DocViewFilterFn } from '../../services/doc_views/doc_views_types';
+import { useDiscoverServices } from '../../utils/use_discover_services';
 
 const ContextAppContentMemoized = memo(ContextAppContent);
 
@@ -35,7 +35,7 @@ export interface ContextAppProps {
 }
 
 export const ContextApp = ({ indexPattern, anchorId }: ContextAppProps) => {
-  const services = getServices();
+  const services = useDiscoverServices();
   const { uiSettings, capabilities, indexPatterns, navigation, filterManager } = services;
 
   const isLegacy = useMemo(() => uiSettings.get(DOC_TABLE_LEGACY), [uiSettings]);
@@ -56,7 +56,6 @@ export const ContextApp = ({ indexPattern, anchorId }: ContextAppProps) => {
       indexPattern,
       appState,
       useNewFieldsApi,
-      services,
     });
   /**
    * Reset state when anchor changes
@@ -163,7 +162,6 @@ export const ContextApp = ({ indexPattern, anchorId }: ContextAppProps) => {
               </EuiText>
               <EuiSpacer size="s" />
               <ContextAppContentMemoized
-                services={services}
                 indexPattern={indexPattern}
                 useNewFieldsApi={useNewFieldsApi}
                 isLegacy={isLegacy}

src/plugins/discover/public/application/context/context_app_content.test.tsx

@@ -13,22 +13,23 @@ import { ActionBar } from './components/action_bar/action_bar';
 import { AppState, GetStateReturn } from './services/context_state';
 import { SortDirection } from 'src/plugins/data/common';
 import { ContextAppContent, ContextAppContentProps } from './context_app_content';
-import { getServices, setServices } from '../../kibana_services';
 import { LoadingStatus } from './services/context_query_state';
 import { indexPatternMock } from '../../__mocks__/index_pattern';
 import { DiscoverGrid } from '../../components/discover_grid/discover_grid';
 import { discoverServiceMock } from '../../__mocks__/services';
 import { DocTableWrapper } from '../../components/doc_table/doc_table_wrapper';
 import { EsHitRecordList } from '../types';
+import { KibanaContextProvider } from '../../../../kibana_react/public';
 
 describe('ContextAppContent test', () => {
-  let hit;
-  let defaultProps: ContextAppContentProps;
-
-  beforeEach(() => {
-    setServices(discoverServiceMock);
-
-    hit = {
+  const mountComponent = ({
+    anchorStatus,
+    isLegacy,
+  }: {
+    anchorStatus?: LoadingStatus;
+    isLegacy?: boolean;
+  }) => {
+    const hit = {
       _id: '123',
       _index: 'test_index',
       _score: null,
@@ -48,12 +49,12 @@ describe('ContextAppContent test', () => {
       },
       sort: [1603114502000, 2092],
     };
-    defaultProps = {
+    const props = {
       columns: ['order_date', '_source'],
       indexPattern: indexPatternMock,
       appState: {} as unknown as AppState,
       stateContainer: {} as unknown as GetStateReturn,
-      anchorStatus: LoadingStatus.LOADED,
+      anchorStatus: anchorStatus || LoadingStatus.LOADED,
       predecessorsStatus: LoadingStatus.LOADED,
       successorsStatus: LoadingStatus.LOADED,
       rows: [hit] as unknown as EsHitRecordList,
@@ -67,34 +68,36 @@ describe('ContextAppContent test', () => {
       onAddColumn: () => {},
       onRemoveColumn: () => {},
       onSetColumns: () => {},
-      services: getServices(),
       sort: [['order_date', 'desc']] as Array<[string, SortDirection]>,
-      isLegacy: true,
+      isLegacy: isLegacy ?? true,
       setAppState: () => {},
       addFilter: () => {},
     } as unknown as ContextAppContentProps;
-  });
+
+    return mountWithIntl(
+      <KibanaContextProvider services={discoverServiceMock}>
+        <ContextAppContent {...props} />
+      </KibanaContextProvider>
+    );
+  };
 
   it('should render legacy table correctly', () => {
-    const component = mountWithIntl(<ContextAppContent {...defaultProps} />);
+    const component = mountComponent({});
     expect(component.find(DocTableWrapper).length).toBe(1);
     const loadingIndicator = findTestSubject(component, 'contextApp_loadingIndicator');
     expect(loadingIndicator.length).toBe(0);
     expect(component.find(ActionBar).length).toBe(2);
   });
 
   it('renders loading indicator', () => {
-    const props = { ...defaultProps };
-    props.anchorStatus = LoadingStatus.LOADING;
-    const component = mountWithIntl(<ContextAppContent {...props} />);
+    const component = mountComponent({ anchorStatus: LoadingStatus.LOADING });
     const loadingIndicator = findTestSubject(component, 'contextApp_loadingIndicator');
     expect(component.find(DocTableWrapper).length).toBe(1);
     expect(loadingIndicator.length).toBe(1);
   });
 
   it('should render discover grid correctly', () => {
-    const props = { ...defaultProps, isLegacy: false };
-    const component = mountWithIntl(<ContextAppContent {...props} />);
+    const component = mountComponent({ isLegacy: false });
     expect(component.find(DiscoverGrid).length).toBe(1);
   });
 });

src/plugins/discover/public/application/context/context_app_content.tsx

@@ -17,19 +17,18 @@ import { DiscoverGrid } from '../../components/discover_grid/discover_grid';
 import { DocViewFilterFn } from '../../services/doc_views/doc_views_types';
 import { AppState } from './services/context_state';
 import { SurrDocType } from './services/context';
-import { DiscoverServices } from '../../build_services';
 import { MAX_CONTEXT_SIZE, MIN_CONTEXT_SIZE } from './services/constants';
 import { DocTableContext } from '../../components/doc_table/doc_table_context';
 import { EsHitRecordList } from '../types';
 import { SortPairArr } from '../../components/doc_table/lib/get_sort';
 import { ElasticSearchHit } from '../../types';
+import { useDiscoverServices } from '../../utils/use_discover_services';
 
 export interface ContextAppContentProps {
   columns: string[];
   onAddColumn: (columnsName: string) => void;
   onRemoveColumn: (columnsName: string) => void;
   onSetColumns: (columnsNames: string[], hideTimeColumn: boolean) => void;
-  services: DiscoverServices;
   indexPattern: DataView;
   predecessorCount: number;
   successorCount: number;
@@ -60,7 +59,6 @@ export function ContextAppContent({
   onAddColumn,
   onRemoveColumn,
   onSetColumns,
-  services,
   indexPattern,
   predecessorCount,
   successorCount,
@@ -75,7 +73,7 @@ export function ContextAppContent({
   setAppState,
   addFilter,
 }: ContextAppContentProps) {
-  const { uiSettings: config } = services;
+  const { uiSettings: config } = useDiscoverServices();
 
   const [expandedDoc, setExpandedDoc] = useState<ElasticSearchHit | undefined>();
   const isAnchorLoading =
@@ -154,7 +152,6 @@ export function ContextAppContent({
             sort={sort as SortPairArr[]}
             isSortEnabled={false}
             showTimeCol={showTimeCol}
-            services={services}
             useNewFieldsApi={useNewFieldsApi}
             isPaginationEnabled={false}
             controlColumnIds={controlColumnIds}

src/plugins/discover/public/application/context/context_app_route.tsx

@@ -14,16 +14,16 @@ import { ContextApp } from './context_app';
 import { getRootBreadcrumbs } from '../../utils/breadcrumbs';
 import { LoadingIndicator } from '../../components/common/loading_indicator';
 import { useIndexPattern } from '../../utils/use_index_pattern';
-import { DiscoverRouteProps } from '../types';
 import { useMainRouteBreadcrumb } from '../../utils/use_navigation_props';
+import { useDiscoverServices } from '../../utils/use_discover_services';
 
 export interface ContextUrlParams {
   indexPatternId: string;
   id: string;
 }
 
-export function ContextAppRoute(props: DiscoverRouteProps) {
-  const { services } = props;
+export function ContextAppRoute() {
+  const services = useDiscoverServices();
   const { chrome } = services;
 
   const { indexPatternId, id } = useParams<ContextUrlParams>();

src/plugins/discover/public/application/context/services/context.predecessors.test.ts

@@ -11,9 +11,7 @@ import { get, last } from 'lodash';
 import { DataView, SortDirection } from 'src/plugins/data/common';
 import { createContextSearchSourceStub } from './_stubs';
 import { fetchSurroundingDocs, SurrDocType } from './context';
-import { setServices } from '../../../kibana_services';
-import { Query } from '../../../../../data/public';
-import { DiscoverServices } from '../../../build_services';
+import { DataPublicPluginStart, Query } from '../../../../../data/public';
 import { EsHitRecord, EsHitRecordList } from '../../types';
 
 const MS_PER_DAY = 24 * 60 * 60 * 1000;
@@ -29,13 +27,15 @@ interface Timestamp {
 }
 
 describe('context predecessors', function () {
+  let dataPluginMock: DataPublicPluginStart;
   let fetchPredecessors: (
     timeValIso: string,
     timeValNr: number,
     tieBreakerField: string,
     tieBreakerValue: number,
     size: number
   ) => Promise<EsHitRecordList>;
+
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   let mockSearchSource: any;
   const indexPattern = {
@@ -48,16 +48,13 @@ describe('context predecessors', function () {
   describe('function fetchPredecessors', function () {
     beforeEach(() => {
       mockSearchSource = createContextSearchSourceStub('@timestamp');
-
-      setServices({
-        data: {
-          search: {
-            searchSource: {
-              createEmpty: jest.fn().mockImplementation(() => mockSearchSource),
-            },
+      dataPluginMock = {
+        search: {
+          searchSource: {
+            createEmpty: jest.fn().mockImplementation(() => mockSearchSource),
           },
         },
-      } as unknown as DiscoverServices);
+      } as unknown as DataPublicPluginStart;
 
       fetchPredecessors = (timeValIso, timeValNr, tieBreakerField, tieBreakerValue, size = 10) => {
         const anchor = {
@@ -74,7 +71,8 @@ describe('context predecessors', function () {
           tieBreakerField,
           SortDirection.desc,
           size,
-          []
+          [],
+          dataPluginMock
         );
       };
     });
@@ -192,15 +190,13 @@ describe('context predecessors', function () {
     beforeEach(() => {
       mockSearchSource = createContextSearchSourceStub('@timestamp');
 
-      setServices({
-        data: {
-          search: {
-            searchSource: {
-              createEmpty: jest.fn().mockImplementation(() => mockSearchSource),
-            },
+      dataPluginMock = {
+        search: {
+          searchSource: {
+            createEmpty: jest.fn().mockImplementation(() => mockSearchSource),
           },
         },
-      } as unknown as DiscoverServices);
+      } as unknown as DataPublicPluginStart;
 
       fetchPredecessors = (timeValIso, timeValNr, tieBreakerField, tieBreakerValue, size = 10) => {
         const anchor = {
@@ -218,6 +214,7 @@ describe('context predecessors', function () {
           SortDirection.desc,
           size,
           [],
+          dataPluginMock,
           true
         );
       };