[Maps] Update layer dependencies to NP (#59585) (#60753)

* Layers dir up through sources migrated. Kibana services updated * Create separate init method for plugin setup, leverage in embeddable factory * Add NP timefilter, http, IndexPatternSelect * Pull vis color utils into Maps * Add NP dark mode and toast handling. Some fixes * Init autocomplete and indexPattern via normal paths * Test fixes and clean up * Update index pattern and autocomplete refs. Make getters functions * Fix remaining broken jest tests * Update inspector start contract * Clean up plugin and legacy files. Fix type issues * Set inspector in plugin start method not external function * Keep both injected var functions (legacy and NP). Move inspector init back to separate init function * Add back ts-ignore on NP kibana services import
elastic · Mar 20, 2020 · e466309 · e466309
1 parent f0059a3
commit e466309
Show file tree

Hide file tree

Showing 31 changed files with 207 additions and 109 deletions.
diff --git a/x-pack/legacy/plugins/maps/public/angular/get_initial_layers.js b/x-pack/legacy/plugins/maps/public/angular/get_initial_layers.js
@@ -6,7 +6,7 @@
 import _ from 'lodash';
 import { KibanaTilemapSource } from '../layers/sources/kibana_tilemap_source';
 import { EMSTMSSource } from '../layers/sources/ems_tms_source';
-import chrome from 'ui/chrome';
+import { getInjectedVarFunc } from '../kibana_services';
 import { getKibanaTileMap } from '../meta';
 
 export function getInitialLayers(layerListJSON, initialLayers = []) {
@@ -22,7 +22,7 @@ export function getInitialLayers(layerListJSON, initialLayers = []) {
     return [layer.toLayerDescriptor(), ...initialLayers];
   }
 
-  const isEmsEnabled = chrome.getInjected('isEmsEnabled', true);
+  const isEmsEnabled = getInjectedVarFunc()('isEmsEnabled', true);
   if (isEmsEnabled) {
     const descriptor = EMSTMSSource.createDescriptor({ isAutoSelect: true });
     const source = new EMSTMSSource(descriptor);

diff --git a/x-pack/legacy/plugins/maps/public/angular/get_initial_layers.test.js b/x-pack/legacy/plugins/maps/public/angular/get_initial_layers.test.js
@@ -7,16 +7,17 @@
 jest.mock('../meta', () => {
   return {};
 });
-
-jest.mock('ui/chrome', () => {
-  return {};
-});
+jest.mock('../kibana_services');
 
 import { getInitialLayers } from './get_initial_layers';
 
 const layerListNotProvided = undefined;
 
 describe('Saved object has layer list', () => {
+  beforeEach(() => {
+    require('../kibana_services').getInjectedVarFunc = () => jest.fn();
+  });
+
   it('Should get initial layers from saved object', () => {
     const layerListFromSavedObject = [
       {
@@ -64,7 +65,7 @@ describe('EMS is enabled', () => {
     require('../meta').getKibanaTileMap = () => {
       return null;
     };
-    require('ui/chrome').getInjected = key => {
+    require('../kibana_services').getInjectedVarFunc = () => key => {
       switch (key) {
         case 'emsTileLayerId':
           return {
@@ -75,7 +76,7 @@ describe('EMS is enabled', () => {
         case 'isEmsEnabled':
           return true;
         default:
-          throw new Error(`Unexpected call to chrome.getInjected with key ${key}`);
+          throw new Error(`Unexpected call to getInjectedVarFunc with key ${key}`);
       }
     };
   });
@@ -109,12 +110,12 @@ describe('EMS is not enabled', () => {
       return null;
     };
 
-    require('ui/chrome').getInjected = key => {
+    require('../kibana_services').getInjectedVarFunc = () => key => {
       switch (key) {
         case 'isEmsEnabled':
           return false;
         default:
-          throw new Error(`Unexpected call to chrome.getInjected with key ${key}`);
+          throw new Error(`Unexpected call to getInjectedVarFunc with key ${key}`);
       }
     };
   });

diff --git a/x-pack/legacy/plugins/maps/public/angular/map_controller.js b/x-pack/legacy/plugins/maps/public/angular/map_controller.js
@@ -15,7 +15,7 @@ import { i18n } from '@kbn/i18n';
 import { capabilities } from 'ui/capabilities';
 import { render, unmountComponentAtNode } from 'react-dom';
 import { uiModules } from 'ui/modules';
-import { timefilter } from 'ui/timefilter';
+import { getTimeFilter, getIndexPatternService, getInspector } from '../kibana_services';
 import { Provider } from 'react-redux';
 // eslint-disable-next-line @kbn/eslint/no-restricted-paths
 import { createMapStore } from '../../../../../plugins/maps/public/reducers/store';
@@ -52,7 +52,7 @@ import {
 // eslint-disable-next-line @kbn/eslint/no-restricted-paths
 import { getInspectorAdapters } from '../../../../../plugins/maps/public/reducers/non_serializable_instances';
 import { docTitle } from 'ui/doc_title';
-import { indexPatternService, getInspector } from '../kibana_services';
+
 import { toastNotifications } from 'ui/notify';
 import { getInitialLayers } from './get_initial_layers';
 import { getInitialQuery } from './get_initial_query';
@@ -396,7 +396,7 @@ app.controller(
       const indexPatterns = [];
       const getIndexPatternPromises = nextIndexPatternIds.map(async indexPatternId => {
         try {
-          const indexPattern = await indexPatternService.get(indexPatternId);
+          const indexPattern = await getIndexPatternService().get(indexPatternId);
           indexPatterns.push(indexPattern);
         } catch (err) {
           // unable to fetch index pattern
@@ -519,8 +519,8 @@ app.controller(
     }
 
     // Hide angular timepicer/refresh UI from top nav
-    timefilter.disableTimeRangeSelector();
-    timefilter.disableAutoRefreshSelector();
+    getTimeFilter().disableTimeRangeSelector();
+    getTimeFilter().disableAutoRefreshSelector();
     $scope.showDatePicker = true; // used by query-bar directive to enable timepikcer in query bar
     $scope.topNavMenu = [
       {

diff --git a/x-pack/legacy/plugins/maps/public/components/geo_field_with_index.ts b/x-pack/legacy/plugins/maps/public/components/geo_field_with_index.ts
@@ -7,7 +7,7 @@
 
 // Maps can contain geo fields from multiple index patterns. GeoFieldWithIndex is used to:
 // 1) Combine the geo field along with associated index pattern state.
-// 2) Package asynchronously looked up state via indexPatternService to avoid
+// 2) Package asynchronously looked up state via getIndexPatternService() to avoid
 // PITA of looking up async state in downstream react consumers.
 export type GeoFieldWithIndex = {
   geoFieldName: string;

diff --git a/...egacy/plugins/maps/public/connected_components/layer_panel/filter_editor/filter_editor.js b/...egacy/plugins/maps/public/connected_components/layer_panel/filter_editor/filter_editor.js
@@ -20,7 +20,7 @@ import {
 
 import { FormattedMessage } from '@kbn/i18n/react';
 import { i18n } from '@kbn/i18n';
-import { indexPatternService } from '../../../kibana_services';
+import { getIndexPatternService } from '../../../kibana_services';
 import { GlobalFilterCheckbox } from '../../../components/global_filter_checkbox';
 
 import { npStart } from 'ui/new_platform';
@@ -47,7 +47,7 @@ export class FilterEditor extends Component {
     const indexPatterns = [];
     const getIndexPatternPromises = indexPatternIds.map(async indexPatternId => {
       try {
-        const indexPattern = await indexPatternService.get(indexPatternId);
+        const indexPattern = await getIndexPatternService().get(indexPatternId);
         indexPatterns.push(indexPattern);
       } catch (err) {
         // unable to fetch index pattern

diff --git a/...legacy/plugins/maps/public/connected_components/layer_panel/join_editor/resources/join.js b/...legacy/plugins/maps/public/connected_components/layer_panel/join_editor/resources/join.js
@@ -14,7 +14,7 @@ import { WhereExpression } from './where_expression';
 import { GlobalFilterCheckbox } from '../../../../components/global_filter_checkbox';
 
 import { indexPatterns } from '../../../../../../../../../src/plugins/data/public';
-import { indexPatternService } from '../../../../kibana_services';
+import { getIndexPatternService } from '../../../../kibana_services';
 
 export class Join extends Component {
   state = {
@@ -39,7 +39,7 @@ export class Join extends Component {
 
     let indexPattern;
     try {
-      indexPattern = await indexPatternService.get(indexPatternId);
+      indexPattern = await getIndexPatternService().get(indexPatternId);
     } catch (err) {
       if (this._isMounted) {
         this.setState({

diff --git a/...ins/maps/public/connected_components/layer_panel/join_editor/resources/join_expression.js b/...ins/maps/public/connected_components/layer_panel/join_editor/resources/join_expression.js
@@ -19,11 +19,10 @@ import { i18n } from '@kbn/i18n';
 import { SingleFieldSelect } from '../../../../components/single_field_select';
 import { FormattedMessage } from '@kbn/i18n/react';
 import { getTermsFields } from '../../../../index_pattern_util';
-
-import { indexPatternService } from '../../../../kibana_services';
-
-import { npStart } from 'ui/new_platform';
-const { IndexPatternSelect } = npStart.plugins.data.ui;
+import {
+  getIndexPatternService,
+  getIndexPatternSelectComponent,
+} from '../../../../kibana_services';
 
 export class JoinExpression extends Component {
   state = {
@@ -44,7 +43,7 @@ export class JoinExpression extends Component {
 
   _onRightSourceChange = async indexPatternId => {
     try {
-      const indexPattern = await indexPatternService.get(indexPatternId);
+      const indexPattern = await getIndexPatternService().get(indexPatternId);
       this.props.onRightSourceChange({
         indexPatternId,
         indexPatternTitle: indexPattern.title,
@@ -106,6 +105,7 @@ export class JoinExpression extends Component {
     if (!this.props.leftValue) {
       return null;
     }
+    const IndexPatternSelect = getIndexPatternSelectComponent();
 
     return (
       <EuiFormRow

diff --git a/x-pack/legacy/plugins/maps/public/embeddable/map_embeddable_factory.js b/x-pack/legacy/plugins/maps/public/embeddable/map_embeddable_factory.js
@@ -14,7 +14,7 @@ import {
 } from '../../../../../../src/legacy/core_plugins/embeddable_api/public/np_ready/public';
 import { setup } from '../../../../../../src/legacy/core_plugins/embeddable_api/public/np_ready/public/legacy';
 import { MapEmbeddable } from './map_embeddable';
-import { indexPatternService } from '../kibana_services';
+import { getIndexPatternService } from '../kibana_services';
 
 import { createMapPath, MAP_SAVED_OBJECT_TYPE, APP_ICON } from '../../common/constants';
 // eslint-disable-next-line @kbn/eslint/no-restricted-paths
@@ -24,8 +24,8 @@ import { getQueryableUniqueIndexPatternIds } from '../selectors/map_selectors';
 import { getInitialLayers } from '../angular/get_initial_layers';
 import { mergeInputWithSavedMap } from './merge_input_with_saved_map';
 import '../angular/services/gis_map_saved_object_loader';
-import { bindSetupCoreAndPlugins } from '../plugin';
-import { npSetup } from 'ui/new_platform';
+import { bindSetupCoreAndPlugins, bindStartCoreAndPlugins } from '../plugin';
+import { npSetup, npStart } from 'ui/new_platform';
 
 export class MapEmbeddableFactory extends EmbeddableFactory {
   type = MAP_SAVED_OBJECT_TYPE;
@@ -40,7 +40,9 @@ export class MapEmbeddableFactory extends EmbeddableFactory {
         getIconForSavedObject: () => APP_ICON,
       },
     });
+    // Init required services. Necessary while in legacy
     bindSetupCoreAndPlugins(npSetup.core, npSetup.plugins);
+    bindStartCoreAndPlugins(npStart.core, npStart.plugins);
   }
   isEditable() {
     return capabilities.get().maps.save;
@@ -76,7 +78,7 @@ export class MapEmbeddableFactory extends EmbeddableFactory {
 
     const promises = queryableIndexPatternIds.map(async indexPatternId => {
       try {
-        return await indexPatternService.get(indexPatternId);
+        return await getIndexPatternService().get(indexPatternId);
       } catch (error) {
         // Unable to load index pattern, better to not throw error so map embeddable can render
         // Error will be surfaced by map embeddable since it too will be unable to locate the index pattern

diff --git a/x-pack/legacy/plugins/maps/public/index_pattern_util.js b/x-pack/legacy/plugins/maps/public/index_pattern_util.js
@@ -4,14 +4,14 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { indexPatternService } from './kibana_services';
+import { getIndexPatternService } from './kibana_services';
 import { indexPatterns } from '../../../../../src/plugins/data/public';
 import { ES_GEO_FIELD_TYPE } from '../common/constants';
 
 export async function getIndexPatternsFromIds(indexPatternIds = []) {
   const promises = [];
   indexPatternIds.forEach(id => {
-    const indexPatternPromise = indexPatternService.get(id);
+    const indexPatternPromise = getIndexPatternService().get(id);
     if (indexPatternPromise) {
       promises.push(indexPatternPromise);
     }

diff --git a/x-pack/legacy/plugins/maps/public/kibana_services.js b/x-pack/legacy/plugins/maps/public/kibana_services.js
@@ -6,12 +6,18 @@
 
 import { esFilters, search } from '../../../../../src/plugins/data/public';
 const { getRequestInspectorStats, getResponseInspectorStats } = search;
-import { npStart } from 'ui/new_platform';
 
 export const SPATIAL_FILTER_TYPE = esFilters.FILTERS.SPATIAL_FILTER;
 export { SearchSource } from '../../../../../src/plugins/data/public';
-export const indexPatternService = npStart.plugins.data.indexPatterns;
-export const autocompleteService = npStart.plugins.data.autocomplete;
+
+let indexPatternService;
+export const setIndexPatternService = dataIndexPatterns =>
+  (indexPatternService = dataIndexPatterns);
+export const getIndexPatternService = () => indexPatternService;
+
+let autocompleteService;
+export const setAutocompleteService = dataAutoComplete => (autocompleteService = dataAutoComplete);
+export const getAutocompleteService = () => autocompleteService;
 
 let licenseId;
 export const setLicenseId = latestLicenseId => (licenseId = latestLicenseId);
@@ -31,6 +37,31 @@ export const getFileUploadComponent = () => {
   return fileUploadPlugin.JsonUploadAndParse;
 };
 
+let getInjectedVar;
+export const setInjectedVarFunc = getInjectedVarFunc => (getInjectedVar = getInjectedVarFunc);
+export const getInjectedVarFunc = () => getInjectedVar;
+
+let uiSettings;
+export const setUiSettings = coreUiSettings => (uiSettings = coreUiSettings);
+export const getUiSettings = () => uiSettings;
+
+let indexPatternSelectComponent;
+export const setIndexPatternSelect = indexPatternSelect =>
+  (indexPatternSelectComponent = indexPatternSelect);
+export const getIndexPatternSelectComponent = () => indexPatternSelectComponent;
+
+let coreHttp;
+export const setHttp = http => (coreHttp = http);
+export const getHttp = () => coreHttp;
+
+let dataTimeFilter;
+export const setTimeFilter = timeFilter => (dataTimeFilter = timeFilter);
+export const getTimeFilter = () => dataTimeFilter;
+
+let toast;
+export const setToasts = notificationToast => (toast = notificationToast);
+export const getToasts = () => toast;
+
 export async function fetchSearchSourceAndRecordWithInspector({
   searchSource,
   requestId,

diff --git a/x-pack/legacy/plugins/maps/public/layers/joins/inner_join.test.js b/x-pack/legacy/plugins/maps/public/layers/joins/inner_join.test.js
@@ -7,7 +7,6 @@
 import { InnerJoin } from './inner_join';
 
 jest.mock('../../kibana_services', () => {});
-jest.mock('ui/timefilter', () => {});
 jest.mock('../vector_layer', () => {});
 
 const rightSource = {

diff --git a/x-pack/legacy/plugins/maps/public/layers/sources/ems_tms_source/ems_tms_source.js b/x-pack/legacy/plugins/maps/public/layers/sources/ems_tms_source/ems_tms_source.js
@@ -5,7 +5,6 @@
  */
 
 import _ from 'lodash';
-import chrome from 'ui/chrome';
 import React from 'react';
 import { AbstractTMSSource } from '../tms_source';
 import { VectorTileLayer } from '../../vector_tile_layer';
@@ -16,6 +15,7 @@ import { UpdateSourceEditor } from './update_source_editor';
 import { i18n } from '@kbn/i18n';
 import { getDataSourceLabel } from '../../../../common/i18n_getters';
 import { EMS_TMS } from '../../../../common/constants';
+import { getInjectedVarFunc, getUiSettings } from '../../../kibana_services';
 
 export class EMSTMSSource extends AbstractTMSSource {
   static type = EMS_TMS;
@@ -152,8 +152,8 @@ export class EMSTMSSource extends AbstractTMSSource {
       return this._descriptor.id;
     }
 
-    const isDarkMode = chrome.getUiSettingsClient().get('theme:darkMode', false);
-    const emsTileLayerId = chrome.getInjected('emsTileLayerId');
+    const isDarkMode = getUiSettings().get('theme:darkMode', false);
+    const emsTileLayerId = getInjectedVarFunc()('emsTileLayerId');
     return isDarkMode ? emsTileLayerId.dark : emsTileLayerId.bright;
   }
 }
diff --git a/x-pack/legacy/plugins/maps/public/layers/sources/ems_unavailable_message.js b/x-pack/legacy/plugins/maps/public/layers/sources/ems_unavailable_message.js
@@ -4,11 +4,11 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import chrome from 'ui/chrome';
+import { getInjectedVarFunc } from '../../kibana_services';
 import { i18n } from '@kbn/i18n';
 
 export function getEmsUnavailableMessage() {
-  const isEmsEnabled = chrome.getInjected('isEmsEnabled', true);
+  const isEmsEnabled = getInjectedVarFunc()('isEmsEnabled', true);
   if (isEmsEnabled) {
     return i18n.translate('xpack.maps.source.ems.noAccessDescription', {
       defaultMessage:

diff --git a/x-pack/legacy/plugins/maps/public/layers/sources/es_geo_grid_source/create_source_editor.js b/x-pack/legacy/plugins/maps/public/layers/sources/es_geo_grid_source/create_source_editor.js
@@ -10,7 +10,7 @@ import PropTypes from 'prop-types';
 
 import { SingleFieldSelect } from '../../../components/single_field_select';
 import { RENDER_AS } from '../../../../common/constants';
-import { indexPatternService } from '../../../kibana_services';
+import { getIndexPatternService, getIndexPatternSelectComponent } from '../../../kibana_services';
 import { NoIndexPatternCallout } from '../../../components/no_index_pattern_callout';
 import { i18n } from '@kbn/i18n';
 
@@ -20,9 +20,6 @@ import {
   getAggregatableGeoFields,
 } from '../../../index_pattern_util';
 
-import { npStart } from 'ui/new_platform';
-const { IndexPatternSelect } = npStart.plugins.data.ui;
-
 const requestTypeOptions = [
   {
     label: i18n.translate('xpack.maps.source.esGeoGrid.gridRectangleDropdownOption', {
@@ -92,7 +89,7 @@ export class CreateSourceEditor extends Component {
 
     let indexPattern;
     try {
-      indexPattern = await indexPatternService.get(indexPatternId);
+      indexPattern = await getIndexPatternService().get(indexPatternId);
     } catch (err) {
       // index pattern no longer exists
       return;
@@ -205,6 +202,8 @@ export class CreateSourceEditor extends Component {
   }
 
   _renderIndexPatternSelect() {
+    const IndexPatternSelect = getIndexPatternSelectComponent();
+
     return (
       <EuiFormRow
         label={i18n.translate('xpack.maps.source.esGeoGrid.indexPatternLabel', {