[Maps] replace singleton inspectorAdapters with per map inspector adapter instance (#31009)

* [Maps] replace singleton inspectorAdapters with per map inspector adapter instance

* pass inspectorAdapters to all source constructors in renderEditor

* rename non_serializable_kibana_instances to non_serializable_instances, fix test jest test broken by import

Author: nreese

x-pack/plugins/maps/public/angular/map_controller.js

@@ -27,9 +27,10 @@ import {
   FLYOUT_STATE
 } from '../store/ui';
 import { getUniqueIndexPatternIds } from '../selectors/map_selectors';
+import { getInspectorAdapters } from '../store/non_serializable_instances';
 import { Inspector } from 'ui/inspector';
 import { DocTitleProvider } from 'ui/doc_title';
-import { inspectorAdapters, indexPatternService } from '../kibana_services';
+import { indexPatternService } from '../kibana_services';
 import { SavedObjectSaveModal } from 'ui/saved_objects/components/saved_object_save_modal';
 import { showSaveModal } from 'ui/saved_objects/show_saved_object_save_modal';
 import { toastNotifications } from 'ui/notify';
@@ -49,7 +50,6 @@ app.controller('GisMapController', ($scope, $route, config, kbnUrl, localStorage
   let unsubscribe;
 
   const store = createMapStore();
-  inspectorAdapters.requests.reset();
 
   $scope.$listen(globalState, 'fetch_with_changes', (diff) => {
     if (diff.includes('time')) {
@@ -252,6 +252,7 @@ app.controller('GisMapController', ($scope, $route, config, kbnUrl, localStorage
     description: 'Open Inspector',
     testId: 'openInspectorButton',
     run() {
+      const inspectorAdapters = getInspectorAdapters(store.getState());
       Inspector.open(inspectorAdapters, {});
     }
   }, {

x-pack/plugins/maps/public/components/layer_addpanel/index.js

@@ -8,6 +8,7 @@ import { connect } from 'react-redux';
 import { AddLayerPanel } from './view';
 import { getFlyoutDisplay, updateFlyout, FLYOUT_STATE } from '../../store/ui';
 import { getTemporaryLayers, getMapColors } from '../../selectors/map_selectors';
+import { getInspectorAdapters } from '../../store/non_serializable_instances';
 import {
   addLayer,
   removeLayer,
@@ -23,6 +24,7 @@ function mapStateToProps(state = {}) {
     return tmp.some((layer) => layer.isLayerLoading());
   }
   return {
+    inspectorAdapters: getInspectorAdapters(state),
     flyoutVisible: getFlyoutDisplay(state) !== FLYOUT_STATE.NONE,
     layerLoading: isLoading(),
     temporaryLayers: !_.isEmpty(getTemporaryLayers(state)),

x-pack/plugins/maps/public/components/layer_addpanel/view.js

@@ -23,12 +23,8 @@ import {
 
 export class AddLayerPanel extends Component {
 
-  constructor() {
-    super();
-
-    this.state = {
-      sourceType: null,
-    };
+  state = {
+    sourceType: null,
   }
 
   _previewLayer = (source) => {
@@ -107,7 +103,8 @@ export class AddLayerPanel extends Component {
 
   _renderSourceEditor() {
     const editorProperties = {
-      onPreviewSource: this._previewLayer
+      onPreviewSource: this._previewLayer,
+      inspectorAdapters: this.props.inspectorAdapters,
     };
 
     const Source = ALL_SOURCES.find((Source) => {

x-pack/plugins/maps/public/components/map/mb/index.js

@@ -16,12 +16,14 @@ import {
   setLayerErrorStatus,
 } from '../../../actions/store_actions';
 import { getLayerList, getMapReady, getGoto } from '../../../selectors/map_selectors';
+import { getInspectorAdapters } from '../../../store/non_serializable_instances';
 
 function mapStateToProps(state = {}) {
   return {
     isMapReady: getMapReady(state),
     layerList: getLayerList(state),
-    goto: getGoto(state)
+    goto: getGoto(state),
+    inspectorAdapters: getInspectorAdapters(state),
   };
 }
 

x-pack/plugins/maps/public/components/map/mb/view.js

@@ -8,7 +8,6 @@ import _ from 'lodash';
 import React from 'react';
 import { ResizeChecker } from 'ui/resize_checker';
 import { syncLayerOrder, removeOrphanedSourcesAndLayers, createMbMapInstance } from './utils';
-import { inspectorAdapters } from '../../../kibana_services';
 import { DECIMAL_DEGREES_PRECISION, ZOOM_PRECISION } from '../../../../common/constants';
 import mapboxgl from 'mapbox-gl';
 
@@ -217,7 +216,7 @@ export class MBMapContainer extends React.Component {
   };
 
   _syncMbMapWithInspector = () => {
-    if (!this.props.isMapReady || !inspectorAdapters.map) {
+    if (!this.props.isMapReady || !this.props.inspectorAdapters.map) {
       return;
     }
 
@@ -226,7 +225,7 @@ export class MBMapContainer extends React.Component {
       zoom: this._mbMap.getZoom(),
 
     };
-    inspectorAdapters.map.setMapState({
+    this.props.inspectorAdapters.map.setMapState({
       stats,
       style: this._mbMap.getStyle(),
     });

x-pack/plugins/maps/public/components/widget_overlay/attribution_control/view.js

@@ -15,11 +15,8 @@ import {
 
 export class AttributionControl  extends React.Component {
 
-  constructor() {
-    super();
-    this.state = {
-      uniqueAttributions: []
-    };
+  state = {
+    uniqueAttributions: []
   }
 
   componentDidMount() {

x-pack/plugins/maps/public/kibana_services.js

@@ -4,11 +4,8 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import chrome from 'ui/chrome';
 import { uiModules } from 'ui/modules';
 import { SearchSourceProvider } from 'ui/courier';
-import { RequestAdapter } from 'ui/inspector/adapters';
-import { MapAdapter } from './inspector/adapters/map_adapter';
 import { timefilter } from 'ui/timefilter/timefilter';
 import { getRequestInspectorStats, getResponseInspectorStats } from 'ui/courier/utils/courier_inspector_utils';
 
@@ -17,14 +14,7 @@ export let indexPatternService;
 export let SearchSource;
 export let emsServiceSettings;
 
-export const inspectorAdapters = {
-  requests: new RequestAdapter(),
-};
-if (chrome.getInjected('showMapsInspectorAdapter', false)) {
-  inspectorAdapters.map = new MapAdapter();
-}
-
-export async function fetchSearchSourceAndRecordWithInspector({ searchSource, requestId, requestName, requestDesc }) {
+export async function fetchSearchSourceAndRecordWithInspector({ searchSource, requestId, requestName, requestDesc, inspectorAdapters }) {
   const inspectorRequest = inspectorAdapters.requests.start(
     requestName,
     { id: requestId, description: requestDesc });

x-pack/plugins/maps/public/selectors/map_selectors.js

@@ -14,11 +14,11 @@ import { VectorStyle } from '../shared/layers/styles/vector_style';
 import { HeatmapStyle } from '../shared/layers/styles/heatmap_style';
 import { TileStyle } from '../shared/layers/styles/tile_style';
 import { timefilter } from 'ui/timefilter';
-
+import { getInspectorAdapters } from '../store/non_serializable_instances';
 import { copyPersistentState, TRACKED_LAYER_DESCRIPTOR } from '../store/util';
 
-function createLayerInstance(layerDescriptor) {
-  const source = createSourceInstance(layerDescriptor.sourceDescriptor);
+function createLayerInstance(layerDescriptor, inspectorAdapters) {
+  const source = createSourceInstance(layerDescriptor.sourceDescriptor, inspectorAdapters);
   const style = createStyleInstance(layerDescriptor.style);
   switch (layerDescriptor.type) {
     case TileLayer.type:
@@ -32,14 +32,14 @@ function createLayerInstance(layerDescriptor) {
   }
 }
 
-function createSourceInstance(sourceDescriptor) {
+function createSourceInstance(sourceDescriptor, inspectorAdapters) {
   const Source = ALL_SOURCES.find(Source => {
     return Source.type === sourceDescriptor.type;
   });
   if (!Source) {
     throw new Error(`Unrecognized sourceType ${sourceDescriptor.type}`);
   }
-  return new Source(sourceDescriptor);
+  return new Source(sourceDescriptor, inspectorAdapters);
 }
 
 
@@ -131,9 +131,10 @@ export const getDataFilters = createSelector(
 
 export const getLayerList = createSelector(
   getLayerListRaw,
-  (layerDescriptorList) => {
+  getInspectorAdapters,
+  (layerDescriptorList, inspectorAdapters) => {
     return layerDescriptorList.map(layerDescriptor =>
-      createLayerInstance(layerDescriptor));
+      createLayerInstance(layerDescriptor, inspectorAdapters));
   });
 
 export const getSelectedLayer = createSelector(

x-pack/plugins/maps/public/selectors/map_selectors.test.js

@@ -6,6 +6,11 @@
 
 jest.mock('../shared/layers/vector_layer', () => {});
 jest.mock('../shared/layers/sources/all_sources', () => {});
+jest.mock('../store/non_serializable_instances', () => ({
+  getInspectorAdapters: () => {
+    return {};
+  }
+}));
 jest.mock('ui/timefilter', () => ({
   timefilter: {
     getTime: () => {

x-pack/plugins/maps/public/shared/components/map_listing.js

@@ -29,20 +29,16 @@ export const EMPTY_FILTER = '';
 
 export class MapListing extends React.Component {
 
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      hasInitialFetchReturned: false,
-      isFetchingItems: false,
-      showDeleteModal: false,
-      showLimitError: false,
-      filter: EMPTY_FILTER,
-      items: [],
-      selectedIds: [],
-      page: 0,
-      perPage: 20,
-    };
+  state = {
+    hasInitialFetchReturned: false,
+    isFetchingItems: false,
+    showDeleteModal: false,
+    showLimitError: false,
+    filter: EMPTY_FILTER,
+    items: [],
+    selectedIds: [],
+    page: 0,
+    perPage: 20,
   }
 
   componentWillMount() {